Định nghĩa Object trong JavaScript

Cách 2: Sử dụng new Object()

Cách này sử dụng constructor mặc định của JavaScript để tạo Object. Sau khi khởi tạo Object bằng new Object(), ta có thể thêm các thuộc tính và phương thức vào nó.

Ví dụ:

const person = new Object();  // Tạo một Object trống
person.name = "John";         // Thêm thuộc tính
person.age = 30;
person.greet = function () {  // Thêm phương thức
  return "Hello!";
};

console.log(person.name);  // "John"
console.log(person.greet());  // "Hello!"

Cách 3: Sử dụng Hàm Tạo (Constructor Function)

Constructor Function là một cách tạo Object linh hoạt hơn, đặc biệt khi cần tạo nhiều Object có cùng cấu trúc. Hàm tạo sử dụng từ khóa this để gán giá trị cho thuộc tính và được gọi bằng từ khóa new.

Ví dụ:

function Person(name, age) {
  this.name = name;
  this.age = age;
  this.greet = function () {
    return `Hello, my name is ${this.name}`;
  };
}

const john = new Person("John", 30);
const alice = new Person("Alice", 25);

console.log(john.name);  // "John"
console.log(alice.greet());  // "Hello, my name is Alice"

Cách 4: Sử dụng class (ES6+)

Từ ES6, JavaScript hỗ trợ cú pháp class, giúp tạo Object theo mô hình hướng đối tượng dễ đọc hơn so với Constructor Function.

Ví dụ:

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  greet() {
    return `Hello, my name is ${this.name}`;
  }
}

const john = new Person("John", 30);
const alice = new Person("Alice", 25);

console.log(john.greet());  // "Hello, my name is John"
console.log(alice.age);  // 25

Mỗi cách có ưu và nhược điểm riêng, tùy vào nhu cầu mà lập trình viên chọn cách phù hợp nhất. Trong phần tiếp theo, chúng ta sẽ tìm hiểu cách truy cập và thao tác với Object trong JavaScript.

Truy cập và thao tác với Object trong JavaScript

Trong JavaScript, Object có nhiều cách để truy cập, cập nhật và xóa dữ liệu. Dưới đây là các phương pháp phổ biến giúp bạn làm việc với Object một cách hiệu quả.

Truy cập thuộc tính của Object

Có hai cách để truy cập giá trị của một thuộc tính trong Object:

• Dùng dấu chấm (.)

• Dùng dấu ngoặc vuông ([])

Ví dụ:

const person = {
  name: "John",
  age: 30
};

// Truy cập bằng dấu chấm
console.log(person.name); // "John"
console.log(person.age);  // 30

// Truy cập bằng dấu ngoặc vuông
console.log(person["name"]); // "John"
console.log(person["age"]);  // 30

Khi nào nên dùng dấu ngoặc vuông ([])?

Khi key của thuộc tính là một biến:

const key = "name";
console.log(person[key]); // "John"

Khi key chứa dấu cách hoặc ký tự đặc biệt:

const obj = {
  "full name": "Alice Doe"
};
console.log(obj["full name"]); // "Alice Doe"
// obj.full name; // Lỗi: Unexpected identifier

Thêm hoặc sửa thuộc tính

Bạn có thể thêm mới hoặc cập nhật thuộc tính của Object bằng cách gán giá trị trực tiếp:

Ví dụ:

const person = {
  name: "John",
  age: 30
};

// Thêm thuộc tính mới
person.city = "New York";

// Cập nhật giá trị thuộc tính
person.age = 31;

console.log(person);
// { name: "John", age: 31, city: "New York" }

Xóa thuộc tính

Dùng từ khóa delete để xóa một thuộc tính khỏi Object.

Ví dụ:

const person = {
  name: "John",
  age: 30,
  city: "New York"
};

// Xóa thuộc tính
delete person.city;

console.log(person);
// { name: "John", age: 30 }

Duyệt qua Object trong JavaScript

Để lặp qua tất cả các thuộc tính trong một Object, bạn có thể sử dụng các phương pháp sau:

Dùng for...in để duyệt Object

Vòng lặp for...in duyệt qua tất cả các thuộc tính của Object.

const person = {
  name: "John",
  age: 30,
  city: "New York"
};

for (let key in person) {
  console.log(`${key}: ${person[key]}`);
}
// Output:
// name: John
// age: 30
// city: New York

Lưu ý:
for...in duyệt qua cả thuộc tính kế thừa từ prototype.
Nếu không muốn duyệt qua thuộc tính kế thừa, dùng Object.hasOwnProperty().

for (let key in person) {
  if (person.hasOwnProperty(key)) {
    console.log(`${key}: ${person[key]}`);
  }
}

const person = {
  name: "John",
  age: 30
};

console.log(Object.keys(person)); // ["name", "age"]
console.log(Object.values(person)); // ["John", 30]
console.log(Object.entries(person)); // [["name", "John"], ["age", 30]]

const person = {
  name: "John",
  age: 30,
  city: "New York"
};

// Destructuring
const { name, age } = person;

console.log(name); // "John"
console.log(age);  // 30

const { name: fullName, age: yearsOld } = person;
console.log(fullName, yearsOld); // "John", 30

const { country = "USA" } = person;
console.log(country); // "USA"

const person = { name: "John", age: 30 };
const person2 = { ...person, city: "New York" };

console.log(person2); 
// { name: "John", age: 30, city: "New York" }

const { name, ...rest } = person2;
console.log(name);  // "John"
console.log(rest);  // { age: 30, city: "New York" }

const person = { name: "John" };
Object.freeze(person);

person.name = "Alice"; // Không thay đổi
person.city = "New York"; // Không thêm được
delete person.name; // Không xóa được

console.log(person); // { name: "John" }

const person = { name: "John" };
Object.seal(person);

person.name = "Alice"; // OK, có thể sửa
person.city = "New York"; // Không thêm được
delete person.name; // Không xóa được

console.log(person); // { name: "Alice" }