最新的Web开发教程
 

JavaScript函数调用


JavaScript函数可以在4种不同的方式来调用。

每一种方法的不同之处是如何this被初始化。


this关键字

在JavaScript中,所谓的东西this是“拥有”当前代码的对象。

的值this ,在一个功能中使用时,是“拥有”的功能的对象。

注意, this不是一个变量。 它是一个关键字。 你不能改变的值this


调用javascript函数

你已经知道,当“东西”调用它的JavaScript函数中的代码将被执行。

定义的功能时,不执行在一个函数的代码。 在调用函数时,它被执行。

有些人用术语“ 调用函数 ”而不是“ 调用函数 ”。

这也是很常见的说:“在一个函数调用”,“启动功能”,或“执行功能”。

在本教程中,我们将使用调用 ,因为JavaScript函数可以不被称为调用。


调用一个函数作为功能

function myFunction(a, b) {
    return a * b;
}
myFunction(10, 2);           // myFunction(10, 2) will return 20
试一试»

上面的函数不属于任何对象。 但在JavaScript中总有一个缺省全局对象。

在HTML中的默认全局对象是HTML网页本身,所以上述的函数“属于”HTML页面。

在浏览器的页面对象是浏览器窗口。 上面的函数自动成为一个窗口函数。

myFunction()window.myFunction()是相同的功能:

function myFunction(a, b) {
    return a * b;
}
window.myFunction(10, 2);    // window.myFunction(10, 2) will also return 20
试一试»

这是调用一个JavaScript函数的一种常见方式,但不是一个很好的做法。
全局变量,方法或功能可以轻松地创建名称冲突和错误在全局对象。


全局对象

当一个函数被称为无主物,值this成为全局对象。

在网络浏览器的全局对象是浏览器窗口。

此示例返回窗口对象的值, this

function myFunction() {
    return this;
}
myFunction();                // Will return the window object
试一试»

调用一个函数作为一个全球性的功能,使价值this是全局对象。
使用window对象作为变量可以很容易地你的程序崩溃。


调用函数作为方法

在JavaScript中,你可以定义函数作为对象的方法。

下面的示例创建一个对象( myObject ),具有两个属性( firstNamelastName )和方法( fullName ):

var myObject = {
    firstName:"John",
    lastName: "Doe",
    fullName: function () {
        return this.firstName + " " + this.lastName;
    }
}
myObject.fullName();         // Will return "John Doe"
试一试»

fullName的方法是一个函数。 函数所属的对象。 myObject是该函数的所有者。

所谓的事情this是“拥有”的JavaScript代码的对象。 在这种情况下的价值thismyObject

测试一下吧! 更改fullName方法返回的值, this

var myObject = {
    firstName:"John",
    lastName: "Doe",
    fullName: function () {
        return this;
    }
}
myObject.fullName();          // Will return [object Object] (the owner object)
试一试»

调用函数作为对象的方法,使价值this是对象本身。


调用函数与函数构造

如果一个函数调用前面加了new的关键字,这是一个构造函数调用。

它看起来像你创建一个新的功能,但由于JavaScript函数是对象实际上创建一个新的对象:

// This is a function constructor:
function myFunction(arg1, arg2) {
    this.firstName = arg1;
    this.lastName  = arg2;
}

// This creates a new object
var x = new myFunction("John","Doe");
x.firstName;                             // Will return "John"
试一试»

构造函数调用创建一个新对象。 新对象将继承它的构造函数的属性和方法。

this关键字在构造函数中不具有的价值。
this将是被调用函数时创建的新对象。


调用函数与函数法

在JavaScript中,函数是对象。 JavaScript函数具有属性和方法。

call()apply()是预定义的JavaScript函数的方法。 这两种方法都可以用来调用的功能,并且这两种方法必须具有所有者对象作为第一参数。

function myFunction(a, b) {
    return a * b;
}
myObject = myFunction.call(myObject, 10, 2);     // Will return 20
试一试»

function myFunction(a, b) {
    return a * b;
}
myArray = [10, 2];
myObject = myFunction.apply(myObject, myArray);  // Will also return 20
试一试»

这两种方法都需要一个所有者对象作为第一个参数。 唯一的区别在于call()分别取函数参数和apply()取函数的参数在数组中。

在JavaScript严格模式,第一个参数就值this在调用的功能,即使参数不是一个对象。

在“非严格”模式下,如果第一个参数的值为null或undefined,它被替换成全局对象。

随着call()apply()可以设置的值, this和调用一个函数作为现有对象的新方法。