首頁 > web前端 > js教程 > 函數呼叫的不同方式及this的指向詳解

函數呼叫的不同方式及this的指向詳解

小云云
發布: 2018-02-06 09:22:02
原創
1962 人瀏覽過

一、函數的呼叫方式

#1.作為函數,一種直接易懂的方式(即函數呼叫模式)。

2.作為方法,方法是連接在物件上的,被這個物件調用,這種形式就是物件導向程式設計。

3.作為建構器,在建構的過程中一個新的物件被創建出來。

4.經由函數的apply或call方法。

本文主要為大家帶來一篇淺談函數呼叫的不同方式,以及this的指向。小編覺得蠻不錯的,現在就分享給大家,也給大家做個參考。一起跟著小編過來看看吧,希望能幫助大家。

二、函數參數

1.傳入參數

(1)傳入變數多於函數定義變數。

(2)函數定義變數多餘傳入變量,多出來的變數是undefined

2.函數在被呼叫的時候,隱形的傳入兩個參數argument和this(即argument和this被悄悄傳入函數,作用在函數的作用域)。

(1)argument:函數呼叫時傳入函數的變數集合(有arguemnt.length屬性)

eg:argument[0]指的是傳入函數的第一個參數

(2)this關聯一個物件。

根據呼叫方式的不同,this的指向也不同。因此this為呼叫的上下文(invocation context)。

三、this的指向

1.函數呼叫模式 (this->window)

這個函數並不屬於任何物件的屬性。

function fn1(){
 //some code
}
fn1();
或着:
var fn2=function(){
 //some code
}
fn2();
使用这种方式调用函数,函数的上下文是全局上下文(global context即window)。this->window。
登入後複製

2.方法呼叫模式   (this->方法所屬的物件)

這個函數是一個物件的屬性,當這個函數被呼叫時,這個函數被視為這個對象的一個方法。

var obj={
 //some code;
};
obj.getname=function(){
 //some name
}
obj.getname();
函数的上下文是这个对象(例子中的 obj)。this->obj
登入後複製

3.建構器呼叫模式(this->建立的新物件)

函數被當作建構器呼叫時有以下特點:

一個新的對象被創建出來;

這個新的物件被傳遞給這個建構器作為this參數,也就是說這個新的物件是建構器函數的上下文;

如果沒有顯性的return語句,這個新的物件會被隱式的return(就是悄咪咪的被return了),而成為這個構造器的值。

function Fn(){
 this.a=function(){
   return this;
 }
}
var n=new Fn();
console.log(n.a());//Fn{a:f}
console.log(n);//fn{a:f}
//此例中,构造了一个构造函数Fn((),利用new关键字调用时一个空的对象被创建出来,并传递到函数中作为this存在。this-Fn(新的)
//这个构造器同时创建了a属性,并将此属性作为一个方法赋予给它创建出新对象的实例。
登入後複製

4.apply()獲得call()方法  (this->可以是我們指定的任何物件)

(1)apply(),兩個參數。第一個參數:用於作為函數上下文的物件。第二個參數:一個參數數組。

(2)call(),兩個參數。第一個參數:用於作為函數上下文的物件。第二個參數:argument list。

call()和apply()多用於函數回呼。

function circle(list,calback){
 for(var i=0;i<list.length;i++){
   calback.call(list[i],i);
 }
}
var list=[&#39;a&#39;,&#39;b&#39;,&#39;c&#39;];
circle(list,function(index){
 console.log(index);//0,1,2(即传进来的i值)
 console.log(this);//a,b,c(call的第一个参数)
});
//this->call()传递进来的第一个参数。
登入後複製

相關推薦:

mysqli批次執行多條語句和一次函數呼叫執行多條語句方法

微信小程式Page中data資料運算與函式呼叫詳解

如何解決js父級函數呼叫子函數出現函數未定義問題

以上是函數呼叫的不同方式及this的指向詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板