1. call()
语法：
fun.call(thisArg，arg1，arg2，…)
- fun: 表示一个函数
- thisArg: this要指向的对象，如果是null 和 undefined，则指向window全局对象；
- 从arg1开始，都是要给fun传递的参数。
特性：
fun.call(thisArg，arg1，arg2，…)
- 会立即调用fun函数；
- call 方法将一个函数的对象上下文从初始的上下文改变为由 thisArg 指定的新对象，如果没有提供 thisArg 参数，那么 Window对象被用作 thisArg；
- 将arg1等参数传递进fun函数中，返回fun函数的返回值。
function getSum(num1, num2) {
console.log(this); // Window
return num1 + num2;
}
const obj = {};
getSum.call(obj, 2, 3); // this指向: obj return: 5
2. apply()
语法：
fun.apply(thisArg，[arg1，arg2，…])
- fun: 表示一个函数
- thisArg: this要指向的对象，如果是null 和 undefined，则指向window全局对象；
- 参数是一个数组。
特性：
fun.apply(thisArg，[arg1，arg2，…])
- 会立即调用fun函数；
- apply方法将一个函数的对象上下文从初始的上下文改变为由 thisArg 指定的新对象，如果没有提供 thisArg 参数，那么 Window对象被用作 thisArg；
- 将数组传递进fun函数中，返回fun函数的返回值。
function getSum(num1, num2) {
console.log(this);// Window
return num1 + num2;
}
const obj = {};
getSum.apply(obj, [1, 2]); // this指向: obj return: 3
3. bind()
语法：
fun.bind(thisArg，[arg1，arg2，…])
- fun: 表示一个函数
- thisArg: this要指向的对象，如果是null 和 undefined，则指向window全局对象；
- 从arg1开始，都是要给fun传递的参数。
特性：
fun.bind(thisArg，arg1，arg2，…)
- 不会立即调用fun函数，会返回一个新的指定了this的函数；
- bind方法将一个函数的对象上下文从初始的上下文改变为由 thisArg 指定的新对象，如果没有提供 thisArg 参数，那么 Window对象被用作 thisArg；
- 将arg1等参数传递进fun函数中。
function getSum(num1, num2) {
console.log(this); // Window
return num1 + num2;
}
const obj = {};
const newFun = getSum.bind(obj, 1, 2); // 返回的是一个新的指定了this的函数
newFun(); // 3
4. call()、apply()和bind()的应用
1. call()
call 常用来继承，因为ES6之前没有extends,用构造函数来模拟继承。
下面例子：
Son通过改变Father构造函数this指向问题，来获取Father里面的属性，实现继承的效果，Son还可以添加自己的额外属性：
function Father(name, age) {
this.name = name;
this.age = age;
}
function Son(name, age, gender) {
Father.call(this, name, age);
this.gender = gender;
}
const son = new Son("小明", 24, "男");
son.name; // 小明
son.age; // 24
2. apply()
apply 常用于与数组有关的操作，因为传递的参数是数组。
获取数组中的最大值与最小值：
const arr = [1, 4, 7, -1];
Math.max.apply(Math, arr); // 7
Math.min.apply(Math, arr); // -1
数组合并：
const arr = [1, 2];
const arr1 = [3];
Array.prototype.push.apply(arr, arr1); // 3
conaole.log(arr); // [1, 2, 3]
3. bind()
如果我们想改变某个函数内部的this指向，但又不需要立即调用该函数，此时用bind:
<body>
<button>点击</button>
<script>
let btn = document.querySelector("button");
btn.onclick = function() {
this.disabled = true; // 这里this表示btn
setTimeout(function() {
console.log(this); // 这里this表示Window
this.disabled = false; // 所以btn的disabled会一直为true
}, 3000)
}
</script>
</body>
-----------------------------------------------------
<body>
<button>点击</button>
<script>
let btn = document.querySelector("button");
btn.onclick = function() {
this.disabled = true;
setTimeout(function() {
console.log(this); // btn
this.disabled = false;
}.bind(this), 3000) // 这个this是在定时器函数外，所以指向的是btn这个按钮对象。
}
</script>
</body>
