JavaScript 方法调用模式和函数调用模式

Posted 2020-09-01 Meow~

这两天在读《javascript语言精粹》关于第4章函数调用的几种模式琢磨了半天。

这里就说一下方法调用模式跟函数调用模式。

方法调用模式：

当一个函数被保存为对象的一个属性时，我们称它为一个方法。当一个方法被调用时，this被绑定到该对象。如果调用表达式包含一个提取属性的动作（a.name或a[name]），那么他就是被当做一个方法调用。

1 var myObject = {
2     value:1,
3     double:function(){ //double是myObject对象的一个方法
4         this.value = this.value*2;
5     }
6 };
7 myObject.double(); //2

函数调用模式：

当一个函数并非一个对象的属性时，那么他就是被当做一个函数来调用的：

此时要注意，以此模式调用函数时，this被绑定到全局对象。

 1 var myObject = {
 2     value:1
 3 };
 4 myObject.double =function () {
 5     var helper = function () {  //helper不是对象的属性，因此this指向全局对象Window
 6         this.value = this.value*2;
 7     }
 8     helper();
 9 } ;
10 myObject.double(); //1，value的值不会发生改变

我们可以为该方法double定义一个变量，并赋值为this，那么内部函数就可以通过那个变量访问到this。按照约定，我们把那个变量命名为that：

 1 var myObject = {
 2     value:1
 3 };
 4 myObject.double = function () {
 5     var that = this;    //定义变量that，并给它赋值为this
 6     var helper = function () {
 7         that.value = that.value*2;
 8     }
 9     helper();
10 }
11 myObject.double(); //2，由于间接的访问了this，value最终发生了改变