240418Note: fe - handwritten question

[Geekiter]

1. 手写 Object.create

function create(obj){
    function F(){}
    F.prototype = obj;
    return new F()
}

function create(obj){
    function F(){}
    F.prototype = obj;
    return new F()
}

function create(obj){
    function F(){}
    F.prototype = obj;
    return new F()
}

function create(obj){
    function F(){}
    F.prototype = obj;
    return new F()
}

2. 手写 instanceof 方法

function myInstanceof(left, right){
    let proto = Object.getPrototypeOf(left);
    prototype = right.prototype;
    while(true){
        if(!proto) return false;
        if(proto === prototype) return true;
        proto = Object.getPrototypeOf(proto);
    }
}
function myInstanceof(left, right){
    let proto = Object.getPrototypeOf(left);
    prototype = right.prototype;
    while(true){
        if(!proto) return false;
        if(proto === prototype) return true;
        proto = Object.getPrototypeOf(proto);
    }
}

function myInstanceOf(left, right){
    let proto = Object.getPrototypeOf(left);
    prototype = right.prototype;
    while(true){
        if(!proto) return false;
        if(proto === prototype) return true;
        proto = Object.getProtortpeof(proto)
    }
}

function myInstanceOf(left, right){
    let proto = Object.getPrototypeOf(left)
    prototype = right.prototype;
    while(true){
        if(!proto) return false;
        if(proto == prototype) return true;
        proto = Object.getPrototypeOf(proto)
    }
}

3. 手写 new 操作符

function myNew(constructor, ...args){
    if(typeof constructor !== "function") return;
    let obj = {}
    obj.prototype = Object.create(constructor.prototype)
    const res = constructor.apply(obj, args)
    if(res && (typeof res !== "object" || typeof res === "function")) return res;
    return obj;
}
function Fn(obj){
    this.obj = obj;
}
let obj = myNew(Fn, "222")
console.log(obj);

function myNew(constructor, ...args){
    if(typeof constructor !== "function") return;
    let obj = {}
    obj.prototype = Object.create(constructor.prototype)
    const res = constructor.apply(obj, args)
    if(res && (typeof res !== "object" || typeof res === "function")) return res;
    return obj; 
}
function Fn(obj){
    this.obj = obj
}
let obj = myNew(Fn, "222")
console.log(obj)

function myNew(constructor, ...args){
    if(typeof constructor !== "function") return;
    let obj = {}
    obj.prototype = Object.create(constructor.prototype)
    const res = constructor.apply(obj, args)
    if(res && (typeof res !== "object" || typeof res === "function")) return res;
    return obj;
}

4. 手写 Promise

class MyPromise{
    constructor(executor){
        this.state = "pending"
        this.value = null
        this.error = null
        this.resolve = this.resolve.bind(this);
        this.reject = this.reject.bind(this);
        executor(this.resolve, this.reject)
    }
    resolve(value){
        if(this.state === "pending"){
            this.state = "resolved"
            this.value = value;
        }
    }
    reject(error){
        if(this.state === "pending"){
            this.state = "rejected"
            this.error = error
        }
    }

    then(onFulFilled, onRejected){
        onFulFilled = typeof onFulFilled === "function" ? onFulFilled : v => v;
        onRejected = typeof onRejected === "function" ? onRejected : r => {
            throw r
        }
        if(this.state === "resolved"){
            onFulFilled(this.value)
        }
        if(this.state === "rejected"){
            onRejcted(this.error)
        }
    }
}

class MyPromise{
    constructor(executor){
        this.state = "pending"
        this.value = null
        this.error = null
        this.resolve = this.resolve.bind(this)
        this.reject = this.reject.bind(this)
        executor(this.resolve, this.reject)
    }
    resolve(value){
        if(this.state === "pending"){
            this.state = "resolved"
            this.value = value
        }
    }
    reject(error){
        if(this.state === "pending"){
            this.state = "reject"
            this.error = error
        }
    }

    then(onFulFilled, onRejected){
        onFulFilled = typeof onFulFilled === "function" ? onFulFilled : v => v;
        onRejected = typeof onRejected === "function" ? onRejected : r => {
            throw r;
        }
        if(this.state === "resolved"){
            onFulFilled(this.value)
        }
        if(this.state === "rejected"){
            onRejected(this.error)
        }
    }
}

