面试手写代码一览

码农天地 -
面试手写代码一览
防抖函数
const debounce = (fn, wait) => {
     let _ = ''
     return (...arg) => {
         clearTimeout(_)
             _ = setTimeout(() => {
             fn.apply(this, arg)
         }, wait)
     }
}
input.addEventListener("input", debounce(ajax, 1000));
节流函数
const throttle = (fn, s) => {
 let a = +new Date(),
    _ 
 return (...arg) => {
    let b = +new Date() - a
        if (b > s) {
        _ = setTimeout(() => {
       fn(arg);
        _ = ''
     }, s)
        a = +new Date()
    }
 }
}

input.addEventListener("input", throttle(ajax, 1000));
深拷贝(解决循环引用)

function clone(target, map = new WeakMap()) {
    if (typeof target === 'object') {
        let cloneTarget = Array.isArray(target) ? [] : {};
        if (map.get(target)) {
            return map.get(target);
        }
        map.set(target, cloneTarget);
        for (const key in target) {
            cloneTarget[key] = clone(target[key], map);
        }
        return cloneTarget;
    } else {
        return target;
    }
}
函数克里化
let curry = fn => ju = (...arg) => arg.length == fn.length ? fn(...arg) : (...args) => ju(...arg, ...args)
js进行浮点运算
let float_ = (...arg) => {    
    let len = Math.max(...arg.map(i => {
        let [, _] = String(i).split('.')
        console.log(_)
        return _ ? _.length : ''
    }))
    return arg.reduce((all, i) => all + i * len / len, 0)
}
手写ajax
let ajax=obj=>{
    let _=Object.assign({
        methods:'GET',
        url:'www.xxx.com',
        data:''
    },obj)
    return new Promise((resolve,reject)=>{
        let xhr = new XMLHttpRequest,
            sendData = ''
        if(_.data){
            for(let i in _.data){
                sendData += `&${i}=${_.data[i]}`
            }
        }
        let url = sendData ? `${obj.url}?${sendData}` : obj.url
        if (methods = 'GET') {
            xhr.open('GET', obj.url, true)
            xhr.send(sendData)
        }
        if (methods = 'POST') {
            xhr.open('POST', obj.url, true)
            xhr.send(sendData.slice(1))
        }
        xhr.onreadystatechange = function() {
            if (xhr.readyState == 4) {
                if (xhr.status == 200 || XHR.status === 304) {
                    resolve(JSON.parse(xhr.responseText))
                } else {
                    reject(Error)
                }
            }
        }
    })
}
队列函数(无论是否异步按照顺序调用函数)
let stack=[],
    index=0
function next(){
    var fn=stack[i]
    index += 1 
    if (typeof fn == 'function') {
        fn();
    }
}    
function fn1(){
    console.log('第一个调用')
    next();
}
function fn2(){
    setTimeout(function() {
        console.log('第二个被调用');
        next();
    }, 1000)
}
function fn3() {
    console.log('第三个调用');
    next();
}
stack.push(fn1, fn2, fn3)
next();
使用async写异步函数(图片是否被正确加载)
async function load(url) {
    var image = new Image();
    image.onload = function() { //图片加载成功,调用resolve方法
        return console.log(image)
    };
    image.onerror = function() { //图片加载不成功,调用reject方法
        throw '错误'
    };
    image.src = url;
}
运行
~async function img() {
    return await load(
        'https://www.xxx.com'
    )
}()
Instanceof函数
function Instanceof_(obj, fn) {
    while (true) {
        if (obj.__proto__ === null) return false
        if (obj.__proto__ === fn.prototype) return true
         obj= obj.__proto__;
    }
}
call函数
Function.prototype.call_ = function() {
    let obj = Array.from(arguments)[0] || window,
        arg = Array.from(arguments).slice(1),
        key = Symbol(),
        result
    obj[key] = this
    result = obj[key](...arg)
    delete obj[key]
    return result
}
bind函数
Function.prototype.bind_ = function() {
    let obj = Array.from(arguments)[0] || window,
        arg = Array.from(arguments).slice(1),
        self = this
    return function(){
        let args=Array.from(arguments).slice(1)
        return self.call(obj,[...arg,...args])
    }
}
EventEmitter(收集发布)
class EventEmitter {
    constructor() {
        this.obj = {}
    }
    on(key, fn) {
        let Events = []
        Event.push(fn)
        this.obj[key] = Event
    }
    emit(key, ...arg) {
        let Events = this.obj[key]
        if (Events.length) {
            Events.forEach(i => i(...arg))
        }
    }
}
睡眠函数
function sleep(s){
     return new Promise(resolve=>{
     setTimeout(resolve,s)
  })
}

sleep(1000).then(()=>alert(1))

 or

!async function run() {
 await sleep(1500);
 console.log('start await');
}()
dom节点的遍历
function one_(node) {
    if (node.nodeType == 1) {
        return node.tagName.toLowerCase()
    }
    for (var i = 0; i < node.childNodes.length; i++) {
        if (node.childNodes[i].nodeType === 1) {
            one_(node.childNodes[i])
        }
    }
}
LRU算法
class Lru_cache {
    constructor(max) {
        this.max = max;
        this.cache = new Map();
    }
    get(key) {
        let value = this.cache.get(key);
        if (!value) return;
        this.cache.delete(key);
        this.cache.set(key, value);
        return value;
    }
    add(key, value) {
        if (this.cache.size > this.max - 1) {
            const keys = this.cache.keys().next().value;
            this.cache.delete(keys);
        }
        this.cache.set(key, value);
    }
}
es5继承
function Far(name){
        this.name = name;
        this.color = ["red","green","blue"];
    }
    Far.prototype.sayName = function(){
        console.log(this.name);
    };
