對象簡介

第一部分:

首先,可以用字典創(chuàng)建一個簡單對象,

var cat= {
   name   :  'jack',
   age      :   '5',
   friends :   [ ' one cat ' , ' two cat ' ],
   run       :   function(){ console.log("cat is run") ;},
   eat       :   function(){ console.log(" cat is eat") ;}
}

現(xiàn)在用Json的鍵值對構(gòu)建了一個最簡單的對象。
如果要使用這個對象中的變量和函數(shù),只需要按照json的使用規(guī)則來運(yùn)行就可以了。

console.log(cat.name);
console.log(cat.age );
car.run;
car.eat;

在對象中,我們稱變量為對象的屬性,而函數(shù)稱之為方法。(貓?jiān)诂F(xiàn)實(shí)中是一個動物的種類,而只有在定義了具體的屬性后,才能有一個具體對象,對象的屬性可以有,姓名、年齡、等值,貓可以有跑的方法,吃的方法等。)

類是對象的抽象,我們把擁有四肢,會瞄叫的這種動物抽出他們的共有特征,歸為貓類,
對象是類的實(shí)例,而如果養(yǎng)了一只貓叫jack,這是具體化的一只貓。

第二部分:

我們用json創(chuàng)建了一個對象,但這個對象,不便于封裝和引用,為了方便起見,對json構(gòu)成的對象做基本的改進(jìn),以便我們調(diào)用。既然能后調(diào)用,而又能很好的封裝的,可以是選擇用一個函數(shù);這種方式稱為工廠方式構(gòu)造對象。

 function cat(name,age,friends ){  //構(gòu)造函數(shù)

        var obj = new  Object(); 
        obj.name=  name;
        obj.age  =  age;
        obj.friends= friends;
        obj.run  = function(a){
            console.log(this.name + ' run ' + a);};
        obj.eat = function(b){
            console.log(this.name + ' eat ' + b);};
    return obj;
    }
    ```
我們用函數(shù)構(gòu)造出了一個對象,new是創(chuàng)建對象的關(guān)鍵字。為這個對象新建了屬性和方法。追后用return返回了對象obj。
object()可以用來配合new定義一個空白的對象。然后可以在上面添加屬性和方法。  
需要注意的是,在函數(shù)內(nèi)部構(gòu)建對象的時候,new關(guān)鍵字后面必須要大寫才能夠正確編譯,否則會出現(xiàn)報錯現(xiàn)象。
在引用對象的時候,我們只需要在函數(shù)寫入實(shí)參后,就可以調(diào)用其中的屬性和方法;

var cat_jack = cat('jack', '5',['cat_one','cat_two' ]);
cat_jack.run('round');
cat_jack.eat('milk');

用函數(shù)改進(jìn)后的對象已經(jīng)能夠足夠方便的創(chuàng)建出新的對象來,但是new關(guān)鍵字被寫入了函數(shù)內(nèi)部,我們應(yīng)該將new關(guān)鍵字提取出來,

###第三部分
我們?nèi)∠嗽诤瘮?shù)內(nèi)部用new關(guān)鍵字構(gòu)造出來的對象,然后用this來將原來的obj對象替換一下。然后把返回值取消。就創(chuàng)造出了一個構(gòu)造函數(shù)。
取消return和在函數(shù)內(nèi)部的new對象后,只保留屬性和方法。
>所謂"構(gòu)造函數(shù)",其實(shí)就是一個普通函數(shù),但是內(nèi)部使用了[this變量](http://www.ruanyifeng.com/blog/2010/04/using_this_keyword_in_javascript.html)。對構(gòu)造函數(shù)使用new運(yùn)算符,就能生成實(shí)例,并且this變量會綁定在實(shí)例對象上。
this:可指當(dāng)前的方法屬于誰,在函數(shù)前面有new的情況下失效。 全局函數(shù)是window的方法,但是在前面加new以后 ,會在函數(shù)中自動新創(chuàng)建一個對象,并指向該對象。構(gòu)造函數(shù)和普通函數(shù)區(qū)別在于調(diào)用前加new。

function cat(name,age,friends ){
this.name= name;
this.age = age;
this.friends= friends;
this.run = function(a){
console.log(this.name + ' run ' + a);};
this.eat = function(b){
console.log(this.name + ' eat ' + b);};
}

然后我們用新的對象來調(diào)用這個構(gòu)造函數(shù),既很容易創(chuàng)造出了一個對象。

var cat_jack = new cat('jack', '5',['cat_one','cat_two' ]);
cat_jack.run('round');
cat_jack.eat('milk');


###第四部分
在構(gòu)造函數(shù)中,由于對形參傳遞參數(shù)的不確定和不便于書寫,可以對參數(shù)用json數(shù)組進(jìn)行抽取,

function cat(option ){
this.name= option.name;
this.age = option.age;
this.friends= option.friends;
this.run = function(a){
console.log(this.name + ' run ' + a);};
this.eat = function(b){
console.log(this.name + ' eat ' + b);};
}

 然后新建對象時,將傳遞實(shí)參修改為json格式。

var cat_jack = new Cat({name:'jack', age:'5',friends:['cat_one','cat_two' ]});
cat_jack.run('round');
cat_jack.eat('milk');

###第五部分
重新構(gòu)建出來的對象的確可以正常運(yùn)行,但是任然會存在美中不足的地方,在對象調(diào)用方法的時候,我們創(chuàng)建兩個對象。cat_jack和 cat_maria 。

var cat_jack = new Cat({name:'jack', age:'5',friends:['cat_one','cat_two' ]});
cat_jack.run('round');
cat_jack.eat('milk');
var cat_maria = new Cat({name:'maria', age:'3',friends:['cat_one','cat_two' ]});
cat_maria.run('road');
cat_maria.eat('meet');

測試被調(diào)用的同一個方法后,輸出值為false。原因就在于創(chuàng)建一個函數(shù)的時候同時也創(chuàng)建一個新的對象,每一次使用new,都會創(chuàng)造出一個新的對象。
```    alert(cat_jack.eat == cat_maria.eat);```
這樣并不利于性能的提升,為了改進(jìn)這一點(diǎn),需要引出原型的定義。
prototype:讓我們有能力向?qū)ο筇砑訉傩院头椒?,它的作用就是?gòu)造函數(shù)的一個共享庫;所有數(shù)據(jù)將來都會被所有的新對象公用。  



###第六部分
將構(gòu)造函數(shù)中的方法提取出來,另外單獨(dú)使用原型設(shè)置;

function cat(option ){
this.name= option.name;
this.age = option.age;
this.friends= option.friends;

}

cat.prototype={
run : function(a){ console.log(this.name + ' run ' + a);},
eat : function(b){ console.log(this.name + ' eat ' + b);}
}

var cat_jack = new Cat({name:'jack', age:'5',friends:['cat_one','cat_two' ]});
cat_jack.run('round');
cat_jack.eat('milk');
var cat_maria = new Cat({name:'maria', age:'3',friends:['cat_one','cat_two' ]});
cat_maria.run('road');
cat_maria.eat('meet');

然后用alert(cat_jack.eat == cat_maria.eat)測試,得出的結(jié)果為true。


          
###第七部分

基本原理基本實(shí)現(xiàn)后,還可以對構(gòu)造函數(shù)進(jìn)一步簡化,使用json抽取出參數(shù),然后將屬性和方法,使用json進(jìn)行簡單合并。




function cat(option){
this._init(option);
}
cat.prototype={
_init : function(option)
{
var option=option||{};
this.name= option.name;
this.age = option.age;
this.friends= option.friends },

   run : function(a){ console.log(this.name + ' run ' + a);},
   eat : function(b){ console.log(this.name + ' eat ' + b);}

}
var cat_jack = new Cat({name:'jack', age:'5',friends:['cat_one','cat_two' ]});
cat_jack.run('round');
cat_jack.eat('milk');
var cat_maria = new Cat({name:'maria', age:'3',friends:['cat_one','cat_two' ]});
cat_maria.run('road');
cat_maria.eat('meet');

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 136,564評論 19 139
  • 第5章 引用類型(返回首頁) 本章內(nèi)容 使用對象 創(chuàng)建并操作數(shù)組 理解基本的JavaScript類型 使用基本類型...
    大學(xué)一百閱讀 3,679評論 0 4
  • 有個朋友,叫淺淺,在她身上人如其名才是最大的笑話,每次都愛的那么用力,到最后往往把自己弄得是遍體鱗傷,卻又絲毫沒有...
    薄薄薄薄薄_薄荷閱讀 294評論 0 0
  • 雖然前方道路很遙遠(yuǎn),但我想突破自我,我希望給自己的夢一個選擇。 2016年的秋天,我從一所職業(yè)學(xué)校畢業(yè)出來。 其實(shí)...
    獨(dú)木狼閱讀 354評論 0 2
  • 2016-12-28-067 《管理的覺醒》 正文: 真正支配我們行為的并不是我們的想法,而是我們的感受,是...
    濰坊谷德DDM徐芳閱讀 665評論 0 0

友情鏈接更多精彩內(nèi)容