js 遍歷對象的三種方法

最近更新時間 2020-11-20 11:44:38

第一種:使用 for...in 語句遍歷對象

下面的函數接受一個對象作為參數。被調用時迭代傳入對象的所有可枚舉屬性然後返回一個所有屬性名和其對應值的字符串。

const obj = {a:1, b:2, c:3};
for (const prop in obj) {
  console.log("obj." + prop + " = " + obj[prop]);
}
"obj.a = 1"
"obj.b = 2"
"obj.c = 3"

第二種:使用 Object.keys() 語句獲取屬性數組

Object.keys() 方法會返回一個由一個給定對象的自身可枚舉屬性組成的數組,數組中屬性名的排列順序和正常循環遍歷該對象時返回的順序一致 。

Object.values()方法返回一個給定對象自身的所有可枚舉屬性值的數組,值的順序與使用for...in循環的順序相同 ( 區別在於 for-in 循環枚舉原型鏈中的屬性 )。

const obj = {
  a: 'somestring',
  b: 42,
  c: false
};
console.log(Object.keys(obj));
console.log(Object.values(obj));

第二種:使用 Object.getOwnPropertyNames() 獲取屬性數組

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

// 類數組對象
const obj = { 0: "a", 1: "b", 2: "c"};
console.log(Object.getOwnPropertyNames(obj).sort());

// 使用Array.forEach輸出屬性名和屬性值
Object.getOwnPropertyNames(obj).forEach(function(val, idx, array) {
  console.log(val + " -> " + obj[val]);
});
["0", "1", "2"]
          
0 -> a
1 -> b
2 -> c
rss_feed