call,apply和bind详解

论坛 期权论坛 脚本     
已经匿名di用户   2021-12-20 01:35   1793   0

call,apply和bind的作用都是改变this指向,但使用方法不同。

一.call和apply

call和apply其实是同一个东西,区别只有参数不同,call是apply的语法糖,所以就放在一起说了,这两个方法都是定义在函数对象的原型上的(Function.prototype),call和apply方法的作用都是改变函数中的this指向,第一个参数传入一个对象,然后传入函数执行所需的参数。传入call的参数只能是单个参数,apply可传入数组或类数组。话不多说直接上代码,看下面的例子:

1.

var ga = {
   x:1
}
function gb(y) {
   return this.x+y;
}
console.log(gb.call(ga,2));   //this指向了ga,结果为3

上面的代码中由于gb函数执行依赖于ga中的x,所以我们使用了call使得gb中的this指向了ga。

2.

function gg(x,y,z){
    let a=Array.prototype.slice.call(arguments,1,2) //通过slice方法获取到了第二个参数
    return a; //返回[2]
}
gg(1,2,3)

arguments是一个类数组对象,它本身不能调用数组的slice方法,使用call将执行slice方法的对象由数组变为了arguments。

3.

我们可以使用apply来改写上面的代码,传入一个数组。

function gg(x,y,z){
    let d=[1,2]
    let a=Array.prototype.slice.apply(arguments,d) //通过slice方法获取到了第二个参数
    return a; //返回[2]
}
gg(1,2,3)

二. bind

bind和apply区别是apply会立刻执行,而bind只是起一个绑定执行上下文的作用。看下面的例子:

var color = "red";
var o = { color: "blue" };
 
function sayColor(){
    alert(this.color);
} 
var objectSayColor = sayColor.bind(o);
objectSayColor();    //blue

在我们需要确保函数中的this一直指向某个对象时,就应该使用bind。

分享到 :
0 人收藏
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

积分:81
帖子:4969
精华:0
期权论坛 期权论坛
发布
内容

下载期权论坛手机APP