JavaScript は new.target 属性と es5 に基づいて es6 クラス構文を変換します

以下のエディターは、new.target 属性と es5 に基づいて es6 クラスの構文を変換する、js es6 シリーズのチュートリアルを提供します。編集者はこれがとても良いと思ったので、参考として共有します。エディターに従って見てみましょう。es5 のコンストラクターが以前に new で呼び出されず、this がウィンドウを指している場合、オブジェクトのプロパティは値を取得できません。そのため、以前はこれが new を使用しているかどうかを判断する必要がありました。通常の関数呼び出しでオブジェクトをプロパティにコピーできるようにするためのコンストラクター内のキーワードです

​​

function Person( uName ){
  if ( this instanceof Person ) {
   this.userName = uName;
  }else {
   return new Person( uName );
  }
 }
 Person.prototype.showUserName = function(){
  return this.userName;
 }
 console.log( Person( 'ghostwu' ).showUserName() );
 console.log( new Person( 'ghostwu' ).showUserName() );

es6 では、関数の呼び出し時に new キーワードが使用されるかどうかを識別するために、新しい属性 new.target:

が使用されます。導入されました

1. 関数が new を使用する場合、new.target はコンストラクターです

2. 関数が new を使用しない場合、new.target は未定義です

3. es6 クラスのメソッドでは、呼び出し時に new を使用します。 , new .target はクラス自体を指します。 new を使用しない場合、それは未定義になります

function Person( uName ){
   if( new.target !== undefined ){
    this.userName = uName;
   }else {
    throw new Error( '必须用new实例化' );
   }
  }
  // Person( 'ghostwu' ); //报错
  console.log( new Person( 'ghostwu' ).userName ); //ghostwu

new を使用した後、new.target は person のコンストラクターになります。すると、上記の例は次のように書くこともできます。 :

上記の例では、newを使用する場合、new.targetはpersonに等しいです

new.targetをマスターしたら、次はes5の構文を使用して上記のes6クラスの構文を書き換えます

function Person( uName ){
   if ( new.target === Person ) {
    this.userName = uName;
   }else {
    throw new Error( '必须用new实例化' );
   }
  }
  
  // Person( 'ghostwu' ); //报错
  console.log( new Person( 'ghostwu' ).userName ); //ghostwu

以上がJavaScript は new.target 属性と es5 に基づいて es6 クラス構文を変換しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。