• <noscript id="e0iig"><kbd id="e0iig"></kbd></noscript>
  • <td id="e0iig"></td>
  • <option id="e0iig"></option>
  • <noscript id="e0iig"><source id="e0iig"></source></noscript>
  • JavaScript原型

    JavaScript原型

    本文主要對JavaScript原型進行分析,詳細闡述了構造函數、原型對象以及對象實例三者之間的關系。


    構造函數

    何為構造函數?構造函數本身是個函數,只不過該函數是出于創建新對象的目的而定義的。通常我們可以使用new操作符后跟一個構造函數來創建一個對象,如下所示:

    示例一:
    function Person(){
    }
    var person1 = new Person();
    person1.name = "Rowling";
    console.log(person1.name);//Rowling

    上述代碼中的Person即為一個構造函數(按照慣例,構造函數名始終都應該以一個大寫字母開頭,構造函數與普通函數的唯一區別在于調用的方式不同),person1就是采用構造函數Person創建的一個對象實例,通過點表示法為person1的name屬性賦值。


    prototype

    我們所創建的每一個函數(當然包括構造函數)都有一個prototype(原型)屬性,這個屬性是一個指針,指向一個對象,這個對象就是該函數的原型對象,也是通過調用該構造函數所創建的那個對象實例的原型對象。
    那么何為原型對象呢?我們可以這么理解:只要創建了一個新函數就會有一個與之關聯的原型對象,同時會根據一組特定的規則為該函數創建一個prototype屬性指向該原型對象。

    示例二:
    function Person(){
    }
    Person.prototype.name = "Rowling";
    Person.prototype.age = 23;
    Person.prototype.sayName = function(){
        console.log(this.name);
    }
    var person2 = new Person();
    console.log(person2.age);//23

    上述代碼中的Person.prototype就是Person構造函數的原型對象。原型對象中的信息(屬性、方法)可以被通過該構造函數創建的對象實例所共享,這一點在之后分析實例和原型對象的時候會再詳細說明。


    constuctor

    每個對象實例都有constructor屬性,指向創建其的構造函數。事實上,在創建了構造函數之后,其原型對象默認只會自動取得一個constructor屬性,該屬性是一個指向該構造函數。即在上述例子中Person.prototype.constructor指向Person。并且該屬性也是共享的,所以可以通過對象實例訪問,這也就是為何Object的每個實例都有constructor屬性的原因。所以根據上述代碼會有如下結果:

    alert(person1.constructor == Person);//true
    alert(person2.constructor == Person);//true

    因此我們可以得出結論,對象實例的constructor屬性其實是來自于其原型(如果不在實例中創建的話)。


    __proto__

    當調用構造函數創建一個新實例后,該實例的內部會自動包含一個指針指向構造函數的原型對象,該指針即為__proto__。在這里需要強調一下,這個指向關聯只存在于對象實例和原型對象之間,而不是存在于實例與構造函數之間。

    console.log(person2.__proto__ === Person.prototype);//true

    至于構造函數和對象實例,它們之間并沒有什么指向關系,對象實例只是通過調用構造函數而生成(new 發方式),而調用構造函數也可創建出很多對象實例。
    綜上,我們可以用下面一張圖來表示構造函數、原型對象以及實例對象之間的關系:
    構造函數、原型對象以及對象實例之間的關系圖

    版權聲明:本文為Rowling_0825原創文章,遵循 CC 4.0 BY-SA 版權協議,轉載請附上原文出處鏈接和本聲明。
    本文鏈接:https://blog.csdn.net/Rowling_0825/article/details/75270888

    智能推薦

    javascript 原型及原型鏈

    構造函數創建一個對象 Person 是一個構造函數,通過new操作符創建一個p1實例。 prototype屬性 每個構造函數都有一個prototype屬性,該屬性指向一個對象,該對象就是通過構造函數創建出來的實例原型,既上述例子中的p1原型; __proto__屬性 每個JavaScript對象(除null)都有一個__proto__屬性,這個屬性會指向該對象的原型 constructor屬性 由...

    [JavaScript]原型和原型鏈

    1,面向對象         JS(ES5)本身是沒有class類型的,但是每個函數都有一個prototype屬性。JavaScript并不是通過類而是通過構造函數來創建對象的。prototype指向一個對象,當函數作為構造函數時,prototype起到類似class的作用。         每創建一個Person構造...

    JavaScript 原型與原型鏈

    原型 每一個函數(function)對象都有一個prototype屬性,這個屬性指向函數的原型對象。原型對象定義了函數對象(構造函數)創造出的對象的公共祖先。即通過函數對象產生的對象可以繼承該原型的屬性和方法。 可以看出Person為函數對象,而它的prototype屬性為普通對象。原型對象中有兩個屬性: constructor 指向原型對象所屬的函數對象(即Person.prototype.co...

    JavaScript原型和原型鏈

    javascript不包含傳統的類繼承模型,而是使用 prototype 原型模型。 雖然這經常被當作是 JavaScript 的缺點被提及,其實基于原型的繼承模型比傳統的類繼承還要強大。實現傳統的類繼承模型是很簡單,但是實現 JavaScript 中的原型繼承則要困難的多。ES6新增加的class語法糖使得這種繼承方式實現起來更加簡單,但其原理還是原型繼承,而不是類繼承。 由于 JavaScri...

    Javascript 原型與原型鏈

    Javascript 原型與原型鏈 1.prototype 2.__ proto__ 3.constructor 4.實例與原型 5.原型的原型 6.原型鏈 7.修改原型 8.類的封裝使用 這個問題在此之前 我都不能很好的回答出來 什么是原型 原型鏈 構造函數 實例 他們之間的關系 近期查閱大量資料文檔 對比有一定的理解 并在此記錄下 1.prototype 在傳統的面向對象編程里面,首先會定義一...

    猜你喜歡

    javascript原型和原型鏈

    一、原型規則 1、所有的引用類型(數組、對象、函數)都具有對象特性,即可自由擴展屬性(除了“null”) 2、所有的引用類型(數組、對象、函數)都有一個__proto__屬性(隱式原型屬性),屬性值是一個普通的對象 3、所有的函數,都有一個 prototype(顯式原型)屬性,屬性值也是一個普通的對象 4、所有的引用類型(數組、對象、函數),__ proto__(隱式原型)...

    JavaScript 原型與原型鏈

    JavaScript 原型與原型鏈 1.什么是原型? 一個對象當他被生成的時候,就會自帶一個屬性 __ Proto __ ,我們將其稱為 隱式原型 一個(通常為構造函數)函數對象被生成的時候,會有一個ProtoType 屬性,我們將其成為 顯式原型 我們通常會利用構造函數創建實例對象 fn是我們的實例對象,Fn則是構造函數。 在執行構造函數的時候,JS會自動執行 即將構造函數的顯式原型屬性,賦值給...

    JavaScript原型和原型鏈

    JavaScript原型和原型鏈 JavaScript 常被描述為一種基于原型的語言 (prototype-based language)——每個對象擁有一個原型對象,對象以其原型為模板、從原型繼承方法和屬性。原型對象也可能擁有原型,并從中繼承方法和屬性,一層一層、以此類推。這種關系常被稱為原型鏈 (prototype chain),它解釋了為何一個對象會擁有定義在其他對象...

    JavaScript——原型和原型鏈

    原型對象 所有的函數都會有一個prototype屬性,這個屬性是公有且不可枚舉的。它會指向一個對象,而這個對象則被稱為該函數的原型對象: 在默認的情況下,所有的原型對象都有一個constructor屬性,這個屬性包含一個指向prototype屬性所在函數的指針。拿之前的例子來講,Foo.prototype.constructor指向Foo。創建了自定義函數后,其原型對象默認只有一個construc...

    Unity_Shader高級篇_13.1_Unity Shader入門精要

    13.4 再談邊緣檢測 在12.3中,我們曾使用Sobel算子對屏幕圖像進行邊緣測試,實現描邊的效果。但是,這種直接利用顏色信息進行邊緣檢測的方法會產生很對我們不希望得到的邊緣線,如圖13.8所示。 可以看出,物體的紋理、陰影等位置也被描上黑邊,而這往往不是我們希望看到的。在本節中,我們將學習如何在深度和法線上進行邊緣檢測,這些圖像不會受紋理和光照的影響,而僅僅保存了當前渲染物體的模型信息,通過這...

    精品国产乱码久久久久久蜜桃不卡