Hướng dẫn what are the possible ways to create objects in javascript? - những cách có thể để tạo các đối tượng trong javascript là gì?

Trong JavaScript, có bốn phương pháp để sử dụng để tạo một đối tượng:

1. Đối tượng chữ.
2. Toán tử hoặc nhà xây dựng mới.
3. Phương thức đối tượng.Create.
4. Class.

Trong bài đăng này, chúng tôi sẽ học từng phương pháp này.

Đối tượng chữ

Một đối tượng theo nghĩa đen, còn được gọi là trình khởi tạo đối tượng, là một tập hợp các tên và giá trị được ghép nối bằng dấu phẩy. Bạn có thể tạo một đối tượng theo nghĩa đen như hình dưới đây:

var car = {
    model: 'bmw',
    color: 'red',
    price: 2000
}
console.log(JSON.stringify(car));

Bạn có thể thêm các thuộc tính động trong một đối tượng, bao gồm sau khi bạn đã tạo đối tượng. Ở đây chúng tôi thêm thuộc tính động xe.type:car.type:

var car = {
    model: 'bmw',
    color: 'red',
    price: 2000
}
console.log(JSON.stringify(car));
car.type = 'manual'; // dynamic property  console.log(JSON.stringify(car));

Đối tượng theo nghĩa đen là một biểu thức đơn giản tạo ra một đối tượng mỗi lần câu lệnh mà nó xuất hiện được thực thi trong mã. Bạn cũng có thể sử dụng & nbsp;

var car = {
    model: 'bmw',
    color: 'red',
    price: 2000
}

Object.defineProperty(car, "type", {
    writable: true,
    enumerable: true,
    configurable: false,
    value: 'gas'
});
console.log(car.type); //gas 

Ưu điểm chính của việc sử dụng & nbsp; ________ 13 & nbsp; là bạn có thể đặt giá trị cho các mô tả thuộc tính đối tượng hoặc sửa đổi các thuộc tính hiện có. Bạn có thể tìm hiểu thêm về Bộ mô tả thuộc tính đối tượng ở đây.

Nhà điều hành hoặc trình xây dựng mới

Cách thứ hai để tạo một đối tượng là sử dụng hàm tạo hàm. Nếu bạn gọi một hàm bằng toán tử mới, hàm hoạt động như một hàm tạo và trả về một đối tượng. Xem xét mã sau:new operator, the function acts as a constructor and returns an object. Consider the following code:

function Car(model, color) {
    this.model = model;
    this.color = color;
}

var c1 = new Car('BMW', 'red');
console.log(c1.model);

Phương pháp tạo một đối tượng này còn được gọi là mẫu gọi của & nbsp; Có hai bước để làm việc với chức năng Constructor:Constructor Invocation Pattern. There are two steps to work with the constructor function:

1. Tạo một hàm, sẽ xác định loại đối tượng.
2. Tạo một thể hiện của một đối tượng bằng toán tử mới.new operator.

Để tạo một đối tượng sinh viên, trước tiên, hãy tạo một chức năng như hình dưới đây. Trong ví dụ này, điều này thể hiện đối tượng được tạo, vì vậy tên và tuổi sẽ là thuộc tính của đối tượng mới được tạo.this represents the object being created, so name and age will be properties of the newly created object.

function Student(name, age) {
    this.name = name;
    this.age = age;
}

Tiếp theo, tạo các phiên bản của loại đối tượng sinh viên như hình dưới đây:

var s1 = new Student('foo', 7);
console.log(s1.name);
var s2 = new Student('koo', 9);
console.log(s2.name);

Bạn có thể sử dụng nhà điều hành & nbsp;

var s1 = new Student('foo', 9);
console.log(s1 instanceof Student);

Bạn cũng có thể sử dụng & nbsp; ________ 13 & nbsp; để tạo các thuộc tính trong hàm tạo hàm, như được hiển thị bên dưới:

