0.前言
有一段時間沒寫博客了,上次我們說了一種用字面量方法創建對象病房舒文屬性和方法,這一次和大家分享另外兩種常用方法:
- 工廠模式創建對象(返回對象的函數)并訪問屬性和方法
- 構造函數創建對象并訪問屬性和方法
1.工廠模式創建對象(返回對象的函數)并訪問屬性和方法
代碼如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>工廠模式創建對象(返回對象的函數)并訪問屬性和方法</title>
</head>
<body>
<script type="text/javascript">
//使用工程模式可以快速、大量的創建擁有相同屬性和行為的對象
function createGirlFriend(a){
return {
name: a,
eat: function(){
console.log("吃");
}
};
}
var girl1 = createGirlFriend("二雷");
var girl2 = createGirlFriend("三雷");
console.log(girl1);
console.log(girl2);
console.log(typeof girl1);
//訪問屬性與方法
console.log(girl1.name);
girl1.eat();
//動態增加屬性
girl1.age = 17;
console.log(girl1);
console.log(girl2);
//動態增加方法
girl1.eat = function() {
console.log("eat");
};
//動態刪除
delete girl1.age;
delete girl1.eat;
</script>
</body>
</html>
2.構造函數創建對象并訪問屬性和方法(常用)
構造函數(就是函數,為了做區分,一般我們將構造函數的首字母大寫)
注意:構造函數聲明后不會被執行,僅僅是定義了一個用于這些屬性和方法的"類型",沒有任何對象的實例產生
(1)聲明構造函數
function GirlFriend(name, age, height, weight) {
//屬性
this.name = name;
this.age = age;
this.height = height;
this.weight = weight;
//函數內部普通變量看成是對象的私有屬性(外部無法訪問)
//可以通過中間函數間接訪問
var _money = 10000000;
this.setMoney = function(money) {
_money = money;
};
this.getMoney = function(){
return _money;
};
this.eat = function() {
console.log("吃");
console.log(_money);
};
}
(2)創建對象
公式:var 對象名 = new 構造函數名(參數列表);
擴展:new 構造函數名(參數列表)的講解
1.在堆區開辟出一片空間用來保存對象;
2.將對象中對應的屬性進行賦值;
3.返回對象的引用(棧區)。
var girl1 = new GirlFriend("大雷", 20, 150, 180);
console.log(girl1);
結果:
捕獲.PNG
(3)間接訪問私有屬性
girl1.setMoney(100);
console.log(girl1.getMoney());
girl1.eat();
結果:
捕獲.PNG
(4)多個對象之間相互不影響
var girl2 = new GirlFriend("二雷", 19, 1500, 1800);
console.log(girl2.age);
console.log(girl2.getMoney());
結果:
捕獲.PNG
(5)添加靜態方法
GirlFriend.staticFunc = function() {
console.log("我是靜態函數");
};
//調用靜態函數
GirlFriend.staticFunc();
注意:條用靜態方法,要用構造函數名調用。
//添加屬性
girl1.faceValue = 100;
//添加方法
girl1.run = function() {
console.log("run");
};
girl1.run();
//刪除
delete girl1.faceValue;
delete girl1.run;
3.傳遞對象
??聲明兩個變量,引用同一個對象,那么這兩個變量相同嗎?答案是肯定不相同,這是兩個不同的變量。
var obj1 = {
name:"sunck",
age:18,
height:175,
weight:65,
};
//obj3與obj1引用的是同一個對象,但是這是兩個不同的變量
var obj3 = obj1;
obj1.height = 180;
console.log(obj3.height);
4.傳遞的比較
var obj1 = {
name : "wh",
age : 18,
height : 175,
weight : 65,
};
var obj3 = obj1;
console.log(obj1 == obj3);
console.log(obj1 == obj3);
var obj5 = {
name : "wh",
age : 18,
height : 175,
weight : 65,
};
console.log(obj1 == obj5);
console.log(obj1 == obj5);
結果:
捕獲.PNG
總結:①兩個對象比較僅且當這兩個引用是同一個對象時才真的相等。
②如果兩個引用指向的是不同的對象,但是對象的屬性與行為完全相同的,那么這兩個對象也是不相等的。