Object constructor được hiểu là bản thiết kế trong lập trình Javascript. Dựa vào bản thiết kế tạo sẵn, có thể dùng để tạo ra các đối tượng cùng các thuộc tính chung. Từ đó, tiết kiệm thời gian tạo các đối tượng mới, vì không phải tạo lại các đối tượng đã có trong bản thiết kế.

Tùy đối tượng có các thuộc tính riêng thì sẽ tạo riêng cho đối tượng đó.

Tạo Object Constructor – bản thiết kế trong Javascript

Ví dụ thiết kế 2 đối tượng là giảng viên và học viên.
Tạo ra 1 hàm function gồm các tham số chung của cả 2 đối tượng
function User(firstName, lastName, avatar) {
    this.firstName = firstName
    this.lastName = lastName
    this.avatar = avatar
    this.getName = function () {
        return `${this.lastName} ${this.firstName}`
    }
}
Trên là loại hàm Declaration function. Cũng có thể tạo Object constructor bằng loại hàm Expression function.
var User = function(firstName, lastName, avatar) {
    this.firstName = firstName
    this.lastName = lastName
    this.avatar = avatar
    this.getName = function () {
        return `${this.lastName} ${this.firstName}`
    }
}

Giải thích:

Tên hàm User hiểu là tên bản thiết kế Object constructor thì không buộc viết hoa, nhưng theo quy ước thì viết hoa.
Bản thiết kế trên cho biết:
Sau này nếu đối tượng được khởi tạo với bản thiết kế này, thì:
– thuộc tính firstName sẽ bằng tham số firstName truyền vào khi khởi tạo đối tượng.
– thuộc tính lastName sẽ bằng tham số lastName truyền vào khi khởi tạo đối tượng.
– thuộc tính avatar sẽ bằng tham số avatar truyền vào khi khởi tạo đối tượng.
Bản thiết kế User, không phải là đối tượng, mà nó là bản mô tả thiết kế của đối tượng.
Javascript-Object-constructor-ban-thiet-ke

Javascript-Object-constructor-ban-thiet-ke

Tiếp theo, tạo ra 2 đối tượng giảng viên và học viên

var giangvien = new User(‘Nam’, ‘Hà’, ‘Avatar’)
var hocvien = new User(‘Việt’, ‘Nguyễn’, ‘Avatar’)
console.log(giangvien) // User {firstName: ‘Nam’, lastName: ‘Hà’, avatar: ‘Avatar’}
console.log(hocvien) // User {firstName: ‘Việt’, lastName: ‘Nguyễn’, avatar: ‘Avatar’}
Khi ta tạo new User() truyền vào các đối số, được gọi là đối tượng. Và đối tượng được gán cho 1 biến như giangvien và hocvien.
console.log(‘bản thiết kế:’, hocvien.constructor === User) // true – chính xác là đối tượng hocvien sử dụng bản thiết kế Object constructor.
console.log(‘bản thiết kế:’, giangvien.constructor === User) // true – chính xác là đối tượng hocvien sử dụng bản thiết kế Object constructor.

Cách thêm thuộc tính vào các đối tượng khác nhau

Ví dụ 2 đối tượng giảng viên, và học viên, ngoài các thuộc tính giống nhau, được thiết kế theo bản thiết kế trên rồi. Nhưng cần thêm một số thuộc tính khác nhau vào từng đối tượng này như sau:
Đối tượng giảng viên thì thêm title như sau:
giangvien.title = ‘Tiêu đề – khẩu hiệu của giảng viên’
Đối tượng học viên thì thêm  mô tả
hocvien.binhluan = ‘Bình luận của học viên’
console.log(giangvien) // thuộc tính title = ‘Tiêu đề – khẩu hiệu của giảng viên’ đã thêm vào đối tượng giangvien, bản thiết kế không bị ảnh hưởng.
console.log(hocvien) // thuộc tính binhluan = ‘Bình luận của học viên’ đã thêm vào đối tượng hocvien, bản thiết kế không bị ảnh hưởng.
console.log(giangvien.getName()) // Hà Nam
Tham khảo thêm: Thiết kế website và chạy quảng cáo Google Facebook
Thiet-ke-web-quang-cao-google-facebook-ha-noi-tphcm

Thiet-ke-web-quang-cao-google-facebook-ha-noi-tphcm

Nguồn tham khảo: F8