javascript基礎(chǔ)———原型、原型對(duì)象和原型鏈

2019-9-15    seo達(dá)人

原型：函數(shù)中的屬性prototype，她的名字就叫原型?？梢酝ㄟ^也只能通過prototype添加可繼承的屬性和方法

原型對(duì)象：函數(shù)中prototype中的proto 和對(duì)象中的proto

先記住原型（prototype）和原型對(duì)象（proto）

下面用代碼解釋原型、原型對(duì)象、 原型鏈

<!DOCTYPE html>

<html>

   <head>

    <meta charset="utf-8">

    <title>對(duì)象</title>

   </head>

   <body>

    <script type="text/javascript">

       //創(chuàng)建一個(gè)對(duì)象和一個(gè)函數(shù)

       var obj = {}

       console.log(obj.proto)//obj有原型對(duì)象

       function objFun (){}

       console.log(objFun.prototype) //objFun 原型

       console.log(objFun.prototype.proto) //原型中有原型對(duì)象

       console.log('*華麗的分割線***')

       // 以objFun為構(gòu)造函數(shù) (為了把構(gòu)造函數(shù)和普通函數(shù)做區(qū)分，通常把構(gòu)造函數(shù)名首字母大寫)

       // 添加屬性和方法

       objFun.prototype.name='saozhu'

       objFun.prototype.say = function(){

        console.log(this.name+'-騷豬')

       }

       // 創(chuàng)建實(shí)例對(duì)象1

       var obj1=new objFun()

       console.log(obj1)//打印對(duì)象 空對(duì)象

       console.log(obj1.name) //騷豬 證明obj1繼承了objFun函數(shù)的屬性

       console.log('*華麗的分割線***')

       // 此時(shí)此刻 可以理解原型鏈了: 

       console.log(obj1.proto=== objFun.prototype)

       //true 

       // 原型鏈?zhǔn)怯袑?shí)例對(duì)象的proto(原型對(duì)象)指向構(gòu)造函數(shù)函數(shù)的原型（prototype)

       console.log(objFun.prototype.proto==window.Object.prototype)

       // true

       // 然后構(gòu)造函數(shù)的原型的原型對(duì)象(prototype.proto)指向window.Object.protype(對(duì)象的原型)

       console.log(window.Object.prototype.proto===null)

       // 這樣的指向關(guān)系形成的鏈?zhǔn)疥P(guān)系就是原型鏈

       //鏈?zhǔn)讲樵?查詢對(duì)象中的屬性和方法,會(huì)根據(jù)這樣的原型鏈查找,直到找到響應(yīng)的屬性和方法.找到window.Object.prototype.proto還沒有值,就返回undeifne

       

    </script>

   </body>

</html>


分享本文至：

日歷

鏈接

個(gè)人資料

存檔