class MyPromise{
    constructor(executor){
        this.state = "pending"
        this.value = null
        this.error = null
        this.resolve = this.resolve.bind(this)
        this.reject = this.reject.bind(this)
        executor(this.resolve, this.reject)
    }
    resolve(value){
        if(this.state === "pending"){
            this.state = "resolved"
            this.value = value
        }
    }
    reject(error){
        if(this.state === "pending"){
            this.state = "reject"
            this.error = error
        }
    }
    then(onFulFilled, onRejected){
        onFulFilled = typeof onFulFilled === "function" ? onFulFilled : v => v;
        onRejected = typeof OnRejected === "function" ? onRejected : r => {
            throw r;
        }
        if(this.state === "resolved"){
            onFulFilled(this.value)
        }
        if(this.state === "rejected"){
            onRejected(this.error)
        }
    }
}

5. 手写防抖函数

function debounce(func, delay){
    let timer;
    return function(){
        const context = this;
        const args = arguments;
        clearTimeout(timer);
        timer = setTimeout(()=>{
            func.apply(context, args)
        }, delay)
    }
}
function handleClick(){
    //...
}
const button = document.getElementById("mybutton")
button.addListener("click", debounce(handleClick, 1000))

6. 手写节流函数

function throttle(func, delay){
    let lastExecTime = 0;
    return function(){
        const context = this
        const args = arguments;
        let curTime = date.now()
        if(curTime - lastExecTime > delay){
            func.apply(func, args)
            lastExecTime = curTime
        }
    }
}
function handleScroll(){
    console.log("scrolling...")
}

window.addEventListener("scroll", throttle(handleScroll, 1000))

7. 手写类型判断函数

function getType(value){
    if(value === null){
        return value + "";
    }
    if (typeof value === "object"){
        let valueClass = Object.prototype.toString.call(value);
        type = valueClass.split(" ")[1].split("");
        type.pop()
        return type.join("").toLowerCase();
    }else{
        return typeof value;
    }
}

8. 手写 call 函数

Function.prototype.myCall = function(ctx, ...args){
    if(typeof this !== "function") return;
    ctx = ctx || window;
    const fn = Symbol()
    ctx[fn] = this
    const result = ctx[fn](...args)
    delete ctx[fn]
    return result
}
Function.prototype = function(ctx, ...args){
    if(typeof this !== "function") return;
    ctx = ctx || window;
    const fn = Symbol()
    ctx[fn] = this
    const result = ctx[fn](...args)
    delete ctx[fn]
    return result
}

Function.prototype = function(ctx, ...args){
    if(typeof this !== "function") return;
    ctx = ctx ||  window
    const fn = Symbol()
    ctx[fn] = this
    const result = ctx[fn](...args)
    delete ctx[fn]
    return result
}

Function.prototype = function(ctx, ...args){
    if(typeof this !== "function") return;
    ctx = ctx || window
    const fn = Symbol()
    ctx[fn] = this
    const result = ctx[fn](...args)
    delete ctx[fn]
    return result
}

9. 手写 apply 函数

Function.prototype.myCall = function(ctx, args){
    if(typeof this !== "function") return
    ctx = ctx || window
    const fn = Symbol
    ctx[fn] = this
    const result = ctx[fn](...args)
    delete ctx[fn]
    return result
}

10. 手写 bind 函数

Function.prototype.myBind = function(ctx, ...args1){
    if(typeof this !== "function") return;
    const fn = this
    return function(...args2){
        const allArgs = [...args1, ...args2]
        if(new.target){
            return new fn(...allArgs)
        }else{
            return fn.apply(ctx, allArgs)
        }
    }
}

Function.protortpe.myBind = function(ctx, ...args1){
    if(typeof this !== "function") return;
    const fn = this
    return function(...args2){
        const allArgs = [...args1, ...args2]
        if(new.target){
            return new fn(...allArgs)
        }else{
            return fn.apply(ctx, allArgs)
        }
    }
}

Function.prototype.myBind = function(ctx, ...args1){
    if(typeof this !== "function") return;
    const fn = this
    return function(...args2){
        const allArgs = [...args1, ...args2]
        if(new.target){
            return new fn(...allArgs)
        }else{
            return fn.apply(ctx, allArgs)
        }
    }
}

Function.prototype.myBind = function(ctx, ...args1){
    if(typeof this !== "function") return;
    const fn = this;
    return function(...args2){
        const allArgs = [...args1, ...args2]
        if(new.target){
            return new fn(...allArgs)
        }else{
            return fn.apply(ctx, allArgs)
        }
    }
}