溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶(hù)服務(wù)條款》

JavaScript中構(gòu)造函數(shù)與原型鏈之間的關(guān)系詳解

發(fā)布時(shí)間:2020-10-03 20:47:43 來(lái)源:腳本之家 閱讀:141 作者:laozhang 欄目:web開(kāi)發(fā)

在Javascript中不存在class的概念,它的class概念是通過(guò)構(gòu)造函數(shù)(constructor)與原型鏈(prototype)來(lái)實(shí)現(xiàn)。

1.構(gòu)造函數(shù)(constructor):創(chuàng)建對(duì)象時(shí)的初始化對(duì)象,總是與new 關(guān)鍵是一同出現(xiàn)。

構(gòu)造函數(shù)存在以下特點(diǎn):

  • 1、構(gòu)造函數(shù)內(nèi)的this 指向當(dāng)前實(shí)例對(duì)象。
  • 2、使用new 關(guān)鍵字實(shí)例化當(dāng)前對(duì)象。
  • 3、構(gòu)造函數(shù)首字母大寫(xiě),區(qū)分普通函數(shù)。
  • 4、實(shí)例對(duì)象都可以繼承構(gòu)造函數(shù)中的屬性和方法。但是,同一個(gè)對(duì)象實(shí)例之間,無(wú)法共享屬性。

2.原型(prototype):是一個(gè)對(duì)象,實(shí)現(xiàn)對(duì)象的屬性繼承。javascript 中的對(duì)象通過(guò) proto 來(lái)指向原型對(duì)象,可以通過(guò)Object.__proto__ 來(lái)訪(fǎng)問(wèn)

3.構(gòu)造函數(shù)與與原型的聯(lián)系:

 <script>
  function Demo(){
       
   }
   var demo = new Demo()
   var data= demo.prototype = function(){
 
   }
   
   console.log(demo.__proto__)
   console.log(data.constructor )
   console.log(data.prototype.__proto__)
   console.log(demo.constructor.prototype)
   console.log(demo.constructor)
  輸出:
  {constructor: ƒ}constructor: ƒ Demo()__proto__: Object
  ƒ Function() { [native code] }
  {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}
  {constructor: ƒ}
  ƒ Demo(){  }
</script>

從以上輸出結(jié)果可以看出:

構(gòu)造函數(shù)的 __proto__ 指向原型對(duì)象;
原型的constructor 指向構(gòu)造函數(shù)Function;
原型的 prototype.__proto__ 等于 Object.__proto__;
實(shí)例 的 constructor.prototype 指向原型;
實(shí)例的constructor 指向構(gòu)造函數(shù)

引用圖例:

![1460000018155881][1]

向AI問(wèn)一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀(guān)點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI