資料結構
網路
關係資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究如何使用 jQuery 迭代 JavaScript 物件的屬性？
在本文中，我們將學習如何使用 jQuery 迭代 JavaScript 物件的屬性。
使用 JavaScript 迭代物件的最簡單方法是使用for in 迴圈。
for 語句將像陣列一樣迭代物件，但迴圈將向物件傳送鍵而不是索引作為引數。
此迴圈用於迭代物件的全部非 Symbol 可迭代屬性。hasOwnProperty() 方法可用於檢查屬性是否屬於物件本身。可以使用鍵作為物件的索引來查詢物件的每個鍵的值。
語法
以下是使用 jQuery 迭代 JavaScript 物件的語法。
for (let key in example) {
if (example.hasOwnProperty(key)) {
value = example[key];
console.log(key, value);
}
}
示例
以下是使用 jQuery 迭代 JavaScript 物件的示例程式。
<!DOCTYPE html> <html> <head> <title> </title> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <button onclick="iterateObject()"> Iterate </button> <script> function iterateObject() { let example = { Book: "Rich Dad Poor Dad", Author: "Robert Kiyosaki", }; for (let key in example) { if (example.hasOwnProperty(key)) { value = example[key]; document.write(key, value, "<br>"); } } } </script> </body> </html>
執行上述程式後，它將生成一個包含名為iterate的按鈕的網頁。單擊迭代按鈕後，頁面上將顯示以下內容
示例
以下是使用 jQuery 迭代 JavaScript 物件的另一個示例程式。
<!DOCTYPE html> <html> <head> <title> </title> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <button onclick="iterateObject()"> Iterate </button> <script> function iterateObject() { let example = { Student: "Amar", Branch: "Information Technology", Section:"A", Rollno:22 }; for (let key in example) { if (example.hasOwnProperty(key)) { value = example[key]; document.write(key, value, "<br>"); } } } </script> </body> </html>
執行上述程式後，它將生成一個包含名為iterate的按鈕的網頁。單擊迭代按鈕後，頁面上將顯示以下內容。
使用 Object.entries()
我們還可以使用Object.entries() 方法來返回物件自身可列舉的字串鍵屬性對的陣列。該陣列與 map() 方法一起使用，以從上下文的對中提取鍵和值。
可以透過訪問陣列對的第一和第二索引來提取鍵值對中的鍵和值。第一個索引對應於鍵，第二個索引對應於對的值。
語法
以下是使用 jQuery 迭代 JavaScript 物件的語法。
Object.entries(example).map(entry => {
let key = entry[0];
let value = entry[1];
console.log(key, value);
});
示例
以下是使用 jQuery 迭代 JavaScript 物件的示例程式。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <button onclick="iterateObject()"> Iterate </button> <script > function iterateObject() { let example = { Student: "Amar", Branch: "Information Technology", Section:"A", Rollno:22 }; Object.entries(example).map(entry => { let key = entry[0]; let value = entry[1]; document.write(key, ": ", value, "<br>"); }); } </script> </body> </html>
執行上述程式後，它將生成一個包含名為iterate的按鈕的網頁。單擊迭代按鈕後，頁面上將顯示以下內容。
更新於: 2022-11-18
1K+ 瀏覽量
廣告