Js篇-面试题5-如果浏览器不支持 bind 函数,实现一个函数让其兼容

虽互不曾谋面,但希望能和您成为笔尖下的朋友

以读书,技术,生活为主,偶尔撒点鸡汤

不作,不敷衍,意在真诚吐露,用心分享

点击左上方,可关注本刊

标星公众号（ID：itclanCoder）

如果不知道如何操作

点击这里,标星不迷路

━━━━━━

如果浏览器不支持 bind 函数,实现一个函数让其兼容

主要考察bind方法

• bind作用: 创建一个新的函数（称为绑定函数）, 当它被调用时，将其 this关键字设置为提供的值,在调用新函数时,在任何提供之前提供一个给定的参数序列

• 与 call,apply方法区别: 都是Function对象内置的方法,挂载在Function原型下共享方法,它们的第一个参数都是用来更改调用方法中 this 的指向。需要注意的是 bind是返回新的函数，以便稍后调用,它往往跟事件结合使用,只有触发了事件,才会调用,而apply 、call 则是立即调用原函数

const module = {
  name: 'itclanCoder',
  getName: function() {
    return this.name;
  },
};

const unboundGetName = module.getName;
console.log(unboundGetName()); //  函数在全局范围内被调用,undefined,这里的this指向的是window,很多面试题在全局范围定义了一个var name = "川川",那么此处便会输出"川川",因为这里全局作用域内没有name,所以是undefined
const boundGetName = unboundGetName.bind(module); // 通过bind改变this的指向,指向module对象
console.log(boundGetName()); // itclanCoder

在上面的示例代码中,将一个方法从对象中拿出来(上面的 getName 就是 module 对象下的一个方法)，然后再调用(module.getName 赋值给 unboundGetName)，总期望方法中的 this 是原来的对象（在这里指的是 module 对象，比如在回调中传入这个方法）。

如果不做特殊处理的话，一般会丢失原来的对象。基于这个函数，用原始的对象创建一个绑定函数，巧妙地解决了这个问题(上面使用 bind 后就解决了这个问题,让 this 指向了 module 对象)

• 语法

// 所要改变的this指向的那个函数.bind(thisArg[, arg1[, arg2[, ...]]])
function.bind(thisArg[, arg1[, arg2[, ...]]])

• thisArg: 当绑定函数被调用时，该参数会作为 this 的指向。当使用 new 操作符调用绑定函数时，该参数无效，会被忽略,当使用bind在 setTimeout中创建一个函数（作为回调提供）时，作为 thisArg 传递的任何原始值都将转换为object。如果 bind 函数的参数列表为空，或者 thisArg 是 null 或 undefined，执行作用域的 this 将被视为新函数的 thisArg

• arg1, arg2: 当目标函数被调用时，被预置入绑定函数的参数列表中的参数

• 返回值返回一个原函数的拷贝，并拥有指定的 this 值和初始参数

• 应用场景 1:可以对一个函数预设初始参数 只要将这些参数（如果有的话）作为 bind() 的参数写在 this 后面。当绑定函数被调用时，这些参数会被插入到目标函数的参数列表的开始位置，传递给绑定函数的参数会跟在它们后面,如下所示