Cách Truy Cập và Thay Đổi Thuộc Tính Của Một Đối Tượng Trong JavaScript

Đối tượng trong JavaScript chứa các thuộc tính dưới dạng cặp key-value. Bạn có thể truy cập và thay đổi các thuộc tính này bằng nhiều cách khác nhau.

Truy Cập Thuộc Tính

Có hai cách chính để truy cập thuộc tính của một đối tượng:

1. Sử dụng dấu chấm (Dot Notation)
2. Sử dụng dấu ngoặc vuông (Bracket Notation)

1. Sử Dụng Dấu Chấm (Dot Notation)

Dấu chấm là cách phổ biến nhất để truy cập thuộc tính của một đối tượng.

• Cú pháp:

  object.propertyName;
  

• Ví dụ:

  let person = {
    name: "Alice",
    age: 25,
    city: "New York"
  };
  
  console.log(person.name); // Output: Alice
  console.log(person.age); // Output: 25
  

2. Sử Dụng Dấu Ngoặc Vuông (Bracket Notation)

Dấu ngoặc vuông cho phép truy cập thuộc tính của một đối tượng bằng cách sử dụng tên thuộc tính dưới dạng chuỗi. Cách này hữu ích khi tên thuộc tính chứa ký tự đặc biệt, khoảng trắng, hoặc khi tên thuộc tính được xác định động.

• Cú pháp:

  object["propertyName"];
  

• Ví dụ:

  let person = {
    name: "Alice",
    age: 25,
    "favorite color": "blue"
  };
  
  console.log(person["name"]); // Output: Alice
  console.log(person["favorite color"]); // Output: blue
  
  let propName = "age";
  console.log(person[propName]); // Output: 25
  

Thay Đổi Thuộc Tính

Bạn có thể thay đổi giá trị của thuộc tính của một đối tượng bằng cách sử dụng dấu chấm hoặc dấu ngoặc vuông tương tự như khi truy cập thuộc tính.

1. Thay Đổi Thuộc Tính Sử Dụng Dấu Chấm

• Cú pháp:

  object.propertyName = newValue;
  

• Ví dụ:

  let person = {
    name: "Alice",
    age: 25,
    city: "New York"
  };
  
  person.age = 26; // Thay đổi giá trị của thuộc tính 'age'
  console.log(person.age); // Output: 26
  

2. Thay Đổi Thuộc Tính Sử Dụng Dấu Ngoặc Vuông

• Cú pháp:

  object["propertyName"] = newValue;
  

• Ví dụ:

  let person = {
    name: "Alice",
    age: 25,
    "favorite color": "blue"
  };
  
  person["favorite color"] = "green"; // Thay đổi giá trị của thuộc tính 'favorite color'
  console.log(person["favorite color"]); // Output: green
  
  let propName = "city";
  person[propName] = "Los Angeles"; // Thay đổi giá trị của thuộc tính 'city' sử dụng biến
  console.log(person.city); // Output: Los Angeles
  

Tổng Kết

Trong JavaScript, bạn có thể truy cập và thay đổi thuộc tính của một đối tượng bằng cách sử dụng dấu chấm (dot notation) hoặc dấu ngoặc vuông (bracket notation).

• Truy cập thuộc tính:

  • Sử dụng dấu chấm:

    let person = { name: "Alice", age: 25 };
    console.log(person.name); // Output: Alice
    

  • Sử dụng dấu ngoặc vuông:

    let person = { name: "Alice", age: 25 };
    console.log(person["age"]); // Output: 25
    

• Thay đổi thuộc tính:

  • Sử dụng dấu chấm:

    let person = { name: "Alice", age: 25 };
    person.age = 26;
    console.log(person.age); // Output: 26
    

  • Sử dụng dấu ngoặc vuông:

    let person = { name: "Alice", age: 25 };
    person["age"] = 26;
    console.log(person["age"]); // Output: 26
    

Việc hiểu và sử dụng đúng cách truy cập và thay đổi thuộc tính sẽ giúp bạn quản lý và thao tác dữ liệu hiệu quả hơn trong các ứng dụng JavaScript của mình.