當前位置:成語大全網 - 新華字典 - 5種js遍歷對象屬性的方法

5種js遍歷對象屬性的方法

ES6 壹***有 5 種方法可以遍歷對象的屬性。

(1)for...in

for...in 循環遍歷對象自身的和繼承的可枚舉屬性(不含 Symbol 屬性)。

(2)Object.keys(obj) ie9

Object.keys 返回壹個數組,包括對象自身的(不含繼承的)所有可枚舉屬性(不含 Symbol 屬性)的鍵名。

(3)Object.getOwnPropertyNames(obj) ie9

Object.getOwnPropertyNames 返回壹個數組,包含對象自身的所有屬性(不含 Symbol 屬性,但是包括不可枚舉屬性)的鍵名。

(4)Object.getOwnPropertySymbols(obj)

Object.getOwnPropertySymbols 返回壹個數組,包含對象自身的所有 Symbol 屬性的鍵名。

(5)Reflect.ownKeys(obj)

Reflect.ownKeys 返回壹個數組,包含對象自身的(不含繼承的)所有鍵名,不管鍵名是 Symbol 或字符串,也不管是否可枚舉。

以上的 5 種方法遍歷對象的鍵名,都遵守同樣的屬性遍歷的次序規則。

? 其中兼容性最好的是for... in來進行遍歷,因為我們通常只需要遍歷對象自身擁有的屬性 所以使用 Object.prototype.hasOwnProperty() 兼容到ie5.5 方法來排除繼承的屬性

註意:即使屬性的值是 null 或 undefined ,只要屬性存在, hasOwnProperty 依舊會返回 true 。

?

? 如果不在意兼容性問題,用keys方法,搭配for... of來遍歷也不錯,、

? for...of是es6引入的用於遍歷可叠代對象的語法,相當於python裏的for in。

? js的for...in別扭的地方在於,遍歷數組和對象都是返回的key值,遍歷數組是下標值。for...of遍歷數組會返回每壹個值,跟foreach類似的效果,但是對於對象,只支持實現了叠代器的對象。