深究JavaScript——函數調用與this詳解

PiscesYE 發布于2019-08-21 11:26 / 1668人閱讀

摘要：構造器的目的是要創建一個新對象并對其進行設置，然后將其作為構造器的返回值進行返回，是通過函數調用初始化創建新對象。或方法進行調用通過或調用函數，被調用的函數的指向第一個參數指向的。

this

??JavaScript的this總是指向一個對象,而這個對象是基于函數運行時動態綁定的，并非函數聲明時綁定。

函數調用方式

作為對象的方法調用

作為普通函數進行調用

作為構造器進行調用

通過apply()或call()方法進行調用

函數參數

??所有函數調用都會傳遞兩個隱式參數：arguments和this。
??所謂隱式，也就意味著這些參數不會顯示列在函數簽名里，但是它們默默地傳遞給函數并存在于函數作用域內。在函數內部，它們可以像其他顯式命名的參數一樣使用。

arguments參數

??arguments參數是傳遞給函數的所有參數的一個集合。該集合有一個length屬性，其值是全部參數的個數，單個參數值可以像訪問數組索引一樣進行獲取。
??但要避免將arguments參數作為數組進行調用。可以利用Array.prototype.slice.call(arguments, 0)將arguments參數轉換為數組;

this參數

??this參數引用了與該函數調用進行隱式關聯的一個對象，被稱之為函數上下文。

this指向 作為對象方法進行調用

??當函數作為對象的方法被調用時，this指向該對象。該對象就成了函數上下文。

window.name = "global";

var obj = {
    name: "staven",
    getName: function () {
        return this.name;
    }
};
//作為對象方法調用
console.log(obj.getName());   //staven

作為普通函數進行調用

??一種方式調用，函數的上下文時全局上下文——window對象。

window.name = "global";

var obj = {
    name: "staven",
    getName: function () {
        return this.name;
    }
};
//作為對象方法調用
console.log(obj.getName());   //staven
//將函數引用指針賦給getName變量
var getName = obj.getName;
//作為普通函數調用
console.log(getName());   //global

??常見的一種情形是，函數中的某個函數內部的this指向的是全局對象。解決這種問題，可var that = this;內部函數使用that代替this。

作為構造器進行調用

??將函數作為構造器進行調用，我們要在函數調用前使用new關鍵字。其上下文是新創建的對象實例。
??構造器調用時，如下特殊行為會發生：

創建一個新的空對象

傳遞給構造器的對象是this參數，從而成為構造器的函數上下文。

如果沒有顯式的返回值，新創建的對象則作為構造器的返回值進行返回。

??構造器的目的是要創建一個新對象并對其進行設置，然后將其作為構造器的返回值進行返回，是通過函數調用初始化創建新對象。

var Person = function () {
    this.name = "staven";
};

var obj = new Person();
console.log(obj.name);  //staven

??如果構造器顯式返回了一個對象，那么此次運算最終返回這個對象，而不是this。

var Person = function () {
    this.name = "staven";
    return {
        name: "backedName"
    }
};

var obj = new Person();
console.log(obj.name);  //backedName

??如果構造器不顯式返回任何數據，或返回的非對象數據，就不會存在上述問題。

var Person = function () {
    this.name = "staven";
    return "backedName";
};

var obj = new Person();
console.log(obj.name);  //staven

apply()或call()方法進行調用

??通過call或apply調用函數，被調用的函數的this指向第一個參數指向的this。上下文可設為任意值。每個函數都有apply()和call()方法，使用其中一個方法，都可以顯示指定任何一個對象作為其函數上下文。
??通過函數的apply()方法來調用函數，我們要給apply()傳入兩個參數：一個是作為函數上下文的對象，另外一個是作為函數參數所組成的數組。call()方法的使用方式類似，唯一不同的是，給函數傳入的參數是一個參數列表，而不是單個數組。
??當使用 call 或者 apply 的時候，如果我們傳入的第一個參數為null，函數體內的 this 會指向默認的宿主對象。

var obj1 = {
    name: "jsor",
    getName: function () {
        return this.name;
    }
};

var obj2 = {
    name: "staven"
};

console.log(obj1.getName());        //jsor
console.log(obj1.getName.call(obj2));   //staven

GPU云服務器云服務器 javascript中this詳解 javascript調用函數 javascript調用php函數 php函數與函數調用

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/86695.html

深究JavaScript——執行上下文

摘要：一系列活動的執行上下文從邏輯上形成一個棧。堆棧中的上下文就會被依次執行并且彈出堆棧，直到回到全局的上下文。確定上下文中的指向對象確定指向或當前對象。定義執行上下文（也稱執行環境execution context）（簡稱：EC）是個抽象的概念，是在函數被調用時，但是在函數體被真正執行以前所創建的。每個執行上下文都有一個變量對象(variable object)，保存著當前環境中所有的...

netScorpion 2019-08-21 14:21 評論0 收藏0
深究JavaScript——閉包

摘要：函數是中唯一擁有自身作用域的結構，因此閉包的創建依賴于函數。閉包中的匿名函數的執行環境具有全局性，因此其對象通常指向在通過或改變函數執行環境的情況下，就會指向其他對象。當匿名函數執行完畢，其作用域鏈立即銷毀，從而可以減少閉包占用資源問題。概念 ??閉包是指能夠引用外部函數中的局部變量的函數，并導致外部函數調用后函數對象與局部變量無法及時銷毀。函數是JavaScript中唯一擁有自身作...

Dionysus_go 2019-08-21 11:32 評論0 收藏0
深究JavaScript——原型：prototype、constructor、__proto__

摘要：是構造函數的屬性，而不是實例對象的屬性，指向原型對象。這個連接存在于實例與構造函數的原型對象而不是構造函數之間，也就是說實例對象與構造函數沒有直接關系。 prototype、constructor、__proto__ ??prototype是站在構造函數的角度討論原型對象的，用來實現基于原型的繼承與屬性的共享。__proto__是站在實例對象的角度討論原型對象，構成原型鏈，同樣用于實現...

jeffrey_up 2019-08-22 11:19 評論0 收藏0
深究JavaScript——參數傳遞與變量復制

摘要：在操作對象時，實際上是在操作對象的引用而不是實際的對象。任一變量值操作互不影響。訪問變量有按值和按引用兩種方式，而參數只能按值傳遞。基本類型參數傳遞傳給函數的是數值的一個復制，函數中對其的修改外部不可見。 ?? ECMAScript 變量可能包含兩種不同數據類型的值：基本類型值和引用類型值。基本類型值指的是簡單的數據段，而引用類型值指那些可能由多個值構成的對象。 ??5 種基本數據類...

jzman 2019-08-21 17:16 評論0 收藏0
JavaScript深入淺出

摘要：理解的函數基礎要搞好深入淺出原型使用原型模型，雖然這經常被當作缺點提及，但是只要善于運用，其實基于原型的繼承模型比傳統的類繼承還要強大。中文指南基本操作指南二繼續熟悉的幾對方法，包括，，。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。怎樣使用 this 因為本人屬于偽前端，因此文中只看懂了 8 成左右，希望能夠給大家帶來幫助....（據說是阿里的前端妹子寫的） this 的值到底...

blair 2019-08-21 18:26 評論0 收藏0