JavaScript 函數調用
函數體程式碼在函數被呼叫時才會執行。
Javascript函數有4中呼叫方式:
普通的函式呼叫
#方法呼叫
建構函式呼叫
透過call( ) 和apply() 間接呼叫
1.普通的函數呼叫
最常用的函數呼叫方式,如:
alert("hello");
var result = add(1, 2);
2. 方法呼叫
//定義一個函數
function hello(name) {
alert('hello,' + name) ;
};
var user = {};
//賦值給user的sayHi屬性
user.sayHi = hello;
//方法呼叫
user.sayHi('張三');
普通的函式呼叫和方法呼叫的一個差異:在"普通的函數呼叫"方式中,函數的呼叫上下文(this的值),為全域物件(非嚴格模式)或undefined(嚴格模式)。而在"方法呼叫"方式中,this指向當前物件。利用這項特性,我們可以在方法不需要明確的回傳值時,直接傳回this,從而實現"方法鏈"。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <p id="demo"></p> <script> function myFunction(a, b) { return a * b; } document.getElementById("demo").innerHTML = myFunction(10, 2); </script> </body> </html>
巢狀函數中的this:在巢狀函數中,內層函數不會繼承外層函數的this,也就是當內層函數作為方法呼叫時,內層函數的this指向目前呼叫對象;當內層函數作為函數呼叫時,this的值為全域物件(非嚴格模式)或undefined(嚴格模式)。怎樣在內層函數中存取外層函數的this呢?通常將this保存在一個局部變數中,透過變數來存取:
var obj = {
f : function() {
var self = this;
console.log(this === obj);//true,this指向目前物件
# f1();
# function f1() {
console.log(this === obj);//false,this為全域物件或undefined
console. console.
console。 true,self指向外層this,也就是目前物件
}
}
#} ;
3. 建構函式呼叫當使用new關鍵字建立一個物件時,即呼叫了建構函式。建構子若沒有形參,可以省略圓括號:
var obj = new Object();
##//等價於
呼叫建構函數,建立了一個新對象,這個新物件會成為該建構函數的呼叫上下文(this的值):
function User(name) {
this.name=name;
console.debug(this);
}
var user = new User('張三');
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <p id="demo"></p> <script> function myFunction(arg1, arg2) { this.firstName = arg1; this.lastName = arg2; } var x = new myFunction("John","Doe") document.getElementById("demo").innerHTML = x.firstName; </script> </body> </html>
4. 透過call() 和apply( ) 間接呼叫
Javascript中函數也是對象,也擁有方法。其中 call() 和 apply() 可以用來間接呼叫函數。 call() 的第一個參數用來指定呼叫上下文(即this的值),後面的參數是傳入呼叫函數的實參。
var name = 'A';
var user = {
name : 'B'
};
function showName() {
alert(this.name);
}
#showName();//A,this為全域物件
showName.call(user);//B,this為user物件
apply() 和call() 類似,區別在於,後面的實參需要以數組的形式傳遞(可將當前函數的arguments數組直接傳入)。