JavaScript 中的"this"究竟是什么？

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

为什么会出现这种情况？

我们可以这样想：

1. 函数就只是函数，跟在从哪个对象中创建无关
2. (除构造函数外)无论是预先定义的函数, 还是通过表达式创建的匿名函数, 函数都只是一个指向函数的地址，只不过匿名函数缺少了name 属性, 执行过程没什么不同
3. 函数(方法)中的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 总是指向调用此方法的对象

---

时间不等人，比你优秀的人仍然在努力
又学会了抽烟，也想想一个魂淡妹子