实现一个功能和 `Function.prototype.bind` 相同的函数

2019-01-08

题目

/**
  请按要求实现 `bind` 函数：以下代码执行时，需返回正确结果且运行过程中无异常
*/
let example = function () {
  console.log(this)
}
const boundExample = bind(example, { a: true })
boundExample.call({ b: true }) // { a: true }

回答

• bind 需接受两个参数：函数和上下文
• bind 需创建一个新函数，并且在调用时设置上下文为 this

const bind = (fn, context) => () => fn.apply(context)

加分回答

• 如 example 函数需要传参的话，可如下进行实现：

const bind = (fn, context) => (...args) => fn.apply(context, args)

• Function.prototype.bind() 会创建一个新的函数，在调用时设置 this。会返回一个原函数的拷贝，并拥有指定的 this 和初始参数。
• Function.prototype.bind() 可解决 setTimeout 中 this 为 window 的问题。还可使一个函数拥有预设初始参数的能力，如：

// setTimeout
class LateBloomer {
    constructor() {
        this.petalCount = Math.ceil(Math.random() * 12) + 1;
    }
    declare() {
        console.log('I am a beautiful flower with ' + this.petalCount + ' petals!');
    }
    bloom() {
        window.setTimeout(this.declare.bind(this), 1000);
    }
}
var flower = new LateBloomer();
flower.bloom();
// 预设初始参数
const list = function () {
    return Array.prototype.slice.call(arguments);
}
// 创建一个函数，它拥有预设参数列表。
const leadingThirtysevenList = list.bind(null, 37);
console.log(leadingThirtysevenList()); // [37]
console.log(leadingThirtysevenList(1, 2, 3)); // [37, 1, 2, 3]

• Function.prototype.apply() 会调用一个具有给定 this 的函数，如果这个函数处于非严格模式且给定为 null 或 undefined 时，this 将指向全局对象，除此还提供一个数组作为该函数的参数。他会返回调用给定 this 值和参数的函数结果。
• Function.prototype.call() 和 apply() 类似。唯一区别就是 call() 方法接受的是参数列表，而 apply() 方法接受的是一个参数数组。

返回总目录

每天 30 秒