js如何遍歷對象的屬性?


1、遍歷自身可枚舉的屬性 (可枚舉,非繼承屬性)

Object.keys() 方法
該方法會返回一個由一個給定對象的自身可枚舉屬性組成的數組,數組中的屬性名的排列順序和使用 for..in 遍歷該對象時返回的順序一致(兩者的區別是 for ..in 還會枚舉其原型鏈上的屬性 )

/**Array 對象**/
let arr = ['a','b','c'];
console.log(Object.keys(arr)); // ['0','1','2']
/**Object 對象**/
let obj = {foo:'bar',baz:42};
console.log(Object.keys(obj)); // ["foo","baz"]
/**類數組 對象 隨機 key 排序**/
let anObj ={100:'a',2:'b',7:'c'};
console.log(Object.keys); //['2','7','100']
/**getFoo 是一個不可枚舉的屬性**/
let my_obj = Object.create(
	{},
	{ getFoo : { value : function () { return this.foo } } }
);
my_obj.foo = 1;
console.log(Object.keys(my_obj)); // ['foo']

2、遍歷自身的所有屬性(可枚舉,不可枚舉,非繼承屬性)

Object.getOwnPropertyNames()方法
該方法返回一個由指定對象的所有自身屬性組成的數組(包括不可枚舉屬性但不包括Symbol 值作為名稱的屬性)

let arr = ["a", "b", "c"];
console.log(Object.getOwnPropertyNames(arr).sort()); // ["0", "1", "2", "length"]
// 類數組對象
let obj = { 0: "a", 1: "b", 2: "c"};
console.log(Object.getOwnPropertyNames(obj).sort()); // ["0", "1", "2"]
// 使用 Array.forEach 輸出屬性名和屬性值
Object.getOwnPropertyNames(obj).forEach(function(val, idx, array) { console.log(val + " -> " + obj[val]);
});
// 輸出
// 0 -> a
// 1 -> b
// 2 -> c
//不可枚舉屬性
let my_obj = Object.create({}, {
	getFoo: { value: function() { return this.foo; },
	enumerable: false 
	}
});
my_obj.foo = 1;
console.log(Object.getOwnPropertyNames(my_obj).sort()); // ["foo", "getFoo"]

3、遍歷可枚舉的自身屬性和繼承屬性 (可枚舉,可繼承的屬性)

for in遍歷對象的屬性

let obj={ name:'張三',
	age : '24',
	getAge:function(){
		console.log(this.age);
	}
}
let arry ={};
for(var i in obj){
	if(obj.hasOwnProperty(i)&& typeOf obj[i] != 'function'){
		arry[i] = obj[i];
	}
}
console.log(arry);

4、遍歷所有的自身屬性和繼承屬性

(function () {
	let getAllPropertyNames = function (obj) {
		let props = [];
		do {
			props = props.concat(Object.getOwnPropertyNames(obj));
		}
		while (obj = Object.getPrototypeOf(obj));
		return props;
	}
	let propertys = getAllPropertyNames(window);
	alert(propertys.length);
	alert(propertys.join("\n"));
})()


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM