this是基于函数运行时的执行环境绑定的 ——《JavaScript 高级程序设计》(第三版) 7.2.2 <关于this 对象>
方法中的this 总是指向调用此方法的对象 —— 我
为什么会有这篇笔记呢？因为JavaScript 实在是太灵活了：回调、闭包、原型让人眼花缭乱有木有……好吧，是我太菜了(跑一遍最后一段代码，这篇笔记可以不看)~~~
说到this，肯定离不开函数(function)。<是不是应该统一使用英文的标点?>. 函数肯定离不开执行环境(context), 所以执行环境是什么？知道了执行环境也就知道了this, 但是不知道执行环境，似乎也不影响我们了解this, 为什么这么说呢？请看代码(最好自己运行一遍)：
var name = 'window';
function getName() {
return this.name;
}
console.log(getName());
// 输出：window
为什么？我们知道在浏览器中：全局执行环境是window对象，而this是基于函数运行时的执行环境绑定的, 所以window 内定义了 var name='window', 那么函数运行时自然也会输出window, 与其他语言差不多, 函数内可以访问外部的变量, 如果我们想要确定函数运行时的this(最好自己运行一遍)
var name = 'window';
function getName() {
console.log(this);
return this.name;
}
console.log(getName());
// 输出：Window:{/*Window 对象，包含各种属性、方法*/}
// 输出：window
再看, 调用对象中的方法(通过对象调用方法更贴切)：(最好自己运行一遍)
var obj1 = {
name: 'obj1',
getName: function () {
console.log(this); // 输出this 对象
return this.name;
}
}
console.log(obj1.getName());
// 输出：obj1:{/*obj1 对象*/}
// 输出：obj1
通过obj1.getName(); 调用，this 就指向obj1
关于常见的this 丢失的问题之一，请看：(最好自己运行一遍)
var name = 'window';
var obj1 = {
name: 'obj1',
getName: function () {
console.log(this); // 输出this 对象
return this.name;
}
}
var fun1 = obj1.getName;
console.log(fun1());
// 输出：Window:{/*Window 对象*/}
// 输出：window
为什么会出现这种情况？
我们可以这样想：
- 函数就只是函数，跟在从哪个对象中创建无关
(除构造函数外)无论是预先定义的函数, 还是通过表达式创建的匿名函数,函数都只是一个指向函数的地址，只不过匿名函数缺少了name属性,执行过程没什么不同- 函数
(方法)中的this总是指向调用此方法的对象
做下测试：(最好自己运行一遍)
// 1. 测试定义函数的执行
var name = 'window'; // 声明全局变量：windw.name
function getName() { // 定义一个方法：getName
console.log(this); // \- 输出：this
return this.name; // \- 返回：this.name
}
console.log(getName()); // (⚠默认在window 中)调用getName())
// 输出：Window 对象
// 输出：window
// 2. 测试对象中的函数执行
var obj1 = { // 创建对象：obj1
name: 'obj1', // \- 属性：name = 'obj1'
getName: function () { // \- 创建对象函数：getName()
console.log(this); // \- 输出：this
return this.name; // \- 返回值：this.name
}
}
console.log(obj1.getName()); // obj1调用getName()
// 输出：obj1 对象
// 输出：obj1
// 3. 测试变量引用对象中的函数，并执行
var fun1 = obj1.getName; // 将obj1.getName() 的地址赋值给fun1
console.log(fun1()); // (⚠默认在window 中)调用fun1())
// 输出：Window 对象
// 输出：window
// 4.测试对象引用另外一个对象中的函数，并执行
var obj2 = { // 创建对象：obj2
name: 'obj2', // \- 属性：name = 'obj2'
getName: obj1.getName // \- 创建对象函数：getName() 指向obj1.getName()
}
console.log(obj2.getName()); // obj2调用getName()
// 输出：obj2 对象
// 输出：obj2
// 5. 测试对象引用全局定义的函数，并执行
var obj3 = { // 创建对象：obj3
name: 'obj3', // \- 属性：name = 'obj3'
getName: getName // \- 创建对象函数：getName() 指向window.getName()
}
console.log(obj3.getName()); // obj3调用getName()
// 输出：obj3 对象
// 输出：obj3
具体请看代码注释👆
总结：方法中的this 总是指向调用此方法的对象
时间不等人，比你优秀的人仍然在努力
又学会了抽烟，也想想一个魂淡妹子
