Hướng dẫn call constructor without new javascript - gọi hàm tạo mà không có javascript mới

Một giải pháp "Một dòng" hoạt động được tóm tắt cho ES6: Giải thích

Câu trả lời được đăng ở trên bởi Bergi về cơ bản là chính xác.

TLDR; Bỏ qua kết thúc 😎 cho giải pháp một lớp lót

Câu trả lời của Bergi có vẻ không rõ ràng khi đọc nó. Vì vậy, đây là một mẫu mã mở rộng hơn để minh họa hai tính năng ES6 mới để đạt được các mục tiêu mong muốn.

Cùng nhau, họ để một hàm duy nhất C (bên dưới) cung cấp vai trò kép của một nhà máy và FN mới có thể; trong đó xây dựng một ____3 inst xuất phát từ A.factory and new-able fn; which constructs a B inst that derives from a A.

Trình xây dựng B sử dụng xử lý super để gọi hàm tạo A với các đối số khởi tạo. Trong các ví dụ #3 - 4 cuối cùng của chúng tôi được xây dựng bởi C.

Chất xây dựng A cho thấy ngữ nghĩa của

function C(...a) {return Reflect.construct(B, a);}

2 psuedo-var để khám phá

function C(...a) {return Reflect.construct(B, a);}

3 thực sự được gọi với B.

Đầu tiên, chúng tôi sẽ sử dụng ES6

function C(...a) {return Reflect.construct(B, a);}

2 PSUEDO-VAR cung cấp cho chúng tôi

function C(...a) {return Reflect.construct(B, a);}

6 của biểu thức

function C(...a) {return Reflect.construct(B, a);}

7.

Về mặt kỹ thuật, chúng ta có thể đã nhận được

function C(...a) {return Reflect.construct(B, a);}

2 như

function C(...a) {return Reflect.construct(B, a);}

9; Họ tương đương.

Thứ hai, chúng tôi sẽ sử dụng ES6

function C(...a) {return new B(...a);}

0. Điều này rất quan trọng để làm việc xung quanh các ràng buộc gọi của hàm tạo lớp ES6; Nếu chúng ta bị ràng buộc và quyết tâm không sử dụng

function C(...a) {return new B(...a);}

1.

