一共有七種建立的方式,這裡對常見的五種方式進行舉例說明,其中有兩種方式使用頻繁,請務必掌握:
1.直接建立物件法
建立語法如下:
var 对象变量名 = new Object(); 对象变量名. property1 = value1; …; 对象变量名. propertyN = valueN; 对象变量名. methodName1 = function([参数列表]){ //函数体} …; 对象变量名. methodNameN = function([参数列表]){ //函数体}
先建立一個對象,在對其中的屬性和函數功能進行定義和設定值
參考範例及呼叫見下:
var student =new Object();student.name="小李";student.age=21;student.dohomework=function(){ console.log(this.name+"正在做作业");} console.log(student.name);student.dohomework();
2.物件初始化器方式
建立語法如下:
var 对象变量名 = { property1 : value1, property2 : value2, …, propertyN : valueN, methodName1 : function([parameter_list]){ //函数体 }, …, methodNameN : function([parameter_list]){ //函数体 } }
直接在大括號內對該物件的屬性進行賦值與函數功能定義
參考範例及呼叫見下:
var teacher = { name:"Mr Li", age:21, teach:function(){ console.log(this.name+"正在授课ing"); } } teacher.teach();
註:不同屬性值直接用逗號分隔,最後一個值後面通常不加標點符號
3.建構函式方式
建立語法如下:
function 构造函数([参数列表]){ this.属性 = 属性值; … this.属性N = 属性值N; this.函数1 = method1; … this.函数N = methodN; }function method1([参数列表]){ //函数体} …function methodN([参数列表]){ //函数体}
或
function 构造函数([参数列表]){ this.属性 = 属性值; … this.属性N = 属性值N; this.函数1 = function([参数列表]){ //函数体 } ; … this.函数N = function([参数列表]){ //函数体 } ; }
註:某些值可設定預設值,某些值可依需求在參數清單中給出,直接賦值
小結:
1.和上面兩種方式對比,採用建構函數方式創建對象能夠有效的節省代碼;
2、採用建構函數方式創建對象,則this不能省略,這是也普通函數的區別;
3 、採用建構函式方式建立對象,左邊的方式較可取,提高了程式碼的複用;
參考範例及呼叫見下:
function Student(name){ this.name=name; this.age=21; this.play=function(){ console.log(this.name+"正在玩"); } }var student=new Student("仔仔"); student.play();
4.prototype原型方式
建立語法如下:
function 对象构造器( ){} 对象构造器.prototype.属性名=属性值; 对象构造器.prototype.函数名 = function([参数列表]){ //函数体}
在宣告一個新的函數後,函數(在JavaScript中,函數也是物件)就會擁有一個prototype的屬性,透過這個屬性可以為物件新增新的屬性和方法。
參考範例及呼叫見下:
function Student(){} Student.prototype.name="仔仔"; Student.prototype.age=21; Student.prototype.dohomework=function(){ console.log(this.name+"正在做作业"); }var student=new Student(); student.dohomework();
5.混合的建構子/原型方式
建立語法如下:
function 对象构造器([参数列表]){} 对象构造器.prototype.函数名 = function([参数列表]){ //函数体}
建構函式方式便於動態為屬性賦值,但是這種方式將方法也定義在了建構方法體中,使得程式碼比較雜亂;而原型方式不便於為屬性動態賦值,但是這種方式定義的屬性和方法實作了分離;所以取長補短-建構函式定義屬性,原型方式定義方法。
參考範例及呼叫見下:
function Student(name){ this.name=name; this.age=21; } Student.prototype.dohomework=function(){ console.log(this.name+"正在做作业"); }var student=new Student("仔仔"); student.dohomework();
還有兩種方式,動態原型方式和工廠模式不常見,在此不作講解,謝謝收看我的作品!
以上是詳解Javascript創建物件的五種常見方式的詳細內容。更多資訊請關注PHP中文網其他相關文章!