3 cách để khởi tạo một đối tượng instance trong Javascript

Bài đăng này đã không được cập nhật trong 2 năm

Link bài viết tham khảo: http://www.hongkiat.com/blog/object-oriented-javascript/ Khi mà tất cả những gì của một ngôn ngữ lập trình đều là đối tượng, thì việc đầu tiên chúng ta cần phải học khi làm quen với ngôn ngữ đó là học cách tạo ra một đối tượng như thế nào. Việc tạo ra một đối tượng trong Javascript tương đối đơn giản bằng một cặp dấu {}. Tuy nhiên đó không phải là cách duy nhất để tạo ra một đối tượng và cũng không phải là cách duy nhất bạn cần phải sử dụng.

Trong Javascript, đối tượng instance được tạo ta từ đối tượng build-in và tồn tại khi chương trình đang chạy. Ví dụ, Date là một đối tượng build-in như đã nói ở trên, nó mang thông tin về ngày tháng. Nếu bạn muốn hiển thị ra ngày tháng hiện tại lên trang web, chúng ta cần tạo ra một instance của Date chứa thông tin ngày tháng hiện tại.

Javascript cũng cho phép tự định nghĩa các đối tượng của chúng ta và cũng có thể tạo ra các instance trong thời gian chạy. Trong Javascript, tất cả mọi thứ đều là đối tượng và mọi đối tượng đều có chung tổ tiên cao nhất được gọi là Object.

1. Toán tử `new`.

Cách phổ biến nhất để tạo ra một instance của đối tượng là sử dụng toán tử new.

Để toán tử new có thể hoạt động được, ta cần phương thức của một đối tượng đặt cùng một instance mới của đối tượng đó, cú pháp đơn giản như sau:

new constructor();

Một constructor như trên có thể chứa các đối số được dùng để thay đổi hoặc thêm các thuộc tính vào instance của đối tượng mà nó xây dựng. Và constructor thì có cùng tên với đối tượng của nó. Xem ví dụ tạo một instance của đối tượng Date như sau:

dt = new Date('2017/9/17');
console.log(dt);
//Sun Sep 17 2017 00:00:00 GMT+0700 (ICT)

Không phải tất cả các đối tượng built-in đều có thể được thể hiện giống Date như là Math, JSON, Reflect...Tuy nhiên chúng vẫn là các đội tượng bình thường.

Với đối tượng Symbol thì bạn không thể gọi kiểu như trên được:

new Symbol;
//Uncaught TypeError: Symbol is not a constructor...
Symbol('foo');
//Symbol(foo)

Hoặc với những đối tượng Function, Array, Error, RexExp thì bạn thậm chí không cần dùng đến toán tử new cũng có được kết quả tương tự:

Array(1,2,3);
//[1, 2, 3]
new Array(1,2,3);
//[1, 2, 3]

2. Đối tượng `Reflect`.

Đối tượng Reflect có một tập hơp các phương thức để khởi tạo vào cập nhật đối tượng instance. Reflect không có một hàm constructor, do vậy mà nó không thể được khởi tạo với toán tử new như trong phần 1.

Tuy nhiên, Reflect có một sự tương đồng với toán tử new, đó là phương thức Reflect.construct(). Cú pháp như sau:

Reflect.construct(target, argumentsList[, newTarget])

Trong đó:

target và newTarget đều là các đối tượng có constructor của riêng nó.
argumentsList là một danh sách các đối số truyền vào.

var dt = Reflect.construct(Date, [2017, 0 , 1]);
console.log(dt);
//Sun Jan 01 2017 00:00:00 GMT+0700 (ICT)

Ví dụ ở trên cũng tương đương với việc khởi tạo new Date(2017, 0 , 1), tuy nhiên nó có một lợi thế so với toán tử new là nó có thể sử dụng với đối số newTarget.

Xem ví dụ dưới đây để hiểu rõ thêm:

class A {
  constructor() {
    this.message = function() {
      console.log('message from A');
    }
  }
}
 
class B {
  constructor() {
  }
  message() {
    console.log('message from B');
  }
  data() {
    console.log('data from B');
  }
}
 
obj = Reflect.construct(A, [], B);
 
console.log(obj.message());
// message from A
 
console.log(obj.data());
// data from B
 
console.log(obj instanceof B))
// true

Bằng cách truyền vào B như đối số thứ ba cho Reflect.construct(), giá trị nguyên mẫu của đối tượng obj được tạo ra giống như nguyên mẫu của constructor B (tức là có 2 thuộc tính message và data).

3. Phương thức `Object.create()`.

Cách này cũng tương tự như khi dùng toán tử new, cú pháp như sau:

Object.create(O[, propertiesObject])

Đối số O là một đối tượng phục vụ mẫu cho đối tượng mới sẽ được tạo ra.
Đối số tùy chọn propertiesObject là một danh sách các thuộc tính có thể thêm vào cho đối tượng mới đó.

Cùng xem ví dụ sau:

class A {
  constructor() {
  }
  message() {
    console.log('message from A')
  }
}
 
var obj = Object.create(new A(), {
  data: {
    writable: true,
    configurable: true,
    value: function(){return 'data from obj'}
  }
})
 
console.log(obj.message())
// message from A
 
console.log(obj.data())
// data from obj
 
obj1 = Object.create(new A(), {
  foo: {
    writable: true,
    configurable: true,
    value: function(){return 'foo from obj1'}
  }
})
 
console.log(obj1.message())
// message from A
 
console.log(obj1.foo())
// foo from obj1

Ở ví dụ trên, ta khai báo thêm data cho đối tượng obj, khai báo thêm foo cho đối tượng obj1. Do đó, chúng ta có thể có các phương thức và thuộc tính được thêm vào một đối tượng mới.

Điều này sẽ có ích khi bạn muốn tạo nhiều đối tượng cùng loại nhưng khác nhau về các phương thức cũng như thuộc tính ở trong đó.

Cám ơn bạn đã theo dõi bài viết này!

JavaScript