資料結構
網路
關係資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝設計
法律研究如何在 JavaScript 中訪問物件陣列的屬性？
在本教程中，我們將學習如何在 JavaScript 中訪問物件陣列的屬性。
JavaScript 基於基本的面向物件正規化。屬性的集合是一個物件，屬性是名稱（或鍵）和值之間的關係。屬性的值可以是函式，在這種情況下，該屬性稱為方法。
JavaScript 物件與屬性相關聯。可以將物件的屬性視為與物件關聯的變數。除了附加到物件之外，物件屬性與常規 JavaScript 變數相同。物件的屬性定義了事物的特性。
屬性訪問器使用點或括號表示法來訪問物件的屬性。在討論物件的屬性時，通常區分屬性和方法。另一方面，屬性/方法的區別只是一種約定。方法是可以透過呼叫它來訪問的屬性。方法與其所屬的物件無關。特別是，這在技術上沒有固定。換句話說，這並不總是對應於具有方法的物件。相反，函式呼叫“傳遞”this。
以下是訪問 JavaScript 中物件陣列屬性的方法。
使用點表示法
“object.property”語法中的屬性必須是有效的 JavaScript 識別符號。該表示式應返回一個物件，其中識別符號是要訪問的屬性的名稱。在一個鏈中，您可以使用點屬性訪問器訪問更深的屬性，例如 (object.prop1.prop2)。當屬性名稱事先已知時，應使用點屬性訪問器。當屬性名稱是有效的識別符號時，點屬性訪問器可以正常工作。
語法
var name = myBook.title;
使用點屬性訪問器訪問 myBook 物件中的標題。
示例
在本例中，我們建立了一個名為 book 的函式，它將一些引數作為輸入。引數的值傳遞給函式。使用點表示法訪問物件的屬性。
<html> <head> <script> function book(title, author, price, publisher, isbn) { this.title = title; this.author = author; this.price = price; this.publisher = publisher; this.isbn = isbn; } </script> </head> <body> <h3>Access properties of an array of objects using dot property accessor</h3> <p id="root"></p> <script> let root = document.getElementById("root"); var myBook = new book("Chronicles of Economics", "Anirban Maity", "399", "Geetam Publishers", "Q123D8"); book.prototype.price = null; root.innerHTML = "Book title is : " + myBook.title + "<br>"; root.innerHTML += "Book author is : " + myBook.author + "<br>"; root.innerHTML += "Book price is : " + myBook.price + "<br>"; root.innerHTML += "Book Publisher is : " + myBook.publisher + "<br>"; root.innerHTML += "Book ISBN is : " + myBook.isbn + "<br>"; </script> </body> </html>
使用方括號表示法
“propertyName”語法在 object[propertyName] 語法中只是一個字串或 Symbol。因此，它可能是任何字串，例如“1foo”、“!bar!”，甚至“（空格）”。字串和 Symbol 是兩種型別的屬性名稱。任何其他值，即使是數字，也會強制轉換為字串。因為 1 被強制轉換為“1”，所以這會產生“value”。當屬性名稱是動態的，即在執行時決定時，使用方括號屬性訪問器。
語法
var name = myBook['title'];
使用方括號屬性訪問器訪問 myBook 物件中的標題。
示例
在本例中，我們構建了一個名為 book 的函式，它將引數作為輸入。引數的值傳遞給函式。使用方括號表示法訪問物件的屬性。
<html> <head> <script> function book(title, author, price, publisher, isbn){ this.title = title; this.author = author; this.price = price; this.publisher = publisher; this.isbn = isbn; } </script> </head> <body> <h3>Access properties of an array of objects using <i>square brackets </i> property accessor </h3> <p id = "root"></p> <script> let root = document.getElementById("root"); var myBook = new book("Day in the life of a National Swimmer", "Amitanshu Maity", "768", "Honey Well Publishers", "245F67"); root.innerHTML = "Book title is : "+myBook['title'] + "<br>"; root.innerHTML += "Book author is : "+myBook['author'] + "<br>"; root.innerHTML += "Book price is : "+myBook['price'] + "<br>"; root.innerHTML += "Book Publisher is : "+myBook['publisher'] + "<br>"; root.innerHTML += "Book ISBN is : "+myBook['isbn'] + "<br>"; </script> </body> </html>
使用解構物件
識別符號是要訪問的屬性的名稱，表示式必須返回一個物件。解構後，變數識別符號現在包含屬性值。
物件解構為 (const {title} = book)。解構指定一個變數名，其值為屬性名的值。
當您希望使用屬性值構造一個變數時，它的語法是在物件解構中將屬性提取到變數中的一種好方法，請使用物件解構。
語法
const { title } = book;
解構 book 物件，並訪問標題。
示例
在本例中，使用一些引數建立了一個函式表示式。物件的引數被解構並存儲在特定的變數中。常量變數儲存屬性的值，並在輸出中訪問。
<html> <body> <h3>Access properties of an array of objects using <i>object destructuring</i></h3> <p id="root"></p> <script> let root = document.getElementById("root"); const book = { title: 'Let Us JavaScript', author: 'Neelanshu R', price: '456', publisher: 'Trinity Publishers', isbn: 'F624RT', }; const { title } = book; const { author } = book; const { price } = book; const { publisher } = book; const { isbn } = book; root.innerHTML = "Book title is : "+title + "<br>"; root.innerHTML += "Book author is : "+author + "<br>"; root.innerHTML += "Book price is : "+price + "<br>"; root.innerHTML += "Book Publisher is : "+publisher+ "<br>"; root.innerHTML += "Book ISBN is : "+isbn + "<br>"; </script> </body> </html>
在本教程中，我們學習了訪問 JavaScript 中物件陣列屬性的不同方法。
5K+ 次檢視
