首頁 >web前端 >js教程 >如何使用「for...in」在 JavaScript 中安全地迭代物件屬性?

如何使用「for...in」在 JavaScript 中安全地迭代物件屬性?

Linda Hamilton
Linda Hamilton原創
2024-12-29 20:37:18185瀏覽

How Can I Safely Iterate Over Object Properties in JavaScript Using `for...in`?

使用for...in 迭代物件屬性

使用for...in 迴圈迭代物件屬性時,循環變數propt 表示正在訪問的屬性的鍵。但是,它不是物件的內建方法或屬性。

for...in 迴圈會擷取物件本身的屬性和從其原型繼承的屬性。這可能會出現問題,因為繼承的屬性可能不打算包含在迭代中。

使用hasOwnProperty 精確迭代

要解決此問題,您可以新增for...in 循環中的hasOwnProperty 檢查:

for (var prop in obj) {
    if (Object.prototype.hasOwnProperty.call(obj, prop)) {
        // Do stuff
    }
}

The hasOwnProperty 方法檢查屬性是否直接在物件中定義,而不是從其原型繼承。透過使用此檢查,您可以從迭代中排除繼承的屬性。

hasOwnProperty 與透過物件呼叫

或者,您可以透過物件本身呼叫hasOwnProperty:

if (obj.hasOwnProperty(prop)) {
    // Do stuff
}

但是,如果物件具有不相關的字段,則這可能會失敗與hasOwnProperty同名,如:

var obj = { foo: 42, hasOwnProperty: 'lol' };
obj.hasOwnProperty('foo'); // TypeError

為了避免這個問題,透過 Object.prototype 呼叫 hasOwnProperty 會比較安全:

Object.prototype.hasOwnProperty.call(obj, 'foo'); // True

以上是如何使用「for...in」在 JavaScript 中安全地迭代物件屬性?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn