js的apply、call以及bind方法详解
作用:都是用来改变函数/方法的this指向,也就是说,可以让一个对象,使用另外一个对象的方法。区别:apply方法跟call方法是调用之后立即执行的,而bind方法是复制一个新函数/方法,改变this指向后将其返回;apply方法最多只能传两个参数,第一个参数是this所要指向的对象,第二个参数是数组,数组里的是改变this指向的方法所需参数;call方法以及bind方法可有多个参数,第一个参数是
作用:都是用来改变函数/方法的this指向,也就是说,可以让一个对象,使用另外一个对象的方法。
区别:
apply方法跟call方法是调用之后立即执行的,而bind方法是复制一个新函数/方法,改变this指向后将其返回;
apply方法最多只能传两个参数,第一个参数是this所要指向的对象,第二个参数是数组,数组里的是改变this指向的方法所需参数;
call方法以及bind方法可有多个参数,第一个参数是this所要指向的对象,第二个以后的参数是改变this的方法所要参数,一个个按顺序传进去。
下面就来看用法:
function Person(name, age) {
this.name = name,
this.age = age
}
Person.prototype.sayThis = function(x, y) {
console.log('------' + x + y);
console.log(this);
console.log('------' + x + y);
}
let per1 = new Person('xiaoxiao', 15);
function Anamil(name) {
this.name = name
}
let ana1 = new Anamil('dog');
先看这个代码,后续三个方法的使用都依托在per1跟ana1两个对象上。
apply用法:
per1.sayThis(7,7);
per1.sayThis.apply(ana1,[6,6]);
前面是方法名,后面接apply(),第一个参数是方法所要改变的this指向,说白了就是一个对象,
让this指向对象所在的地址,第二个参数是一个数组,数组里是方法所要的参数。运行结果:
看第一个输出的this,其实就是per1对象,第二个使用了apply来改变this的指向,而传进去的
参数是ana1,所以第二个输出的this是ana1对象。
call用法:
per1.sayThis.call(ana1,6,6);
运行结果就不展示了,跟上边的是一样的,唯一不同就是参数的传递。
接着我们来看bind方法的使用:
per1.sayThis(7,7);
let fun = per1.sayThis.bind(ana1,6,6);
fun();
bind方法的使用如代码所示,参数传递第一个是this要指向的对象,接着就是方法所需要的参数了,bind方法并不会立即调用改变指向的方法,而是把方法复制一份,并且改变了this指向,然后把它返回,所以我们还需要调用一下。结果如下:
这三个方法第一个参数对象,如果我们传入一个null,那么this就会指向window:
更多推荐
所有评论(0)