Call&Bind&Apply的区别(javascript)

Call&Bind&Apply的区别(javascript)

---

apply

---

通过apply () ，我们可以编写用于不同对象的方法

apply(参数一，参数二)，参数一是作为函数的上下文的对象，参数二是作为函数参数组成的数组

• 样例：

 var person = {
    fullName: function() {
        return this.firstName + " " + this.lastName;
    }
}
var person1 = {
    firstName: "Bill",
    lastName: "Gates",
}
person.fullName.apply(person1); 

在这个样例中， person的方法: fullName 被运用到了 person1；

person中的this 此时指向person1，因此此时输出 “Bill Gates”

call

---

通过call（）， 我们同样可以编写用于不同对象的方法

call 方法第一个参数也是作为函数上下文的对象，但是后面传入的是一个参数列表，而不是单个数组。

• apply与call的对比样例：

var person = {
  fullName: function(city, country) {
    return this.firstName + " " + this.lastName + "," + city + "," + country;
  }
}
var person1 = {
  firstName:"John",
  lastName: "Doe"
}
person.fullName.apply(person1, ["Oslo", "Norway"]);
person.fullName.call(person1, "Oslo", "Norway");

注意最后两行代码，我们可以发现call与apply的用法区别；

call() 方法分别接受参数。

apply() 方法接受数组形式的参数。

如果要使用数组而不是参数列表，则 apply() 方法非常方便。

bind

---

bind 的返回值是函数

bind接受的参数有两部分，第一个参数是是作为函数上下文的对象，第二部分参数是个列表，可以接受多个参数。

• bind样例：

this.x = 9;    // 在浏览器中，this 指向全局的 "window" 对象
var module = {
  x: 81,
  getX: function() { return this.x; } //这里的this 依旧指向的是window这个全局变量
};

module.getX(); // 81

var retrieveX = module.getX;
retrieveX();   
// 返回 9 - 因为函数是在全局作用域中调用的

// 创建一个新函数，把 'this' 绑定到 module 对象
// 新手可能会将全局变量 x 与 module 的属性 x 混淆
var boundGetX = retrieveX.bind(module);
boundGetX(); // 81

• 这里发现bind会将函数的指向改变。