function Son(name,age){
        Far.call(this,name);
        this.age  = age;
    }
    Son.prototype=Object.creat(Far.prototype)
    San.prototype.constructor = San
es6继承
class Big {
    constructor(name) {
        this.name = name
    }
    getName() {
        return this.name
    }
}
class Small extends Big {
    constructor(name, sex) {
        super(name)
        this.sex = sex
    } 
    getSex() {
        return this.sex
    }
}

var big = new Big('o( ̄ヘ ̄o#)')
var small = new Small('o( ̄ヘ ̄o#)', '♀')
console.log(big.getName())
console.log(small.getName())
手写Object.create
function _create(obj) {
    function C() {}
    C.prototype = obj;
    return new C();
}
手写new
function new_(fn,arg){
    let obj={}
    Object.getPrototypeOf(obj,fn.prototype)
    fn.apply(obj,arg)
    return obj
}
手写reduce
Array.prototype.reduce_2 = function(fn, back) {
    let arr = this
    for (var i=0; i < arr.length; i++) {
        return !back ? fn(arr[i], arr[i + 1], i + 1, arr) : fn(back, arr[i], i, arr)
    }
}
手写map
Array.prototype.map_ = function(fn) {
    let arr = this
    let arr_ = []
    for (let i = 0; i < arr.length; i++) {
        arr_[i] = fn(arr[i], i, arr)
    }
    return arr_
}
手写filter
Array.prototype.filter_=function(fn){
    let arr=this,
    arr_=[]
    for (let i = 0; i < arr.length; i++) {
        if(fn(arr[i],i,arr)){
            arr_[i]=arr[i]
        }
    }
    return arr_
}
实现冒泡排序
function bubbing_(arr) {
    for (let i = 0; i < arr.length - 1; i++) {
        for (let j = 0; j < arr.length - 1 - i; j++) {
            if (arr[j] > arr[j + 1]) {
                [arr[j], arr[j + 1]] = [arr[j + 1], arr[j]]
            }
        }
    }
    return arr
}
实现选择排序
function select_(arr) {
    for (let i = 0; i < arr.length; i++) {
        for (let j = i + 1; j < arr.length; j++) {
            if (arr[j] < arr[i]) {
                [arr[j], arr[i]] = [arr[i], arr[j]]
            }
        }
    }
    return arr
}
实现插入排序
function insert(array) {
    for (let i = 1; i < array.length; i++) { 
        var j = i - 1; 
        while (j >= 0 && array[j] > array[i]) { 
            [arr[j], arr[i]] = [arr[i], arr[j]] 
            j--;
        }
    }
    return array;
}
实现快速排序
function bubbing_(arr) {
    for (let i = 0; i < arr.length - 1; i++) {
        for (let j = 0; j < arr.length - 1 - i; j++) {
            if (arr[j] > arr[j + 1]) {
                [arr[j], arr[j + 1]] = [arr[j + 1], arr[j]]
            }
        }
    }
    return arr
}
实现冒泡排序
function fast_(arr) {
    let len = arr.length,
        r = [],
        l = [],
        bsc = arr[0]
    if (len < 2) {
        return arr
    }
    for (let i = 1; i < len; i++) {
        if (arr[i] < bsc) {
            l.push(arr[i])
        } else {
            r.push(arr[i])
        }
    }
    return [...k(l), bsc, ...k(r)]
}
实现二分法
function getIndex(arr, num) {
    arr.sort(a,b=>a-b)
    var start = 0,
        end = arr.length - 1
    while (start <= end) {
        var mid = Math.floor((start + end) / 2)
        if (num == arr[mid]) {
            return mid
        }
        if (num > arr[mid]) {
            start = mid + 1
        }
        if (num < arr[mid]) {
            end = mid - 1
        }
    }
    return false  
}
实现Promise
class MyPromise {
  constructor(fn) {
    this.status = "padding";
    this.data = "";
    this.error = "";
    this.resolveArr = [];
    this.rejectArr = [];
    let resolve = data => {
      setTimeout(() => {
        if (this.status == "padding") {
          this.data = data;
          this.status = "resolved";
          this.resolveArr.forEach(i => i());
        }
      }, 0);
    };
    let reject = error => {
      setTimeout(() => {
        if (this.status == "padding") {
          this.error = error;
          this.status = "rejected";
          this.rejectArr.forEach(i => i());
        }
      }, 0);
    };
    fn(resolve, reject);
  }
  then(Onresolve, Onreject) {
    if (this.status == "resolved") {
      return new MyPromise((resolve, reject) => {
        let res = Onresolve(this.data);
        if (res instanceof MyPromise) {
          res.then(resolve, reject);
        } else {
          resolve(res);
        }
      });
    }
    if (this.status == "rejected") {
      return new MyPromise((resolve, reject) => {
        let res = Onreject(this.error);
        if (res instanceof MyPromise) {
          res.then(resolve, reject);
        } else {
          resolve(res);
        }
      });
    }
    if (this.status == "padding") {
      return new MyPromise((resolve, reject) => {
        this.resolveArr.push(() => {
          let res = Onresolve(this.data);
          if (res instanceof MyPromise) {
            res.then(resolve, reject);
          } else {
            resolve(res);
          }
        });
        this.rejectArr.push(() => {
          let res = Onreject(this.error);
          if (res instanceof MyPromise) {
            res.then(resolve, reject);
          } else {
            resolve(res);
          }
        });
      });
    }
  }
  static resolve(data) {
    return new MyPromise(resolve => resolve(data));
  }
  static reject(error) {
    return new MyPromise(reject => reject(error));
  }
}
特别申明:本文内容来源网络,版权归原作者所有,如有侵权请立即与我们联系(cy198701067573@163.com),我们将及时处理。

Tags 标签

加个好友,技术交流

1628738909466805.jpg