JS復習--原型鏈小結

Gu_Yan 發布于2019-08-22 14:57 / 718人閱讀

摘要：為什么需要原型鏈為了實現繼承，具有相同特性的代碼不需要重復編寫，放在構造函數里面，實例化的對象都會擁有里面的屬性了，也就是可以共享屬性和方法。

一段簡單代碼引入

function Foo() {}；

var f1 = new Foo();

1.概念簡單理解

Foo()是構造函數，構造函數有一個prototype屬性

Foo.prototype 是f1的原型對象，有一個constructor屬性，指向該原型對象對應的構造函數，即

Foo.prototype.constructor

console.log(Foo.prototype.constructor === Foo);//true

console.log(f1._proto_=== Foo.prototype);//true

console.log(f1._proto_.constructor=== Foo);//true

f1是Foo的實例對象，自身沒有constructor屬性，但可以繼承原型對象的屬性，即

console.log(f1.constructor === Foo);//true

console.log(f1.hasOwnProperty("constructor"));//false

2.結合demo

原型鏈是對于構造函數而言的，首先定義一個構造函數，再實例化生成一個實例對象，可能在實例對象中沒有定義某個屬性，但是在構造函數中有，那么它就會往上（向構造函數中）查找，這個查找的過程就叫做原型鏈。

function Foo(){};

Foo.prototype.name = "ziziyaya";

var foo=new Foo();

console.log(foo.name); //ziziyaya

3.為什么需要原型鏈

為了實現繼承，具有相同特性的代碼不需要重復編寫，放在構造函數里面，實例化的對象都會擁有里面的屬性了，也就是可以共享屬性和方法。

function Dog() {

    this.eat = "food";

    this.smell = "smart";

}

let dog1 = new Dog();

let dog2 = new Dog();

dog1.name = "huang";

dog2.name = "hei";

console.log(dog1.name+","+dog1.eat+","+dog1.smell);//huang,food,smart

console.log(dog2.name+","+dog2.eat+","+dog2.smell);//hei,food,smart

推薦文章：http://www.ruanyifeng.com/blo...

4.繼續往上引申--Foo.prototype的構造函數是Object(),原型對象是Object.prototype

console.log(Foo.prototype.__proto__ === Object.prototype);//true

實例對象Foo.prototype本身具有constructor屬性，所以它會覆蓋繼承自原型對象Object.prototype的constructor屬性

下面是自身沒有constructor屬性，繼承自原型對象的f1和自身有constructor屬性覆蓋了原型對象的Foo.prototype 截圖對比

再往上引申如果Object.prototype作為實例對象的話，其原型對象是什么，結果是null
附加一篇簡潔易懂的原型鏈理解的文章 http://www.cnblogs.com/shuiyi...

云服務器 GPU云服務器 js原型鏈的繼承原型原型鏈原型鏈原型鏈繼承

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

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

JS對象小結

摘要：返回新對象構造函數與其他函數的唯一區別，就在于調用它們的方式不同。在默認情況下，所有原型對象都會自動獲得一個構造函數屬性，這個屬性是一個指向屬性所在函數的指針。對象 1.對象的定義無序屬性的集合，其屬性可以包含基本值，對象或者函數。每個屬性都是一個名/值對。屬性名是字符串，因此我們可以把對象看成是從字符串到值的映射。 2.對象的創建 ======= 通過new創建對象 new...

mzlogin 2019-08-22 18:45 評論0 收藏0
2018.11.19秋招末第二波前端實習/校招小結

摘要：背景個人背景就讀于東北某普通二本院校計算機軟件工程專業，現大四，北京實習前端方向，自學，技術棧時間背景大概是在月日準備好簡歷開始投遞秋招差不多已經結束招聘崗位不多，投遞對象為大一些的互聯網公司事件背景第一個入職的是好未來的前端實習崗，待遇工背景個人背景就讀于東北某普通二本院校計算機軟件工程專業，現大四，北京實習前端方向，自學，vue技術棧時間背景大概是在11月9日準備...

suxier 2019-08-29 17:21 評論0 收藏0
2018.11.19秋招末第二波前端實習/校招小結

摘要：背景個人背景就讀于東北某普通二本院校計算機軟件工程專業，現大四，北京實習前端方向，自學，技術棧時間背景大概是在月日準備好簡歷開始投遞秋招差不多已經結束招聘崗位不多，投遞對象為大一些的互聯網公司事件背景第一個入職的是好未來的前端實習崗，待遇工背景個人背景就讀于東北某普通二本院校計算機軟件工程專業，現大四，北京實習前端方向，自學，vue技術棧時間背景大概是在11月9日準備...

canger 2019-08-26 13:25 評論0 收藏0
深入理解JS的面向對象（更新中）

摘要：的面向對象主要包含了兩塊創建對象繼承。構造函數一般來說，我們可以這樣定義構造函數構造函數的函數名常大寫在這里，我們沒有顯示的創建對象，沒有語句，卻將屬性和方法賦值給了。面向對象是軟件開發方法。面向對象的概念和應用已超越了程序設計和軟件開發，擴展到如數據庫系統、交互式界面、應用結構、應用平臺、分布式系統、網絡管理結構、CAD技術、人工智能等領域。面向對象是一種對現實世界理解和抽象的方法...

陳偉 2019-08-22 15:07 評論0 收藏0
復習Javascript專題（三）：面向對象（對象的創建與繼承，原型及原型鏈）

摘要：在創建子類實例時，不能向超類型的構造函數中傳遞參數。構造函數繼承子類傳進的值是基本思想是在子類構造函數的內部調用超類或父類型構造函數。繼承保證構造函數指針指向如果想同時繼承多個，還可使用添加屬性的方式類繼承， OOP：Object Oriented Programming 面向對象編程。題外話：面向對象的范圍實在太大，先把這些大的東西理解理解。 1.什么是對象？根據高程和權威指南上...

testHs 2019-08-23 13:39 評論0 收藏0