首頁(yè)技術(shù)文章正文

javascript創(chuàng)建對(duì)象的幾種方式介紹?

更新時(shí)間:2021-05-21 來(lái)源:黑馬程序員 瀏覽量:

Javascript創(chuàng)建對(duì)象的方式有哪些?下面介紹javascript中最常用的創(chuàng)建對(duì)象的六種方式。

1、簡(jiǎn)單對(duì)象的創(chuàng)建使用對(duì)象字面量的方式{}創(chuàng)建一個(gè)對(duì)象(最簡(jiǎn)單,好理解,推薦使用)

代碼如下

var Cat = {};	//JSON
Cat.name="kity";	//添加屬性并賦值
Cat.age=2;
Cat.sayHello=function(){
	alert("hello "+Cat.name+",今年"+Cat["age"]+"歲了");	//可以使用“.”的方式訪問(wèn)屬性,也可以使用 HashMap 的方式訪問(wèn)
}
Cat.sayHello();	//調(diào)用對(duì)象的(方法)函數(shù)

2、用 function(函數(shù))來(lái)模擬 class

2.1)創(chuàng)建一個(gè)對(duì)象,相當(dāng)于 new 一個(gè)類的實(shí)例(無(wú)參構(gòu)造函數(shù))

代碼如下

function Person(){
}
var personOne=new Person();	//定義一個(gè) function,如果有 new 關(guān)鍵字去"實(shí)例化",那么該 function 可以看作是一個(gè)類
personOne.name="dylan";
personOne.hobby="coding";
personOne.work=function(){
	alert(personOne.name+" is coding now...");
}
personOne.work();

2.2)可以使用有參構(gòu)造函數(shù)來(lái)實(shí)現(xiàn),這樣定義更方便,擴(kuò)展性更強(qiáng)(推薦使用)

代碼如下

function Pet(name,age,hobby){
	this.name=name;	//this 作用域:當(dāng)前對(duì)象
	this.age=age;
	this.hobby=hobby;
	this.eat=function(){
	alert("我叫"+this.name+",我喜歡"+this.hobby+",也是個(gè)吃貨");
	}
}
var maidou =new Pet("麥兜",5,"睡覺");	//實(shí)例化/創(chuàng)建對(duì)象
maidou.eat();	//調(diào)用 eat 方法(函數(shù))

3、使用工廠方式來(lái)創(chuàng)建(Object關(guān)鍵字)

代碼如下:

var wcDog =new Object();
wcDog.name="旺財(cái)";
wcDog.age=3;
wcDog.work=function(){
	alert("我是"+wcDog.name+",汪汪汪......");
}
wcDog.work();

4、使用原型對(duì)象的方式prototype關(guān)鍵字

代碼如下:

function Dog(){
}
Dog.prototype.name="旺財(cái)";
Dog.prototype.eat=function(){
	alert(this.name+"是個(gè)吃貨");
}
var wangcai =new Dog();
wangcai.eat();

5、混合模式(原型和構(gòu)造函數(shù))

代碼如下:

function Car(name,price){
	this.name=name;
	this.price=price;
}
Car.prototype.sell=function(){
	alert("我是"+this.name+",我現(xiàn)在賣"+this.price+"萬(wàn)元");
}
var camry =new Car("凱美瑞",27);
camry.sell();

6、動(dòng)態(tài)原型的方式(可以看作是混合模式的一種特例)

代碼如下:

function Car(name,price){
	this.name=name;
	this.price=price;
	if(typeof Car.sell=="undefined"){
		Car.prototype.sell=function(){
			alert("我是"+this.name+",我現(xiàn)在賣"+this.price+"萬(wàn)元");
		}
		Car.sell=true;
	}
}
var camry =new Car("凱美瑞",27);
camry.sell();

以上幾種,是 javascript 中最常用的創(chuàng)建對(duì)象的方式

1577370495235_學(xué)IT就到黑馬程序員.gif



猜你喜歡:

JavaScript數(shù)據(jù)類型:javascript數(shù)據(jù)類型有哪些?

Javascript能用來(lái)做什么?Javascript是怎么發(fā)展來(lái)的

Javascript中的預(yù)解析是怎么實(shí)現(xiàn)的?

黑馬程序員HTML&JS+前端培訓(xùn)課程

分享到:
在線咨詢 我要報(bào)名
和我們?cè)诰€交談!