call和apply和bind的区别、手写bind函数

call、apply、bind的区别 1.定义: call apply看作是对象的方法,通过调用方法的形式间接调用函数。都是为了改变某个函数运行时的上下文(context)(函数体内部 this 的指向)而存在的。 bind方法主要的作用是将函数绑定至某个对象,当函数f()上调用bind()方法并传入对象o作为参数,这个方法将返回一个新的函数。 2.参数: 【call、apply bind 相同点】: 第一个实参: 都是要调用函数的母对象,是调用的上下文。 第一个实参后的参数:是要传入待调用函数的值 this的值:如果当第一个参数为null、undefined的时候,默认指向window,如果存在的话this的值指向第一个参数 【call、apply bind 不同点】: 第一个实参后的参数:apply实参放在数组中如: f.call(o,1,2) f.apply(o, [1, 2]) //apply实参放在数组中 手写bind函数 理解bind函数 bind方法主要的作用是将函数绑定至某个对象,当函数f()上调用bind()方法并传入对象o作为参数,这个方法将返回一个新的函数。 function f(y){return this.x+y} // step1.定义函数 var o={x:1} //step2.定义待传入的对象 var g=f.bind(o)//step3.f函数绑定至o对象, 返回一个新对象赋值给g g(2) //3 手写bind函数 步骤: 在Function原型上定义方法bind1 将参数拆解为数组 获取this(数组第一项)、及函数传参 获取上下文(this):fn1.bind(...)中的fn1,存储为self 返回一个函数,函数内用self.apply实现函数的绑定 代码: // step0:在Function原型上定义方法bind1 Function.prototype.bind1=function(){ // arguments:可以获取函数所有的参数 console.log(arguments) //[{x: 100},10,20] // slice() 方法可从已有的数组中返回选定的元素。 // step1:将参数拆解为数组 const args = Array.prototype.slice.call(arguments) // step2:获取this(数组第一项) const this_ = args.shift() //shift() 方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。 // 存储 fn1.bind(...)中的fn1 const self = this //this指向fn1 //返回一个函数 return function(){ return self.apply(this_, args) } } const fn3 = fn1.bind1({ x: 100 }, 10, 20)

本文章由javascript技术分享原创和收集

发表评论 (审核通过后显示评论):

昵称:
邮箱:
内容: