【译】JavaScript中的call,apply,bind
在我们开始研究call, apply, bind之前，应该对how does "this" keyword works in JavaScript有所认知。
简言之，"this" 创造了指向一个对象的引用。它可能指向了全局对象，比如在全局作用域{window object}。
console.log(this);
//Window {parent: Window, opener: null, top: Window, length: 4, frames: Window, …}
"this"在一个对象的内部指向对象的本身。
const student = {
name: "ritik",
getDetails(){
console.log(this)
}
}
student.getDetails();
// {name: "ritik", getDetails: f}
所以，那就是"this"如何通过作用域自动地获取它的上下文的。
但是，如果我们想指定"this"上下文（环境）到一个特定的对象呢？
我们在代码中演示this。
const religion = {
type: "humanity",
property: "greatest"
}
function getDetails(){
console.log(`${this.type} is the ${this.property} religion`);
}
getDetails()
// undefined is the undefined religion
所以，这里的"this"指向"window"对象（根据函数中"this"默认行为，它指向"window"对象）。
但是，我们想它指向"religion"对象。
那就是call, apply, bind出现的地方。
const religion = {
type: "humanity",
property: "greatest"
}
function getDetails(){
console.log(`${this.type} is the ${this.property} religion`);
}
getDetails.call(religion);
// humanity is the greatest religion
getDetails.apply(religion);
// humanity is the greatest religion
这里，"call"或者"apply"方法将"religion"对象和getDetails函数关联起来。
或者，我们可以说，"call"或者"apply"方法在getDetails函数中创造了一个"this"指向"religion"对象。
"call"和"apply"达到的效果是一样的，但是，它们处理参数的方式不同。
现在，我们传递一些参数给getDetails函数。
const religion = {
type: "humanity",
property:"greatest"
}
function getDetails(world,creature){
console.log(`${this.type} is the ${this.property} religion in the ${world} of ${creature}`);
}
getDetails.call(religion,"modern world","human");
//humanity is the greatest religion in the modern world of human
getDetails.apply(religion,["modern world","human"]);
//humanity is the greatest religion in the modern world of human
"call"方法接收以逗号分隔的参数；但是"apply"通过一个数组来处理参数。
现在，如果你想在代码很多地方使用带不同参数的"getDetails"函数。
多次使用"call"和"apply"是一种解决方法，但是"bind"函数可以让这个过程更加容易。
"bind"方法创造了一个指向传入对象的"this"引用，这和"apply"或者"call"那样，但是其返回一个函数。
现在，在你的代码中，这个函数通过不同参数被多次使用。
const religion = {
type: "humanity",
property:"greatest"
}
function getDetails(world,creature){
console.log(`${this.type} is the ${this.property} religion in the ${world} of ${creature}`);
}
const newgetDetails = getDetails.bind(religion);
newgetDetails("modern world","human");
//humanity is the greatest religion in the modern world of human
newgetDetails("future world","different creatures");
//humanity is the greatest religion in the future world of different creatures
如果你不想存储返回的函数，那么它也可以直接引用，如下：
const religion = {
type: "humanity",
property:"greatest"
}
function getDetails(world,creature){
console.log(`${this.type} is the ${this.property} religion in the ${world} of ${creature}`);
}
getDetails.bind(religion)("modern world","human")
//humanity is the greatest religion in the modern world of human
