學(xué)習(xí)js的朋友們都知道,面向?qū)ο笫亲铍y理解的一個部分,下面給大家分享一下對象object的理解,本篇文章主要分享面對對象的封裝。
var dog2 = Dog("秋田犬",'白色'); 這種方法可以解決生成多個實(shí)例化對象代碼復(fù)雜的問題,但是dog1和dog2之間沒有產(chǎn)生關(guān)聯(lián),也就是依然沒有體現(xiàn)出他們其實(shí)是原型對象Dog的實(shí)例。 三,構(gòu)造函數(shù) 為了解決讓實(shí)例化對象需要從原型對象生成的問題,js提供了構(gòu)造函數(shù)這樣一個概念。當(dāng)然其實(shí)構(gòu)造函數(shù)本質(zhì)上也就是一個普通函數(shù),只不過函數(shù)內(nèi)部使用了this,為了區(qū)分于普通函數(shù),我們一般對構(gòu)造函數(shù)首字母大寫,具體代碼如下: function Dog(type,color) { this.type = type ; this.color = color ; } 有了這個構(gòu)造函數(shù),我們就可以生成實(shí)例化對象了,具體代碼如下: var dog1 = new Dog("中華田園犬",'灰色'); var dog2 = new Dog("秋田犬",'白色'); 這里我們可以看到關(guān)鍵字new , 也就是實(shí)際上Dog是一個對象,dog1和dog2是Dog這個對象的實(shí)例化對象;為了驗(yàn)證這一點(diǎn),js提供了一個屬性constructor,此屬性用于指向他們的構(gòu)造函數(shù) console.log(dog1.constructor == Dog) // true console.log(dog2.constructor == Dog) // true 當(dāng)然,js還有另一個運(yùn)算符 instanceof,可以驗(yàn)證原型對象與實(shí)例化對象之間的關(guān)系。 console.log(dog1 instanceof Dog) // true console.log(dog2 instanceof Dog) // true 到構(gòu)造函數(shù)這里看似已經(jīng)很完美了,但是,這里存在一個很大的弊端,也就是內(nèi)存浪費(fèi)。舉例來說,我們現(xiàn)在給Dog對象添加一個不變的屬性和方法如下: function Dog(type,color) { this.type = type ; this.color = color ; this.age = 2 ; this.eat = function(){ console.log('狗吃骨頭') } } 當(dāng)然這里生成實(shí)例化方法也還是一樣的,但是這里會有一個很大的問題:也就是我們會發(fā)現(xiàn)age屬性和eat()方法明明是一模一樣的內(nèi)容,但是由于每次生成實(shí)例化對象時,都會生成同樣的內(nèi)容,多造成內(nèi)存浪費(fèi)。 console.log(dog1.eat == dog2.eat); // false 如果能讓age和eat()在內(nèi)存中只生成一次,讓實(shí)例化對象指向同一個內(nèi)存地址就更完美了。 四,prototype模式 js為每一個構(gòu)造函數(shù)都提供了一個prototype屬性,讓他指向另一個對象,而這個對象的所有屬性和方法都會被構(gòu)造函數(shù)的實(shí)例對象繼承。這也就意味著,只要我們把那些不變的屬性和方法定義在prototype對象上即可。 function Dog(type,color) { this.type = type ; this.color = color ; } Dog.prototype.age = 2 ; Dog.prototype.eat = function(){ console.log('狗吃骨頭') } 接著再生成實(shí)例,此時,所有實(shí)例的age個eat()方法都會指向同一個內(nèi)存地址,也就是prototype對象,這樣也就避免了內(nèi)存浪費(fèi)問題,從而提供運(yùn)行效率。 console.log(dog1.eat == dog2.eat); // true 當(dāng)然為了驗(yàn)證這一問題,js定義了一些輔助屬性。 1. isPrototypeOf() , 此方法用于驗(yàn)證prototype對象和實(shí)例化對象之間的關(guān)聯(lián) console.log(Dog.prototype.isPrototypeOf(dog1)); // true console.log(Dog.prototype.isPrototypeOf(dog2)); // true 2. HasOwnProperty() , 每個實(shí)例化對象都有此方法,顧名思義,這個方法是用于驗(yàn)證屬性是自有的還是繼承自prototype對象的 ; 這里很顯然type是自有屬性,而age是繼承自prototype對象。 console.log(dog1.hasOwnProperty('type')) // true console.log(dog1.hasOwnProperty('age')) // false 更多關(guān)于“前端培訓(xùn)”的問題,歡迎咨詢千鋒教育在線名師。千鋒教育多年辦學(xué),課程大綱緊跟企業(yè)需求,更科學(xué)更嚴(yán)謹(jǐn),每年培養(yǎng)泛IT人才近2萬人。不論你是零基礎(chǔ)還是想提升,都可以找到適合的班型,千鋒教育隨時歡迎你來試聽。