js中this的指向问题归纳总结

绝大部分的新手，在学习JavaScript时都会遇到一个非常常见的问题：无法理解 this 的指向问题。这也是Javascript的一个复杂和有争议性的部分，本攻略旨在帮助读者归纳总结“js中this的指向问题”。

什么是 this

this 是 JavaScript 中的一个关键字，它是一个对象，并且它是由函数来调用的。this 的值在每个函数调用的时候都可能发生变化，具体的指向对象取决于函数的调用方式。

this 的指向问题

在JavaScript中，this 的指向可以分成以下四种情况：

1. 全局上下文中的this

当函数不作为对象的方法调用时，this 指向全局对象 window。

javascript
console.log(this); // window

1. 对象方法中的this

当一个函数作为对象的方法被调用时，this会指向该对象。

javascript
var obj = {
name: 'John',
age: 20,
sayName: function(){
console.log(this.name); // John
}
}
obj.sayName();

1. 构造函数中的 this

在构造函数中，this 指向新创建的对象。

javascript
function Person(name, age){
this.name = name;
this.age = age;
}
var john = new Person('John', 20);
console.log(john.name); // John

1. 使用 call()、apply()、bind() 显式指定this

call()、apply()、bind() 方法可以显式的指定函数执行时 this 的指向：

```javascript
function sayHello() {
console.log('Hello, ' + this.name);
}

var person = {
name: 'John'
};

sayHello.call(person); // 输出 "Hello, John"
sayHello.apply(person); // 输出 "Hello, John"

var bindedFunction = sayHello.bind(person);
bindedFunction(); // 输出 "Hello, John"
```

总结

本攻略详细总结了JavaScript中this的指向问题，从全局上下文、对象方法、构造函数以及显式指向的角度全面讲解了this的使用方法。对于想要精通JavaScript编程的开发人员来说，理解和掌握this的指向问题是非常重要的。

示例说明

示例一：

var obj = {
    name: 'John',
    age: 20,
    sayName: function() {
        console.log(this.name);
    }
};
obj.sayName(); // John

在这个示例中，this 指向 obj 对象，因此 sayName() 方法被执行时，会输出对象 obj 的属性 name 的值 "John"。

示例二：

function sayHello() {
    console.log('Hello, ' + this.name);
}

var person = {
    name: 'John'
};

var bindedFunction = sayHello.bind(person);
bindedFunction(); // 输出 "Hello, John"

在这个示例中，使用 bind() 方法显式地将函数 sayHello() 绑定到 person 对象上。因此，bindedFunction() 函数被调用时，this 指向了 person 对象，输出 "Hello, John"。