# JavaScript 物件

2022-09-03 09:01:05

JavaScript 物件

物件

在JavaScript中,物件是一組無序的相關屬性方法的集合,所有的事物都是物件,例如字串、數值、陣列、函數等。
物件是由屬性方法組成的。

  • 屬性:事物的特徵,在物件中用屬性來表示(常用名詞)
  • 方法:事物的行為,在物件中用方法來表示(常用動詞)

儲存一個值時,可以使用變數,儲存多個值(一組值)時,可以使用陣列,儲存一個人的完整資訊時可使用物件。

建立物件(object)的三種方式

1.利用字面量建立物件
物件字面量就是花括號{ }裡面包含了表達這個具體事物(物件)的屬性和方法。

  • 鍵:相當於屬性名
  • 值:相當於屬性值,可以是任意型別的值(數位型別、字元型別、布林型別、函數型別)

物件的呼叫

  • 物件裡面的屬性呼叫:物件名.屬性名 ,這個小點,可理解為「的」
  • 物件裡面屬性的另一種呼叫方式:物件名['屬性名'],注意方括號裡面的屬性必須加引號
  • 物件裡面的方法呼叫:物件名.方法名(),注意方法名字後面一定加括號
//1.利用字面量建立物件{ }
//var obj = { };建立了一個空的物件
var obj = {          
    // { }裡面的屬性或者方法採取鍵值對的形式 鍵(屬性名):值(屬性值)
	name: '張三',
	age: '18',     // 多個屬性或者方法之間用逗號隔開
	sex: '男',
	sayHi: function(){ // 方法後面跟的是一個匿名函數
		console.log('hi~');
	}
}
//使用物件
// 呼叫物件的屬性
console.log(obj.name); // 第一種方法  物件名.屬性名
console.log(obj['age']); // 第二種方法  物件名['屬性名']
obj.sayHi(); // 第三種方法  呼叫物件的方法 sayHi 物件名.方法名() 需要新增小括號

2.利用new Object 建立物件

//利用new Object 建立物件
var obj = new Object(); // 建立了一個空物件
obj.name = '張三';
obj.age = 18;    // 利用等號 = 賦值的方法,新增物件的屬性和方法
obj.sex = '男';	// 每個屬性和方法之間用 分號 結束
obj.sayHi = function(){
	console.log('hi~');
}
console.log(obj.name);
console.log(obj['sex']);
obj.sayHi();

3.利用建構函式建立物件
因為前面兩種建立物件的方式一次只能建立一個物件,一次建立一個物件,裡面有很多的屬性和方法是大量相同的,因此可以利用函數的方法,重複這些相同程式碼,我們將這個函數稱為 ——建構函式 ,這個函數裡面封裝的不是普通的程式碼,而是物件。

建構函式就是把物件裡面一些相同的屬性和方法抽象出來封裝到函數裡面。

//語法格式
//function 建構函式名(){
//	this.屬性 = 值;
//	this.方法 = function() { }
//}
//new 建構函式名();

// 建構函式 明星 泛指的某一大類 類似於java語言中的 類(class)
function Star(uname, age, sex){  // 建構函式首字母要大寫
	this.name = uname;
	this.age = age;
	this.sex = sex;
	this.sing = function(sang) { // 屬性和方法前面必須新增 this
		consloe.log(sang);
	}
}

// 呼叫建構函式必須使用 new
// 物件 特指是一個具體的事物 劉德華 == {name: "劉德華", age:18, sex:"男", sing:f}
var ldh = new Star('劉德華',18,'男'); // 呼叫函數返回的是一個物件
console.log(ldh.name);
console.log(ldh['sex']);
ldh.sing('忘情水');

var zxy = new Star('張學友',28,'男');
console.log(zxy.name);
console.log(zxy.age);
zxy.sing('吻別');

物件的範例化利用建構函式建立物件的過程

new關鍵字

new在執行時會做的四件事情:
1.new的出現,會讓建構函式在記憶體中建立一個新的空物件
2.this就是指向這個新的物件
3.執行建構函式裡面的程式碼,給空物件新增屬性和方法
4.返回這個新物件(所以建構函式裡面不需要return)

遍歷物件屬性(for in)

//遍歷物件
var obj ={
	name: '劉德華',
	age: 18',
	aex: '男',
}
for(var k in obj){ // for in 裡面的變數通常寫 k 或者 key
	conlose.log(k); // k 變數 輸出 得到的是 屬性名(name age sex)
	conlose.log(obj[k]); // obj[k]得到的是屬性值(劉德華 18 男)
}