function Car(model) {
    Object.defineProperty(this, "model", {
        writable: true,
        enumerable: true,
        configurable: false,
        value: model
    });
}

var myCar = new Car("Audi A3");
console.log(myCar.model);    // Audi  A3

Ưu điểm chính của việc sử dụng & nbsp; ________ 13 & nbsp; là bạn có thể đặt giá trị cho các mô tả thuộc tính đối tượng. Bạn có thể tìm hiểu thêm về mô tả thuộc tính đối tượng ở đây.

Phương thức đối tượng.Create

Bạn cũng có thể tạo các đối tượng mới bằng phương thức & nbsp; ____ 18 & nbsp; cho phép bạn chỉ định đối tượng nguyên mẫu và các thuộc tính. Ví dụ:

var Car = {
    model: 'BMW',
    color: 'red'
}

Bạn có thể sử dụng & nbsp; ________ 19 & nbsp; đối tượng làm nguyên mẫu để tạo một đối tượng khác, như được hiển thị bên dưới:

var ElectricCar = Object.create(Car);
console.log(ElectricCar.model); // BMW

Trong ví dụ này, bạn đã tạo một đối tượng gọi là & nbsp; ____ ____ 20 & nbsp; sử dụng & nbsp; ________ 19 & nbsp; đối tượng như một nguyên mẫu, vì vậy đối tượng & nbsp; ____ 20 & nbsp; sẽ có tất cả các thuộc tính của & nbsp; ____ 19 & nbsp; object. Bạn cũng có thể thêm các thuộc tính như hình dưới đây:

var car = {
    model: 'bmw',
    color: 'red',
    price: 2000
}
console.log(JSON.stringify(car));
car.type = 'manual'; // dynamic property  console.log(JSON.stringify(car));

Các thuộc tính nên được truyền dưới dạng đối tượng và có thể được đặt bằng bộ mô tả thuộc tính. Bạn cũng có thể sử dụng phương thức & nbsp; ____ ____ 24 & nbsp; để tạo sự kế thừa giữa các đối tượng.

Lớp

Ecmascript 6 đã giới thiệu từ khóa lớp để tạo các lớp trong JavaScript. Bây giờ bạn có thể sử dụng thuộc tính lớp để tạo một lớp trong JavaScript thay vì hàm tạo hàm và sử dụng toán tử mới để tạo một thể hiện. Xem xét mã sau:

var car = {
    model: 'bmw',
    color: 'red',
    price: 2000
}
console.log(JSON.stringify(car));
car.type = 'manual'; // dynamic property  console.log(JSON.stringify(car));

Bạn có thể sử dụng lớp & nbsp; ________ 19 & nbsp; để tạo các đối tượng như hình dưới đây:

var car = {
    model: 'bmw',
    color: 'red',
    price: 2000
}
console.log(JSON.stringify(car));
car.type = 'manual'; // dynamic property  console.log(JSON.stringify(car));

Bạn có thể tìm hiểu thêm về lớp học ở đây.

Sự kết luận

Có bốn cách để tạo một đối tượng trong JavaScript - sử dụng nghĩa đen đối tượng, sử dụng hàm tạo hàm, sử dụng phương thức & nbsp; ________ 24 & nbsp; và sử dụng từ khóa lớp (gần giống như sử dụng hàm tạo hàm). Phương thức & nbsp; ____ ____ 24 & nbsp; rất hữu ích khi bạn cần tạo một đối tượng bằng cách sử dụng một đối tượng hiện có làm nguyên mẫu.

Trong bài tiếp theo, chúng tôi sẽ đi sâu vào các khía cạnh khác của JavaScript! & NBSP;

Các loại đối tượng khác nhau trong JavaScript là gì?

Những gì có thể được sử dụng để tạo các đối tượng?

Làm thế nào để bạn tạo một đối tượng mới?

Làm thế nào để bạn tạo nhiều đối tượng trong JavaScript?