麻豆小视频在线观看_中文黄色一级片_久久久成人精品_成片免费观看视频大全_午夜精品久久久久久久99热浪潮_成人一区二区三区四区

首頁 > 編程 > JavaScript > 正文

javascript中的原型鏈深入理解

2019-11-20 21:03:00
字體:
來源:轉載
供稿:網友
要弄清楚原型鏈就要先弄清楚 function 類型,在javascript中沒有類的概念,都是函數,所以它是一門函數式的編程語言。類有一個很重要的特性,就是它可以根據它的構造函數來創建以它為模板的對象。在javascript中,函數就有2個功能

第一、 作為一般函數調用
第二、 作為它原型對象的構造函數 也就new()

我們來看一個例子
復制代碼 代碼如下:

function a(){
this.name = 'a';
}

當創建一個函數,它會發生什么呢?

第一、它會創建1個函數對象 也就是a 本身

第二、它會創建1個原型對象@a(用@來表示)

第三、函數對象會有一個prototype指針,它指向了對應的原型對象,這里就指向了@a

第四、@a對象中有一個construtor指針,指向它的構造函數,這里就指向了a

http://img.blog.csdn.net/20140222125611500?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvbGpsMTU3MDEx/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast

這個prototype屬性究竟有什么用呢?

其實prototype 屬性表示當前函數能夠控制的范圍(或者說它指明了當前函數是誰的構造函數),這里a就是@a原型對象的構造函數,所以我們會看見有這種寫法

復制代碼 代碼如下:

function a(){
this.name = 'a';
}

var a1 = new a();


這就和其他常見語言相似了,new 就是調用原型對象(通過prototype指針)里面構造函數(constructor)創建一個新的對象實例。

那么修改了prototype指向對象里面的屬性,也就影響了所有以它為模板創建的實例,我們可以這樣來驗證

復制代碼 代碼如下:

function a(){
this.name = 'a';
}

var a1 = new a();
a.prototype.age = 1;
alert(a1.age);

結果:1

那為什么a1對象可以直接訪問到age屬性呢?a1對象里面我并沒有定義age屬性啊,

那是因為所有實例里面都會有一個引用_proto_(在firfox,chrome下可以直接訪問,ie不支持)指向了這個原型,這里就是指向了@a,
復制代碼 代碼如下:

function a(){
this.name = 'a';
}

var a1 = new a();
alert(a1._proto_ == a.prototype)

結果:true

在訪問屬性的時候,會先在a1對象內部中尋找,如果沒有,就會順著_proto_指向的對象里面去尋找,這里會到@a中尋找,找到就返回值,沒有找到就返回undefined,用個成語來形容,就是順藤摸瓜嘛!

至此原型鏈的含義就出來了,由于原型對象也有一個_proto_指針,又指向了另一個原型,一個接一個,就形成了原型鏈。Object.prototype是最頂層的原型,所以如果修改了Object.prototype的屬性,那么就影響了所有的對象。

在來看一段代碼
復制代碼 代碼如下:

function a(){
this.name = 'a';
}

function b(){
this.age = 1;
}

b.prototype = new a();
alert(new b().name);

我們顯示的將b的原型指向了a的一個實例,然后,b的實例也可以訪問a的屬性了。這就是javascript的繼承了,那為什么b.prototype 指向的是a的一個實例,而不是直接指向a.prototype 呢?
復制代碼 代碼如下:

b.prototype = new a.prototype;

如果像上面這么寫,修改p.prototype中的屬性,那么a的原型也會改變了,相當于是子類修改了父類,并且子類和父類的屬性糅合在了一起,這顯然是不合適的。換句話說,b也成為了@a的構造函數,a,b成了平級的關系。

我們可以下一個定義:

函數a 繼承函數b 也就是讓函數a成為函數b原型的一個實例的構造函數,構造函數里面聲明的屬性是函數a自己的,原型實例里面的屬性就是繼承b的
復制代碼 代碼如下:

var $ = jQuery = function(selector,context){
//不可能在自己的構造函數中又一次構造自己,所以返回了另外一個構造函數的實例
return new init(selector,context);
}
jQuery.fn = jQuery.prototype = {
size:function(){
return this.length;
}
}

function init (selector,context){

}
init.prototype = jQuery.fn;;
}

這是jquery的一段源碼,我們在使用jquery的時候,并沒有使用new關鍵字,那它是如何構造對象的呢?

用上面的知識,可以解釋,jquery這里只是一個一般函數的調用,它返回了jquery原型的另外一個構造函數創建的對象,也就是new init()
發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 亚洲乱码精品久久久久 | 亚洲一区二区三区在线免费观看 | 久久96国产精品久久秘臀 | 国产porn在线 | 国产一区二区三区四区五区在线 | 亚洲乱搞| 中文字幕在线网 | 97中文字幕在线观看 | 久久草在线视频国产 | 狠狠干最新网址 | 天天碰天天操 | 亚洲第一黄色网 | 久久久久国产成人精品亚洲午夜 | 国产91丝袜在线播放 | 国产精品成人一区二区三区电影毛片 | 久久久久久久久久网站 | 欧美a v在线 | 成人在线观看地址 | 国产黄网 | 电影一级毛片 | 泰剧19禁啪啪无遮挡大尺度 | 国产 一区| 中文字幕在线免费观看电影 | 成人毛片100部免费观看 | 久久久久一本一区二区青青蜜月 | 麻豆国产一区 | 国产日产精品一区四区介绍 | 久久久经典视频 | 国产成人精品网站 | 国产精品久久久久久久久久大牛 | 99re热精品视频| 日本羞羞的午夜电视剧 | 久久久三级免费电影 | 依人在线视频 | 欧美成人精品一区 | 国产91精品亚洲精品日韩已满 | 亚洲一区二区国产 | 欧洲成人一区二区 | 欧美高清另类自拍视频在线看 | 日本黄色一级视频 | 羞羞网站视频 |