javascript定義對象的幾種簡單方法

來源:互聯網
上載者:User

引用

Aaron 的 javascript定義對象寫法(整理)

javascript定義對象的幾種簡單方法

1.建構函式方式,全部屬性及對象的方法都放在構造方法裡面定義

優點:動態傳遞參數

缺點:每建立一個對象就會建立相同的方法函數對象,佔用大量記憶體

function User1(name, password) {
this.name = name;
this.password = password;
this.login = function(name,password){
if(this.name == name && this.password == password) {
return true;
}else {
return false;
}
};
}

2.原型方式,將對象屬性及方法定義都寫在對象的prototype裡面

優點:每次建立對象時都是使用相同prototype中的方法,不會佔用重複的記憶體

缺點:無法動態傳遞構造參數

function User2() {

}
User2.prototype.name = "prototype name";
User2.prototype.password = "prototype password";
User2.prototype.login = function(name,password){
if(this.name == name && this.password == password) {
return true;
} else {
return false;
}
};
原型方式的另一種寫法:
格式:
var 對象名 = {};
    對象名.prototype.變數1=變數1的值;
    對象名.prototype.變數2=變數2的值;
    ……;
    對象名.prototype.函數1= function() {
       函數體
    };
    對象名.prototype.函數2= function() {
       函數體
    };
    ……;
說明:
(1)       初始對象體內可以不定義任何東西;
(2)       在要定義的變數前加“對象名.prototype.”的格式;
(3)       對象的內容與值以等號分隔,成對出現;
(4)       包含的變數或者函數之間以分號分隔,也可以省去分號。
(5)       函數需要寫在function(){}的大括弧之內。
例子:
var data = {};
   data.prototype. name ="Vicky”;
    data.prototype. age =20;
    data.prototype. eat = function() {
       alert(‘I wanna eat meat’);
    };
    data.prototype. sleep= function() {
       alert(‘I wanna sleep’);

};

3.構造及原型混合方式,將屬性定義寫在構造方式裡面,方法寫在prototype裡面

優點:綜合了construct及prototype方式的優點,可以動態傳遞構造參數,並且方法函數對象也只建立一個

缺點:函數寫在對象外面,不太符合物件導向的思想

function User3(name,password) {
this.name = name;
this.password = password;
}
User3.prototype.login = function(name,password) {
if(this.name == name && this.password == password) {
return true;
} else {
return false;
}
};

4.動態原型方式:加一個判斷屬性,來判斷該對象是否已經被建立過,如果被建立過,則方法就不在構建

優點:將原型函數寫在對象定義裡面

缺點:不支援繼承

function User4(name,password) {
this.name = name;
this.password = password;
if(typeof User4.__initialized == "undefined") {
User4.prototype.login = function(name,password){
if(this.name == name && this.password == password) {
return true;
} else {
return false;
}
};
User4.__initialized = true;
}
}

5、JSON方式/對象直接量

格式:
var 對象名 = {
             變數1: 變數1的值,
             變數1: 變數1的值,
             ……,
            函數1: function() {
                函數體
            },
            函數2: function() {
                函數體
            }//Note:最後的逗號要去除為了和IE相容。
};
說明:
(1)       大括弧內直接填寫變數或者函數;
(2)       對象的內容與值以冒號分隔,成對出現;
(3)       包含的變數或者函數之間以逗號分隔;
(4)       函數需要寫在function(){}的大括弧之內。
例子:
var  對象名 = {
       name:    “Vicky”,
       age:     26,
       eat: function() {
              alert(‘I wanna  eat meat’);
       },
       sleep: function() {
              alert(‘I wanna sleep’);
        }
};
注釋:類似的方式也叫做匿名類
匿名類舉例:     

    index: '//', 
    reg: new RegExp('^//.*$'), 
    css: "comment" 
}
上面的方式建立了類,只是沒賦給一個變數而已。

6、create方式

該方式利用了Prototype JavaScript組件庫。
格式:
       var 對象名 = Class.create();
       Object.extend(對象名.prototype, {
            變數1: 變數1的值,
            變數1: 變數1的值,
             ……,
            函數1: function() {
                     函數體
                },
            函數2: function() {
                     函數體
            },
……
});
說明:
(1)       對象的建立使用了Prototype庫中的Class.create()函數;
(2)       對象的內容使用Prototype庫中的Object.extend()函數來擴充;
(3)       被擴充的對象在傳入Object.extend函數時一定要帶上prototype,
(4)       擴充內容被大括弧包含,其內與JSON方式的定義格式完全相同。
例子:
       var data = Class.create();
       Object.extend(dta.prototype, {
       name: "Vicky",
       age: 20,
       eat: function() {
              alert(‘I wanna eat meat’);
       },
       sleep: function() {
              alert(‘I wanna sleep’);
       }
       });

      其實,JS對象的定義還有其它的方式,你也可以用上面幾種進行組合定義,這顯出了JS作為動態語言的自由性。
JS對象的建立正規方法如下:
var d1 = new Data();
       JS物件變數的引用方式有兩種:
(1)       點號方式引用,如,data.name。
(2)       數組方式引用,如,data[‘name’]。

比較簡單的一種方式

var HistoryNew=function(){};

HistoryNew.prototype={

 setHistory:function(cityShort){alert(cityShort);

}

};

var Animal = Class.create();Animal.prototype = {initialize: function(name, sound) {this.name = name;this.sound = sound;},speak: function() {alert(name + " says: " + sound + "!");}};var snake = new Animal("Ringneck", "hissssssssss");snake.speak();// -> 提示:"Ringneck says: hissssssssss!"var Dog = Class.create();Dog.prototype = Object.extend(new Animal(), {initialize: function(name) {this.name = name;this.sound = "woof";}}); var fido = new Dog("Fido");fido.speak();// -> 提示:"Fido says: woof!" 
一個簡單的類

function clsUser(){};
clsUser.prototype={
name:"",
pwd:"",
}
var objUser=new clsUser();
objUser.name="a";
alert(objUser.name);

var objB=new clsUser();
objB.name="b";
alert(objB.name);

<script type="text/javascript">
function MyClass(name){           
    this._name = name;  //在函數體內初始化屬性
}
MyClass.prototype = {      //在prototype上定義屬性和方法
    _name: null,
    showName: function(){
        alert(this._name);
    }
}
var m = new MyClass("fanrong");
m.showName();
</script>

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.