JavaScript 之原型與周邊

codecook 發布于2019-08-19 17:17 / 873人閱讀

摘要：除此之外，原型是共享的，如果我們有的寫法，改變這兩個對象任何一個的原型都會影響另外一個，這在大多的情況下是不可取的。當對象查找一個屬性的時候，他會沿著原型鏈一直往上追蹤，直到直到為之。在性能方面，原則上應該盡量避免原型鏈太長。

簡介

如果之間學習過cpp 、java 之類的語言，都會知道他們是可以基于類 class 進行繼承的，在JavaScript 中，并沒有類繼承這個概念，要實現JavaScript 中的繼承，需要原型來幫助。

比如在下面的這段代碼中：

function Foo () {
  this.value = 1;
};

Foo.prototype = {
  method: function () {};
};

//設置Bar的原型為Foo()的實例
Bar.prototype = new Foo();
Bar.prototype.foo = "Hello World";

//修正Bar的constructor
Bar.prototype.constructor = Bar;

//創建一個Bar的實例
var test = new Bar();

在這段代碼中，就一直維護著一個原型鏈，抽象化的理解起來可能是這樣的：

test [Bar的實例]
     Bar.prototype [Foo的實例]
         {foo: "Hello World!"}
         Foo.prototype
            {method: function(){}}
            Object.prototype
                {...}

很好去理解，test 是從Bar.prototype 和 Foo.prototype 中繼承下來的，所以他能夠訪問Foo 實例屬性中的value 。

需要注意的是，在 new Bar 操作中，并不會重新創建一個Foo 的實例，而是會重復的使用在他的原型上的那個實例。

除此之外，原型是共享的，如果我們有Foo.prototype = Bar.prototype 的寫法，改變這兩個對象任何一個的原型都會影響另外一個，這在大多的情況下是不可取的。

當對象查找一個屬性的時候，他會沿著原型鏈一直往上追蹤，直到直到為之。當然 Object.prototypr 就是這個鏈的最后一層了，如果還是沒找到，就會返回undefined 。

hasOwnProperty

在性能方面，原則上應該盡量避免原型鏈太長。正如用for ... in ... 去遍歷的時候，他會去遍歷整個原型鏈，這往往在比較高的性能要求或者普通的遍歷中是不可取的。

為了去判斷一個對象包含的屬性是他本身就有的還是在原型鏈上的，需要使用繼承在Object prototype 上的hasOwnProperty 方法。

比如在下面的例子中

Oboject.prototype.bar = 1;

var foo = {
  value: 2；
};

foo.var          //通過原型鏈繼承自Object，輸出1
"bar" in foo;    //通過整個原型鏈進行查找，輸出true

foo.hasOwnProperty("bar");    //false
foo.hasOwnProperty("value")   //true

在for ... in ... 的遍歷中，一般建議使用hasOwnProperty 的方法。

需要注意的是： javascript并沒有對hasOwnProperty 做相關的保護，如果恰巧對象有這個叫做hasOwnProperty 的屬性，那么產生的結果應該不是我們所期待的。比如像下面這樣：

var foo = {
  hasOwnProperty: function () { return flase};
  bar: "1";
};

foo.hasOwnProperty("bar") //正如你猜的那樣，返回的值永遠是false

這時候可能需要做的就是調用外部的hasOwnproperty，對，就是用call 或者apply。像下面這樣：

//返回true
Object.hasOwnProperty.call(foo, "bar");
Object.hasOwnProperty.apply(foo, ["bar"]);

原文鏈接：http://life.rccoder.net/javascript/1207.html

云服務器 GPU云服務器 javascript原型周邊與Javascript 成都周邊地域名

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

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

體驗javascript之美6：如果你覺得什么都會了或者不知道js學什么了看這里-面向對象編程

摘要：面向過程函數式編程面向對象編程第二個并不是大家理解的那樣，我們先說舉個現實例子就明白了。多說一句函數是編程是非常強大也是我最喜歡的，以后再說，我們先說面向對象編程。概述當大家已經把js的語言基礎理解了，然后能夠寫出一些簡單的例子了，這個時候基本上達到了一年工作經驗的水平，而自己能夠獨立的寫一些小功能，完成一些小效果，或者臨摹修改一些比較復雜的插件的時候差不多就是兩年工作經驗的水平，...

changfeng1050 2019-08-20 15:59 評論0 收藏0
如何安全過渡到公共云

摘要：簡而言之，公司需要采取主動系統的方法，使網絡安全功能可以適應公共云。將開發運維應用于網絡安全如果開發人員可以在短短幾秒內啟動服務器，但必須等待兩周的時間才能讓安全團隊認同配置，這會削弱公共的云靈活性所帶來的價值。隨著企業不斷擴大對公共云的使用，它們必須反思如何保護數據和應用程序，并實施四項關鍵實踐。經過長時間的實驗，龍頭企業正在認真考慮大規模采用公共云。在過去幾年中，很多公司已經改變了IT戰...

Terry_Tai 2019-04-30 17:35 評論0 收藏0
JavaScript深入之從原型到原型鏈

摘要：深入系列的第一篇，從原型與原型鏈開始講起，如果你想知道構造函數的實例的原型，原型的原型，原型的原型的原型是什么，就來看看這篇文章吧。讓我們用一張圖表示構造函數和實例原型之間的關系在這張圖中我們用表示實例原型。 JavaScript深入系列的第一篇，從原型與原型鏈開始講起，如果你想知道構造函數的實例的原型，原型的原型，原型的原型的原型是什么，就來看看這篇文章吧。構造函數創建對象我們先...

Songlcy 2019-08-21 15:32 評論0 收藏0
進擊JavaScript之（四）原型與原型鏈

摘要：每一個由構造函數創建的對象都會默認的連接到該神秘對象上。在構造方法中也具有類似的功能，因此也稱其為類實例與對象實例一般是指某一個構造函數創建出來的對象，我們稱為構造函數的實例實例就是對象。表示該原型是與什么構造函數聯系起來的。本文您將看到以下內容：傳統構造函數的問題一些相關概念認識原型構造、原型、實例三角結構圖對象的原型鏈函數的構造函數Function 一句話說明什么...

XBaron 2019-08-20 10:45 評論0 收藏0