資訊專欄INFORMATION COLUMN
摘要：每一個通過構(gòu)造函數(shù)實例化的對象和都具有構(gòu)造函數(shù)中的屬性，實例和構(gòu)造函數(shù)之間是構(gòu)造關(guān)系構(gòu)造過程中也形成了原型關(guān)系是的原型，是的原型，實例通過原型鏈找到原型中的屬性和方法。自定義和構(gòu)造函數(shù)的屬性是自有屬性，它們是對象本身的屬性。
繼承原理：實例中包含一個指向原型對象的內(nèi)部指針
實現(xiàn)方法：讓原型對象等于另一個類型的實例
關(guān)鍵點：
構(gòu)造函數(shù)、原型對象、實例
實例屬性、原型方法
構(gòu)造關(guān)系、原型關(guān)系
自有屬性、繼承屬性和方法
demo：
//構(gòu)造器
function Animal() {
this.animal = "animal";
};
function Mammal() {
this.mammal = "mammal";
};
var cat;
//原型鏈
Mammal.prototype = new Animal();
cat = new Mammal();
//添加屬性和方法
Animal.prototype.isAnimal = true;
Animal.prototype.sayAnimal = function() {
alert("Is it " + this.animal + "? " + this.isAnimal);
};
Mammal.prototype.isMammal = true;
Mammal.prototype.sayMammal = function() {
alert("Is it a " + this.mammal + "? " + this.isMammal);
};
先來看看每個對象都能訪問到哪些屬性和方法：
Animal.prototype:
isAnimal //自定義 sayAnimal() //自定義
Mammal.prototype:
isMammal //自定義 sayMammal() //自定義 animal //來自構(gòu)造函數(shù) isAnimal //來自繼承 sayAnimal() //來自繼承
cat:
mammal //來自構(gòu)造函數(shù) isMammal //來自繼承 sayMammal() //來自繼承 animal //來自繼承 isAnimal //來自繼承 sayAnimal() //來自繼承
在這個demo中，有兩對構(gòu)造關(guān)系和兩對繼承關(guān)系（不考慮Object）。每一個通過構(gòu)造函數(shù)實例化的對象（Mammal.prototype和cat）都具有構(gòu)造函數(shù)中的屬性，實例和構(gòu)造函數(shù)之間是構(gòu)造關(guān)系；構(gòu)造過程中也形成了原型關(guān)系：Mammal.prototype是cat的原型，Animal.prototype是Mammal.prototype的原型，實例通過原型鏈找到原型中的屬性和方法。
自定義和構(gòu)造函數(shù)的屬性是自有屬性，它們是對象本身的屬性。來自繼承的屬性和方法是對象沿著原型鏈找到的，它們并不是對象本身的屬性和方法。
實例繼承到的方法的作用域是該實例對象內(nèi)部的執(zhí)行環(huán)境，可以訪問實例能獲取到的所有屬性。通過this.property的方式可以得到實例對象能夠訪問到的所有屬性和方法，包括自有屬性和繼承的屬性方法。demo中的實例對象cat可以訪問到在Animal和Mammal及其原型中定義的所有屬性方法，這正是繼承的意義所在。
驗證：
console.log(cat.mammal); //mammal console.log(cat.isMammal); //true console.log(cat.sayMammal()); //Is it mammal? true console.log(cat.animal); //animal console.log(cat.isAnimal); //true console.log(cat.sayAnimal()); //Is it animal? true
轉(zhuǎn)載請注明出處：https://segmentfault.com/a/1190000004550787
文章不定期更新完善，如果能對你有一點點啟發(fā)，我將不勝榮幸。
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/87726.html
摘要：對象具有自有屬性，也有一些屬性是從原型對象繼承而來的。為了更好地理解對象自有屬性和繼承屬性下面的示例深入解釋了屬性的訪問和設(shè)置細(xì)節(jié)。在給對象的屬性賦值時，是在原始對象上創(chuàng)建屬性或者對已有屬性賦值，而不會去修改原型鏈。 Javascript對象具有自有屬性（own property），也有一些屬性是從原型對象繼承而來的。為了更好地理解對象自有屬性和繼承屬性下面的示例深入解釋了屬性的訪問和...
摘要：避免脆弱的基類問題。紅牌警告沒有提到上述任何問題。單向數(shù)據(jù)流意味著模型是單一的事實來源。單向數(shù)據(jù)流是確定性的，而雙向綁定可能導(dǎo)致更難以遵循和理解的副作用。原文地址 1. 你能說出兩種對 JavaScript 應(yīng)用開發(fā)者而言的編程范式嗎？ 希望聽到： 2. 什么是函數(shù)編程？ 希望聽到： 3. 類繼承和原型繼承的不同？ 希望聽到 4. 函數(shù)式編程和面向?qū)ο缶幊痰膬?yōu)缺點？ ...
摘要：使用異步編程，有一個事件循環(huán)。它作為面向?qū)ο缶幊痰奶娲桨?，其中?yīng)用狀態(tài)通常與對象中的方法搭配并共享。在用面向?qū)ο缶幊虝r遇到不同的組件競爭相同的資源的時候，更是如此。 翻譯：瘋狂的技術(shù)宅原文：https://www.indeed.com/hire/i... 本文首發(fā)微信公眾號：jingchengyideng歡迎關(guān)注，每天都給你推送新鮮的前端技術(shù)文章 不管你是面試官還是求職者，里面...
摘要：首先，需要來理清一些基礎(chǔ)的計算機(jī)編程概念編程哲學(xué)與設(shè)計模式計算機(jī)編程理念源自于對現(xiàn)實抽象的哲學(xué)思考，面向?qū)ο缶幊淌瞧湟环N思維方式，與它并駕齊驅(qū)的是另外兩種思路過程式和函數(shù)式編程。 JavaScript 中的原型機(jī)制一直以來都被眾多開發(fā)者（包括本人）低估甚至忽視了，這是因為絕大多數(shù)人沒有想要深刻理解這個機(jī)制的內(nèi)涵，以及越來越多的開發(fā)者缺乏計算機(jī)編程相關(guān)的基礎(chǔ)知識。對于這樣的開發(fā)者來說 J...
摘要：最近剛剛看完了你不知道的上卷，對有了更進(jìn)一步的了解。你不知道的上卷由兩部分組成，第一部分是作用域和閉包，第二部分是和對象原型。附錄詞法這一章并沒有說明機(jī)制，只是介紹了中的箭頭函數(shù)引入的行為詞法。第章混合對象類類理論類的機(jī)制類的繼承混入。 最近剛剛看完了《你不知道的 JavaScript》上卷，對 JavaScript 有了更進(jìn)一步的了解。 《你不知道的 JavaScript》上卷由兩部...
閱讀 2572·2021-09-09 09:33
閱讀 2939·2019-08-30 15:56
閱讀 3207·2019-08-30 14:21
閱讀 961·2019-08-30 13:01
閱讀 956·2019-08-26 18:27
閱讀 3659·2019-08-26 13:47
閱讀 3532·2019-08-26 10:26
閱讀 1657·2019-08-23 18:38
