详解JS中的this、apply、call、bind(经典面试题)
在Javascript中，this、apply、call、bind都是常见的关键字。它们在面试过程中也往往是必问的问题，因为它们对于Javascript的理解非常关键，而且使用得好能够使代码更加简洁高效。本文将会详细讲解它们的含义和用法。
this
this是Javascript中非常重要的一个关键字，它表示函数的当前执行环境。this的指向可能是动态的，取决于函数的运行上下文。具体来说，this指向的是函数调用的主体。在全局作用域中，this指向的是window对象；而在函数内部，this的指向则根据情况而定。在函数中使用this，通常有以下几种情况：
- 直接调用函数，this指向的是全局对象window。
function foo() {
console.log(this);
}
foo(); // window
- 函数作为对象的方法调用，this指向的是调用该函数的对象。
var obj = {
name: 'object',
foo: function () {
console.log(this);
}
};
obj.foo(); // obj
- 使用apply、call、bind等函数调用，this指向传入的第一个参数。
function foo() {
console.log(this);
}
foo.call(obj); // obj
apply和call
apply和call都是Javascript中的方法，它们的作用是改变函数中this的指向。两者的区别在于参数传递的方式不同。其中，call的传参方式是单个参数列表，而apply接受一个数组作为参数。
function foo(a, b) {
console.log(a + b);
console.log(this);
}
foo.apply(obj, [1, 2]); // 3，obj
foo.call(obj, 1, 2); // 3，obj
bind
bind方法用于永久改变函数的this指向。它会返回一个新的函数，原函数并没有执行。bind也接受参数列表，这些参数将会被绑定在新函数的参数中。
function foo() {
console.log(this);
}
var newFunc = foo.bind(obj);
newFunc(); // obj
示例说明
示例一
下面这段代码展示了如何使用bind来永久改变函数的this指向。
var person = {
name: 'Jack',
age: 20,
sayHello: function(){
console.log('Hello, my name is ' + this.name + ', I am ' + this.age + ' years old.');
}
};
var person2 = {
name: 'Tom',
age: 25
};
var sayHello = person.sayHello.bind(person2);
sayHello(); // Hello, my name is Tom, I am 25 years old.
可以看到，使用bind绑定person2作为sayHello函数的this值，最终执行结果中输出的name和age分别是person2的属性值。
示例二
下面这段代码展示了使用apply和call方法来改变this指向。
function add(a, b) {
console.log(this.x + a + b);
}
var obj = {x: 5};
add.apply(obj, [3, 4]); // 12
add.call(obj, 3, 4); // 12
通过call和apply方法来调用add函数，可以将obj作为这个函数运行时的this值，从而通过this来访问obj的属性x。最终输出的结果应该是12。
总结：本文详细讲解了Javascript中的this、apply、call、bind这几个常用关键字的含义和用法。this用于表示函数调用的主体，而apply、call、bind用于改变函数中this的指向，并且也可以将一些参数绑定到函数中。在实际开发中，熟练掌握这些技巧可以让我们的代码更加简洁优雅。