面向?qū)ο?OOP)的語言都有一個(gè)特點(diǎn),它們都會(huì)有類的這一概念,通過類可以抽象出創(chuàng)建具體相同方法與屬性的對(duì)象。但是ECMAScript中是沒有類的概念的,因此它的對(duì)象與基于類的語言如java的定義是有所不同的。
在JavaScript世界中函數(shù)作為“一等公民”,它不僅擁有一切傳統(tǒng)函數(shù)的使用方式(聲明和調(diào)用),而且可以做到像簡(jiǎn)單值一樣賦值、傳參、返回,這樣的函數(shù)也稱之為第一級(jí)函數(shù)。不僅如此,而且還可以通過操作符new來充當(dāng)類的構(gòu)造器。
函數(shù)在充當(dāng)類的構(gòu)造器時(shí),原型prototype是一個(gè)重要的概念。prototype是構(gòu)造函數(shù)的一個(gè)屬性, 該屬性指向一個(gè)對(duì)象。而這個(gè)對(duì)象將作為該構(gòu)造函數(shù)所創(chuàng)建的所有實(shí)例的基引用(base reference), 可以把對(duì)象的基引用想像成一個(gè)自動(dòng)創(chuàng)建的隱藏屬性。 當(dāng)訪問對(duì)象的一個(gè)屬性時(shí), 首先查找對(duì)象本身, 找到則返回;若不, 則查找基引用指向的對(duì)象的屬性(如果還找不到實(shí)際上還會(huì)沿著原型鏈向上查找, 直至到根)。 只要沒有被覆蓋的話, 對(duì)象原型的屬性就能在所有的實(shí)例中找到。
類一:
function ajQuery() { this.name = 'jQuery'; this.sayName = function(){ return this.name } var a = new ajQuery() var b = new ajQuery() var c = new ajQuery()
類二:
function ajQuery() { this.name = 'jQuery' } ajQuery.prototype = { sayName: function() { return this.name } } var a = new ajQuery() var b = new ajQuery() var c = new ajQuery()
類一與類二產(chǎn)生的結(jié)構(gòu)幾乎是一樣的,而本質(zhì)區(qū)別就是:類二new產(chǎn)生的a、b、c三個(gè)實(shí)例對(duì)象共享了原型的sayName方法,這樣的好處節(jié)省了內(nèi)存空間,類一則是要為每一個(gè)實(shí)例復(fù)制sayName方法,每個(gè)方法屬性都占用一定的內(nèi)存的空間,所以如果把所有屬性方法都聲明在構(gòu)造函數(shù)中,就會(huì)無形的增大很多開銷,這些實(shí)例化的對(duì)象的屬性一模一樣,都是對(duì)this的引用來處理。除此之外類一的所有方法都是拷貝到當(dāng)前實(shí)例對(duì)象上。類二則是要通過scope連接到原型鏈上查找,這樣就無形之中要多一層作用域鏈的查找了。
jQuery對(duì)象的構(gòu)建如果在性能上考慮,所以就必須采用原型式的結(jié)構(gòu):
jQuery = function( selector, context ) { return new jQuery.fn.init( selector, context ); } jQuery.fn = jQuery.prototype = { init:function(){ return this }, jquery: version, constructor: jQuery, ……………… } var a = $() ;
使用原型結(jié)構(gòu),性能上是得到了優(yōu)化,但是ajQuery類這個(gè)結(jié)構(gòu)與目標(biāo)jQuery的結(jié)構(gòu)的還是有很大不一致:
? 沒有采用new操作符;
? return返回的是一個(gè)通過new出來的的對(duì)象 。
附:
請(qǐng)驗(yàn)證,完成請(qǐng)求
由于請(qǐng)求次數(shù)過多,請(qǐng)先驗(yàn)證,完成再次請(qǐng)求
打開微信掃碼自動(dòng)綁定
綁定后可得到
使用 Ctrl+D 可將課程添加到書簽
舉報(bào)