關于constructor 的理解

_DangJin 發布于2019-08-22 17:03 / 2629人閱讀

摘要：在默認情況下，所有原型對象都會自動獲得一個構造函數屬性，這個屬性是一個指向屬性所在函數的指針。但有一點我們是要注意的，當我們將構造函數的設置為等于一個以對象字面量形式創建的新對象時，屬性不再指向該構造函數。

1 面試題再現

面試時遇到下面一段代碼：

  function A () {}
  function B () {}
  A.prototype = {
    fun: function () {}
  }
  var a =new A ()

  console.log(a.constructor === A)
  console.log(A.prototype.constructor === A)
  console.log(a.hasOwnProperty("constructor"))

大家猜到上面的結果是啥了嗎？正確答案是 false false false

2 constructor原理

我們創建的每個函數都有一個prototype（原型）對象，這個屬性是一個指針，指向一個對象。在默認情況下，所有原型對象都會自動獲得一個constructor（構造函數）屬性，這個屬性是一個指向prototype屬性所在函數的指針。當調用構造函數創建一個新實例后，該實例的內部將包含一個指針（繼承自構造函數的prototype），指向構造函數的原型對象。

但有一點我們是要注意的，當我們將構造函數的prototype設置為等于一個以對象字面量形式創建的新對象時，constructor屬性不再指向該構造函數。

3 回歸題目

該題目就是有了對A的prototype的重新設置，導致A.prototype 不在指向A的構造函數。所以上面前兩個都返回false。而constructor 是繼承自prototype ,所以hasOwnProperty("constructor") 是false.
如果A.prototype重新賦值后希望constructor仍指向A的話，我們可以在字面對象里加一個constructor屬性讓它指向A。

A.prototype = {
    fun: function () {},
    constructor: A
}

這樣就可以返回true了

4 進階題目

 A.prototype = new B()
 var b = new A()
 console.log(b.constructor === A)
 console.log(B.prototype.constructor === A)
 console.log(b.constructor.prototype.constructor === A)
 console.log(b.hasOwnProperty("constructor"))

上面的都是返回false, 你答對了嗎？

GPU云服務器云服務器 constructor 云計算的理解 cdn的理解對大數據的理解

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

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

javascript基礎篇：關于js面向對象的理解

摘要：關于中面向對象的理解面向對象編程它是一種編程思想我們的編程或者學習其實是按照類實例來完成的學習類的繼承封裝多態封裝把實現一個功能的代碼封裝到一個函數中一個類中以后再想實現這個功能，只需要執行這個函數方法即可，不需要再重復的編寫代碼。關于js中面向對象的理解面向對象編程(oop) 它是一種編程思想 (object-oriented programming ), 我們的編程或者學習其...

roadtogeek 2019-08-23 15:41 評論0 收藏0
javascript基礎篇：關于js面向對象的理解

摘要：關于中面向對象的理解面向對象編程它是一種編程思想我們的編程或者學習其實是按照類實例來完成的學習類的繼承封裝多態封裝把實現一個功能的代碼封裝到一個函數中一個類中以后再想實現這個功能，只需要執行這個函數方法即可，不需要再重復的編寫代碼。關于js中面向對象的理解面向對象編程(oop) 它是一種編程思想 (object-oriented programming ), 我們的編程或者學習其...

newtrek 2019-08-02 14:25 評論0 收藏0
關于javascript的原型和原型鏈，看我就夠了（二）

摘要：原文鏈接關于的原型和原型鏈，看我就夠了一參考鏈接闖關記之原型及原型鏈之原型與原型鏈一篇文章帶你理解原型和原型鏈徹底理解原型鏈一的默認指向圖解和的三角關系原型和原型鏈三張圖搞懂的原型對象與原型鏈溫故創建對象的三種方式通過對象直接量通過new創建對象通過Object.create() js中對象分為兩種函數對象普通對象仔細觀察如下代碼 function Foo(na...

eccozhou 2019-08-23 12:44 評論0 收藏0
JavaScript專題之模擬實現new

摘要：模擬實現操作符構造函數返回結果創建一個空對象取傳入的第一個參數，即構造函數，并刪除第一個參數。二處理返回值構造函數也是函數，有不同類型返回值。有時候構造函數會返回指定的對象內容，所以要對這部分進行處理。本文共 1230 字，讀完只需 5 分鐘寫在前面最近工作太忙，快接近兩周沒更新博客，總感覺有一些事情等著自己去做，雖然工作內容對自己提升挺大，但我總覺得，一直埋著頭走路，偶爾也...

pingink 2019-08-23 13:01 評論0 收藏0