函数调用的四种方式

Posted 2020-08-16 William.G

在javascript中一共有4种调用模式：

• 函数调用模式
• 方法调用模式
• 构造器调用模式
• 间接调用模式，通过call()和apply()进行

1. 函数调用模式

 普通函数调用模式，如：

function printProps(o){
  ……  
}

printProps({x:1});

在一个调用中，

（1）每个参数表达式计算的结果作为实参传递给声明函数时定义的形参；

（2）this被绑定到全局变量

var myObject = {value:1};
value = 2;
myObject.printProps = function(){
  var printValue = function(){
        console.log(this.value);
    };

  printValue();

  console.log(this.value);
}
myObject.printProps();

此时的运行结果是：

2
1

我们注意到，在printValue()函数在执行时，this.value值为2，也就是说，this指向的是全局对象，而不是myObject。

（3）返回值：函数的返回值成为调用表达式的值。I. 如果函数返回是解释器到达结尾，也就是没有执行到return XXX的语句。返回值为undefined。 II. 如果函数返回是因为接受器执行到return xxx语句，返回return之后的值。 III. 如果return语句后没有值，即return，则返回undefined。

2. 方法调用模式

当一个函数被保存为对象的一个属性时，称为方法。

（1）参数和返回值的处理与函数调用一致；

（2）调用上下文this为该对象

function printValue(){
  console.log(this.value);  
}
var value=1;
var myObject = {value:2};
myObject.m = printValue;
//作为函数调用
printValue();
//作为方法调用
myObject.m();

 运行结果为：

1
2

我们注意到，当调用printValue时，this绑定的是全局对象，打印全局变量value值1。但是当调用myObject.m()时，this绑定的是方法m所属的对象Object，所以打印的值为Object.value，即2。

3. 构造器调用模式

如果函数或方法调用之前带有new关键字，它就构成构造函数调用。如：

function F(){……}

var o = new F();

（1）参数处理：一般情况构造器参数处理和函数调用模式一致。但如果构造函数没用形参，JavaScript构造函数调用语法是允许省略实参列表和圆括号的。

如：下面两行代码是等价的。

var o = new Object();
var o = new Object;

（2）函数的调用上下文为新创建的对象。

function Base(value){
  this.value =value;
}
var value =1;
var o = new Base(2);
console.log(value);
console.log(o.value);
Base(3);
console.log(value);
console.log(o.value);

运行结果：

1
2
3
2

I. 第一次调用Base()函数是作为构造函数调用的，此时调用上下文this被绑定到新创建的对象，即o。所以全局变量value值不变，而o新增一个属性value，值为2；

II. 第二次调用Base()函数是作为普通函数调用的，此时调用上下为this被绑定到全局对象，在浏览器中为window。所以全局对象的value值改变为3，而o的属性值不变。

（3）构造函数通常不使用return关键字，返回值就是新对象。而如果构造函数显示地使用return语句返回一个对象，那么调用表达式值就为这个对象。如果构造函数使用return语句但没有指定返回值或者返回一个原始值，则忽略返回值，同时使用新对象作为调用结果。

 

	函数调用模式	方法调用模式	构造器调用模式	间接调用模式
实参处理	参数表达式运行结果作为实参传递给函数形参	与函数调用模式一致	一般情况，与函数调用模式一致 但如果构造函数没用形参，JavaScript构造函数调用语法是允许省略实参列表和圆括号的	call()方法使用它自有的实参列表作为函数的实参 apply()方法要求以数组的形式传入参数
调用上下文	指向全局变量	指向方法所属的对象	指向新创建的对象	允许显示的指定调用所需的this值，为call()或apply()中的第一个参数
返回值	I. 没有执行到return语句，返回undefined II. 执行到return xxx语句，返回return之后的值 III. retrun后没有值，返回undefined	与函数调用模式一致	构造函数通常不使用return关键字，返回值就是新对象。 如果构造函数显示地使用return语句返回一个对象，那么调用表达式值就为这个对象。 如果构造函数使用return语句但没有指定返回值或者返回一个原始值，则忽略返回值，同时使用新对象作为调用结果。