Kiểm tra những điều sau đây và tự mình xem đầu ra của nó (cũng được cung cấp trong #1-4 bên dưới).

class A {
  constructor(...a) {
    const descendentType = new.target;
    console.log(`A's constructor seeing 'new' invoked on ${descendentType?.name} with args: %o`,a);
  }
}
class B extends A {
  constructor(...a) {
    super(...a);
  }
}
// C is our DUAL mode Factory
function C(...a) {
  console.log(`C's new.target => ${new.target?.name}`);
  const inst = new.target ? Reflect.construct(B, a) : new B(...a);
  console.log(`C has constructed a ${inst.__proto__.constructor.name} inst`);
  return inst;
}

Mà sau đó chúng ta có thể gọi nó theo những cách sau:

1. function C(...a) {return new B(...a);}
   

   2
   • OUTPUT => "Trình xây dựng của A nhìn thấy 'mới' được gọi trên A với Args: ['new-a ()']" " => "A's constructor seeing 'new' invoked on A with args: ['NEW-A()']"

2. function C(...a) {return new B(...a);}
   

   3
   • OUTPUT => "Trình xây dựng của A nhìn thấy 'mới' được gọi trên B với Args: ['new-b ()']" " => "A's constructor seeing 'new' invoked on B with args: ['NEW-B()']"

3. function C(...a) {return new B(...a);}
   

   4
   • đầu ra => "c's new.target => c" => "C's new.target => C"
   • OUTPUT => "Trình xây dựng của A nhìn thấy 'mới' được gọi trên B với ARGS: ['new-c ()']" " => "A's constructor seeing 'new' invoked on B with args: ['NEW-C()']"
   • OUTPUT => "C đã xây dựng A B Inst" => "C has constructed a B inst"

4. function C(...a) {return new B(...a);}
   

   5
   • output => "c's new.target => không xác định" => "C's new.target => undefined"
   • OUTPUT => "Trình xây dựng của A nhìn thấy 'mới' được gọi trên B với ARGS: ['Plain-C ()']" " => "A's constructor seeing 'new' invoked on B with args: ['PLAIN-C()']"
   • OUTPUT => "C đã xây dựng A B Inst" => "C has constructed a B inst"

output => "c's new.target => không xác định"

OUTPUT => "Trình xây dựng của A nhìn thấy 'mới' được gọi trên B với ARGS: ['Plain-C ()']" "

function C(...a) {return Reflect.construct(B, a);}

Trong đó #3 và #4 đạt được các mục tiêu mong muốn ban đầu.

function C(...a) {return new B(...a);}

C` C` trông giống như:function not a

function C(...a) {return new B(...a);}

8 for this to both be allowed, and to work returning an alternate

function C(...a) {return new B(...a);}

9 on a

class B extends A {
  // embedding within a class and generically referencing it requires =>
  static C = (() => {
    const $class = this; return function(...a) {
    return Reflect.construct($class, a);}})();
  // Read more on `Reflect.construct` 3rd argument to see more capabilities
  // for why it does MORE than just `new $class(...a)` would do.
}
exports.C = B.C;

0 invocation, etc.

Hoặc - nếu arg thứ 3 của

function C(...a) {return new B(...a);}

0 không được sử dụng cho init.strict mode rules for

class B extends A {
  // embedding within a class and generically referencing it requires =>
  static C = (() => {
    const $class = this; return function(...a) {
    return Reflect.construct($class, a);}})();
  // Read more on `Reflect.construct` 3rd argument to see more capabilities
  // for why it does MORE than just `new $class(...a)` would do.
}
exports.C = B.C;

1 requires using a closure (smalltalk-block. Illustrated below:

class B extends A {
  // embedding within a class and generically referencing it requires =>
  static C = (() => {
    const $class = this; return function(...a) {
    return Reflect.construct($class, a);}})();
  // Read more on `Reflect.construct` 3rd argument to see more capabilities
  // for why it does MORE than just `new $class(...a)` would do.
}
exports.C = B.C;

Cẩn thận: C phải là một hàm không phải là

function C(...a) {return new B(...a);}

8 cho điều này để được phép cả hai và làm việc trả lại một thay thế

function C(...a) {return new B(...a);}

9 trên một lời cầu khẩn

class B extends A {
  // embedding within a class and generically referencing it requires =>
  static C = (() => {
    const $class = this; return function(...a) {
    return Reflect.construct($class, a);}})();
  // Read more on `Reflect.construct` 3rd argument to see more capabilities
  // for why it does MORE than just `new $class(...a)` would do.
}
exports.C = B.C;

0, v.v.template superclass flattened mixin tree; which I do a lot of in efekt for supporting tiny-but-complete µhtml reactive custom-elements parts and related PWA app models and responsive dynamic just-in-time versioned code bundling from EdgeS ESS backend servers. As in ... C2.

Ngoài ra để phá vỡ các quy tắc chế độ nghiêm ngặt cho

class B extends A {
  // embedding within a class and generically referencing it requires =>
  static C = (() => {
    const $class = this; return function(...a) {
    return Reflect.construct($class, a);}})();
  // Read more on `Reflect.construct` 3rd argument to see more capabilities
  // for why it does MORE than just `new $class(...a)` would do.
}
exports.C = B.C;

1 yêu cầu sử dụng đóng cửa (khối nhỏ. Minh họa dưới đây:

Bạn có thể làm một số điều khủng khiếp như fiddle

class B extends A {
  // embedding within a class and generically referencing it requires =>
  static C = (() => {
    const $class = this; return function(...a) {
    return Reflect.construct($class, a);}})();
  // Read more on `Reflect.construct` 3rd argument to see more capabilities
  // for why it does MORE than just `new $class(...a)` would do.
}
exports.C = B.C;

2 trên kết quả

class B extends A {
  // embedding within a class and generically referencing it requires =>
  static C = (() => {
    const $class = this; return function(...a) {
    return Reflect.construct($class, a);}})();
  // Read more on `Reflect.construct` 3rd argument to see more capabilities
  // for why it does MORE than just `new $class(...a)` would do.
}
exports.C = B.C;

3 và thay đổi

class B extends A {
  // embedding within a class and generically referencing it requires =>
  static C = (() => {
    const $class = this; return function(...a) {
    return Reflect.construct($class, a);}})();
  // Read more on `Reflect.construct` 3rd argument to see more capabilities
  // for why it does MORE than just `new $class(...a)` would do.
}
exports.C = B.C;

4 và

class B extends A {
  // embedding within a class and generically referencing it requires =>
  static C = (() => {
    const $class = this; return function(...a) {
    return Reflect.construct($class, a);}})();
  // Read more on `Reflect.construct` 3rd argument to see more capabilities
  // for why it does MORE than just `new $class(...a)` would do.
}
exports.C = B.C;

5 của nó. Điều này sẽ làm cho nó trông và cảm thấy giống như một lớp con thực sự C của B tùy thuộc vào mức độ bạn muốn đi để thao túng mô hình đối tượng. Sự tinh tế rất nhiều trong những gì xảy ra với tư nhân

class B extends A {
  // embedding within a class and generically referencing it requires =>
  static C = (() => {
    const $class = this; return function(...a) {
    return Reflect.construct($class, a);}})();
  // Read more on `Reflect.construct` 3rd argument to see more capabilities
  // for why it does MORE than just `new $class(...a)` would do.
}
exports.C = B.C;

8, super và C0. Nhưng trong số đó, bạn có thể giữ sạch ES6 và thông minh với việc sử dụng C1 và cung cấp một cây mixin spanin siêu mẫu mẫu; Điều mà tôi làm rất nhiều trong EFEKT để hỗ trợ các bộ phận tùy chỉnh phản ứng nhỏ-nhưng hoàn chỉnh của các bộ phận các yếu tố tùy chỉnh PWA và các mô hình ứng dụng PWA liên quan và kết hợp mã được phiên bản chỉ trong thời gian động từ các máy chủ phụ trợ ESS. Như trong ... C2.workflow handling capabilities in my github efekt library (EdgeS Front End Kit library).

Có thể gọi hàm tạo mà không có mới?

Làm cách nào để gọi một hàm tạo JavaScript?

Tại sao chúng ta sử dụng mới trong JavaScript?

Điều gì xảy ra nếu bạn không thêm một hàm tạo vào một lớp trong JavaScript?