Javascript Scope SAFEジェネレータモードとnew.target

7185 ワード
JavaScript スイープチューブ作成(Sweep Tube Creator)アレイ new.target テキストリンク
JAvascriptは、ES 6のnew 연산자 없이 호출되는 것을 방지をサポートし、new.targetの関数を構築します.でもIEではnewtargetはサポートされていません.스코프 세이프 생성자 패턴を使用します.
ではnewtargetとは何ですか.ガウスパイプジェネレータモードは何ですか.まずScope SAFEの作成者について説明します.

1.Scope Safeジェネレータアレイ


  • コンストラクション関数がnewとともに呼び出されない場合、scopeパイプモードは、コンストラクション関数を利用してその関数のプロトタイプに接続されていないモードである.

  • したがって、this instance 생성자 함수 식별자はfalse時にnew演算子とともに関数を再帰的に呼び出し、構造関数として呼び出すことができることを保証する.
    // Scope-Safe Constructor Pattern
function Circle(radius) {
   // 생성자 함수가 new 연산자와 함께 호출되면 함수의 선두에서 빈 객체를 생성하고 this에 바인딩한다.
   // 이때 this와 Circle은 프로토타입에 의해 연결된다.

   // 이 함수가 new 연산자와 함께 호출되지 않았다면 이 시점의 this는 전역 객체 window를 가리킨다.
   // 즉, this와 Circle은 프로토타입에 의해 연결되지 않는다.
   if (!(this instanceof Circle)) {
     // new 연산자와 함께 재귀 호출하여 인스턴스를 반환한다.
     return new Circle(radius);
   }

   this.radius = radius;
   this.getDiameter = function () {
     return 2 * this.radius;
   }
 }

// new 연산자 없이 생성자 함수를 호출하여도 생성자 함수로서 호출된다.
const c1 = Circle(5);
console.log(c1.getDiameter()); // 10
 ```

    • 2. new.target


  • ES 6はnew演算子なしでコンストラクション関数を呼び出すことを防止するためにnewする.target構文をサポートします.
    new.targetは、コンストラクション関数としてのすべての関数の内部でデフォルトの領域変数とともに使用され、メタプログラムと呼ばれます.

  • new演算子とともにコンストラクション関数として呼び出される場合、関数内部のnew.targetとは함수 자신を指す.new演算子のない一般関数で呼び出される関数内部new.targetはundefinedです.

  • したがって,関数内部ではnew.targetを使用して、コンストラクション関数として呼び出されるかどうかを確認します.そうしないと、new演算子とともに、コンストラクション関数として再帰的に呼び出されます.
    // 생성자 함수
function Circle(radius) {
  // 해당 함수가 new 연산자와 함께 호출되었다면 new.target은 함수 자신인 Circle을 바인딩한다.
  // 이 함수가 new 연산자와 함께 호출되지 않았다면 new.target은 undefined이다.
  if (!new.target) {
    // new 연산자와 함께 생성자 함수를 재귀 호출하여 생성된 인스턴스를 반환한다.
    return new Circle(radius);
  }
  this.radius = radius;
  this.getDiameter = function () {
    return 2 * this.radius;
  };
}

// new 연산자 없이 생성자 함수를 호출하여도 new.target을 통해 생성자 함수로서 (재귀)호출된다.
const c1 = Circle(5);
console.log(c1.getDiameter()); // 10
    • (docs)
  • モダンJavaScript Deep Dive 17:コンストラクション関数によるオブジェクトの作成
    • C言語5
    [Spring入門]第4週06章