快捷導(dǎo)航

JavaScript創(chuàng)建對象的寫法

更新時(shí)間：2013年08月29日 00:07:24 作者：

JavaScript 有Date、Array、String等這樣的內(nèi)置對象，功能強(qiáng)大使用簡單，人見人愛，但在處理一些復(fù)雜的邏輯的時(shí)候，內(nèi)置對象就很無力了，往往需要開發(fā)者自定義對象

對象是什么
從JavaScript定義上講對象是無序?qū)傩缘募?，其屬性可以包含基本值、對象或函?shù)。也就是說對象是一組沒有特定順序的屬性，每個(gè)屬性會(huì)映射到一個(gè)值上，是一組鍵值對，值可以是數(shù)據(jù)或?qū)ο蟆?/P>

最簡單的對象
JavaScript的一對花括號{}就可以定義一個(gè)對象，這樣的寫法實(shí)際上和調(diào)用Object的構(gòu)造函數(shù)一樣

復(fù)制代碼代碼如下:

var obj={};
var obj2=new Object();

這樣構(gòu)建出來的對象僅僅包含一個(gè)指向Object的prototype的指針，可以使用一些valueOf、hasQwnProperty等方法，沒有多大實(shí)際作用，自定義對象嘛總要有一些自定義的屬性、方法神馬的。

復(fù)制代碼代碼如下:

var obj={};
            obj.a=0;
            obj.fn=function(){
                alert(this);
            }

            var obj2={
                a:0,
                fn:function(){
                    alert(this);
                }
            }

可以在定義完對象后通過”.”為其添加屬性和方法，也可以使用字面量賦值方法在定義對象的時(shí)候?yàn)槠涮砑訉傩院头椒?，這樣創(chuàng)建的對象，其方法和屬性可以直接使用對象引用，類似于類的靜態(tài)變量和靜態(tài)函數(shù)，這樣創(chuàng)建對象有一個(gè)明顯缺陷——在定義大量對象的時(shí)候很費(fèi)力，要一遍遍的寫幾乎是重復(fù)的代碼。

抽象一下
既然是重復(fù)代碼就可以抽象出來，用函數(shù)來做這些重復(fù)工作，在創(chuàng)建對象的時(shí)候調(diào)用一個(gè)專門創(chuàng)建對象的方法，對于不同的屬性值只需要傳入不同參數(shù)即可。

復(fù)制代碼代碼如下:

function createObj(a,fn){
                var obj={};
                obj.a=a;
                obj.fn=fn;
                return obj;
            }

            var obj=createObj(2,function(){
                alert(this.a);
            });

這樣在創(chuàng)建大量對象的時(shí)候，就可以通過調(diào)用此方法來做一些重復(fù)工作了，這種方式也不完美，因?yàn)樵诤芏鄷r(shí)候需要判斷對象的類型，上面代碼創(chuàng)建出來的對象都是最原始的Object對象實(shí)例，只是拓展了一些屬性和方法。

有型一些

又是function登場的時(shí)候，JavaScript中function就是個(gè)對象，在創(chuàng)建對象的時(shí)候打可以拋開上面createObj方法，直接使用function作為對象，怎么實(shí)現(xiàn)復(fù)用呢，這就在于function作為對象的特殊性了。

１. function可以接受參數(shù)，可以根據(jù)參數(shù)來創(chuàng)建相同類型不同值的對象

２. function作為構(gòu)造函數(shù)（通過new操作符調(diào)用）的時(shí)候會(huì)返回一個(gè)對象，在貧下中農(nóng)版jQuery中提到過一些構(gòu)造函數(shù)的基本知識，簡單復(fù)制一下

構(gòu)造函數(shù)的返回值分為兩種情況，當(dāng)function沒有return語句或者return回一個(gè)基本類型（bool,int,string,undefined,null）的時(shí)候，返回new 創(chuàng)建的一個(gè)匿名對象，該對象即為函數(shù)實(shí)例；如果function體內(nèi)return一個(gè)引用類型對象（Array,Function,Object等）時(shí)，該對象會(huì)覆蓋new創(chuàng)建的匿名對象作為返回值。

３. 那么使用function怎么解決類型識別問題呢，每個(gè)function實(shí)例對象都會(huì)有一個(gè)constructor屬性（也不是“有”，而是可以對應(yīng)），這個(gè)屬性就可以指示其構(gòu)造是誰，也可以使用instanceof 操作符來做判斷對象是否為XXX的實(shí)例。

不能光說不練，上代碼

復(fù)制代碼代碼如下:

function Person(name){
                this.name=name;
                this.fn=function(){
                    alert(this.name);
                }
            }

            var person1=new Person('Byron');

            console.log(person1.constructor==Person);//true
            console.log(person1 instanceof Person); //true

這樣就完美了吧，也不是！雖然構(gòu)造函數(shù)可以是對象有型，但對象的每個(gè)實(shí)例中的方法都要重復(fù)一遍！

復(fù)制代碼代碼如下:

function Person(name){
                this.name=name;
                this.fn=function(){
                    alert(this.name);
                }
            }

            var person1=new Person('Byron');
            var person2=new Person('Frank');

            console.log(person1.fn==person2.fn);//false

看看看，雖然兩個(gè)實(shí)例的fn一模一樣，但是卻不是一回事兒，這如果一個(gè)function對象有一千個(gè)方法，那么它的每個(gè)實(shí)例都要包含這些方法的copy，很讓內(nèi)存無語啊。

不玩兒虛的了

究竟有沒有一種近乎完美的構(gòu)造對象的方式，及不用做重復(fù)工作，又有型，對象通用方法又不必重復(fù)？其實(shí)可以發(fā)現(xiàn)使用function已經(jīng)距離要求和接近了，只差那么一點(diǎn)兒——需要一個(gè)所有function對象的實(shí)例共享的容器，在這個(gè)容器內(nèi)存發(fā)實(shí)例需要共享的屬性和方法，正好這個(gè)容器是現(xiàn)成的——prototype，不了解prototype的同學(xué)可以看看JavaScript prototype

復(fù)制代碼代碼如下:

function Person(name){
                this.name=name;
            }

            Person.prototype.share=[];

            Person.prototype.printName=function(){
                alert(this.name);
            }

            var person1=new Person('Byron');
            var person2=new Person('Frank');

            console.log(person1.printName==person2.printName);//true

這樣每個(gè)Person的實(shí)例都有自己的屬性name，又有所有實(shí)例共享的屬性share和方法printName，基本問題都解決了，對于一般的對象處理就可以始終這個(gè)有型又有愛的創(chuàng)建對象模式了。

您可能感興趣的文章: