Thuộc tính đối tượng JavaScript
Thuộc tính là phần quan trọng nhất của bất kỳ đối tượng JavaScript nào.
Thuộc tính JavaScript
Thuộc tính là các giá trị được liên kết với một đối tượng JavaScript.
Đối tượng JavaScript là tập hợp các thuộc tính không có thứ tự.
Các thuộc tính thường có thể được thay đổi, thêm và xóa, nhưng một số thuộc tính chỉ được đọc.
Truy cập thuộc tính JavaScript
Cú pháp để truy cập thuộc tính của một đối tượng là:
objectName.property // person.age
hoặc
objectName [" property "] // person["age"]
hoặc
objectName [ expression ] // x = "age"; person[x]
Biểu thức phải đánh giá một tên thuộc tính.
JavaScript cho...vòng lặp
Câu lệnh for...in
JavaScript lặp qua các thuộc tính của một đối tượng.
Cú pháp
for (let variable in object ) {
// code to be executed
}
Khối mã bên trong vòng lặp for...in
sẽ được thực thi một lần cho mỗi thuộc tính.
Lặp qua các thuộc tính của một đối tượng:
Ví dụ
const person = {
fname:" John",
lname:" Doe",
age: 25
};
for (let x in person) {
txt += person[x];
}
Hãy tự mình thử »Thêm thuộc tính mới
Bạn có thể thêm các thuộc tính mới vào một đối tượng hiện có bằng cách gán cho nó một giá trị.
Giả sử rằng đối tượng người đó đã tồn tại - khi đó bạn có thể cung cấp cho nó các thuộc tính mới:
Xóa thuộc tính
Từ khóa delete
xóa một thuộc tính khỏi một đối tượng:
Ví dụ
const person = {
firstName: "John",
lastName: "Doe",
age: 50,
eyeColor: "blue"
};
delete person.age;
Hãy tự mình thử »hoặc xóa người["tuổi"];
Ví dụ
const person = {
firstName: "John",
lastName: "Doe",
age: 50,
eyeColor: "blue"
};
delete person["age"];
Hãy tự mình thử » Từ khóa delete
sẽ xóa cả giá trị của thuộc tính và chính thuộc tính đó.
Sau khi xóa, thuộc tính không thể được sử dụng trước khi nó được thêm lại.
Toán tử delete
được thiết kế để sử dụng trên các thuộc tính đối tượng. Nó không có tác dụng đối với các biến hoặc chức năng.
Không nên sử dụng toán delete
trên các thuộc tính đối tượng JavaScript được xác định trước. Nó có thể làm hỏng ứng dụng của bạn.
Đối tượng lồng nhau
Các giá trị trong một đối tượng có thể là một đối tượng khác:
Ví dụ
myObj = {
name:"John",
age:30,
cars: {
car1:"Ford",
car2:"BMW",
car3:"Fiat"
}
}
Bạn có thể truy cập các đối tượng lồng nhau bằng ký hiệu dấu chấm hoặc ký hiệu ngoặc:
hoặc:
hoặc:
hoặc:
Mảng và đối tượng lồng nhau
Giá trị trong đối tượng có thể là mảng và giá trị trong mảng có thể là đối tượng:
Ví dụ
const myObj =
{
name: "John",
age: 30,
cars: [
{name:"Ford",
models:["Fiesta", "Focus", "Mustang"]},
{name:"BMW", models:["320", "X3", "X5"]},
{name:"Fiat", models:["500", "Panda"]}
]
}
Để truy cập các mảng bên trong mảng, hãy sử dụng vòng lặp for-in cho mỗi mảng:
Ví dụ
for (let i in myObj.cars) {
x += "<h1>" + myObj.cars[i].name
+ "</h1>";
for (let j in myObj.cars[i].models) {
x += myObj.cars[i].models[j];
}
}
Hãy tự mình thử »Thuộc tính tài sản
Tất cả các thuộc tính đều có tên. Ngoài ra chúng còn có giá trị.
Giá trị là một trong những thuộc tính của thuộc tính.
Các thuộc tính khác là: có thể đếm được, có thể định cấu hình và có thể ghi.
Các thuộc tính này xác định cách truy cập thuộc tính (nó có thể đọc được không?, có thể ghi được không?)
Trong JavaScript, tất cả các thuộc tính đều có thể được đọc nhưng chỉ có thể thay đổi thuộc tính value (và chỉ khi thuộc tính có thể ghi được).
( ECMAScript 5 có các phương thức để nhận và thiết lập tất cả các thuộc tính thuộc tính)
Thuộc tính nguyên mẫu
Các đối tượng JavaScript kế thừa các thuộc tính của nguyên mẫu của chúng.
Từ khóa delete
không xóa các thuộc tính kế thừa nhưng nếu bạn xóa một thuộc tính nguyên mẫu thì nó sẽ ảnh hưởng đến tất cả các đối tượng được kế thừa từ nguyên mẫu.