第3章ES 6類(Class)使用

2441 ワード

ターゲット
  • Class基本構文
  • constructorメソッド
  • クラスのインスタンスオブジェクト
    1、Class基本文法js伝統的に新しいオブジェクトを作成する方法
        
            function Point(x, y) {
              this.x = x;
              this.y = y;
            }
            Point.prototype.toString = function () {
              return '(' + this.x + ', ' + this.y + ')';
            };
            var p = new Point(1, 2);
            console.log(p.toString());
    
        
    

    ES 6は伝統的な言語に近い書き方を提供しています.Class(クラス)という概念を導入し、オブジェクトのテンプレートとして使用した.classキーワードにより、クラスを定義することができる.基本的には、ES 6のclassは単なるシンタックスキャンディと見なすことができ、そのほとんどの機能は、ES 5が可能であり、新しいclass書き方は、オブジェクトの原型の書き方をより明確にし、オブジェクト向けにプログラミングされた文法に似ているだけである.上のコードはES 6の「クラス」書き換えは、次のようになります.
    
        class Point{
            constructor(x,y) {
                this.x=x;
                this.y=y;
            }
            toString(){
                return '(' + this.x + ', ' + this.y + ')';
            }
        }
        var p1=new Point(120.3,40.1);
        alert(p1.toString());
    
    

    説明:上記のコードは「クラス」を定義しており、コンストラクションメソッドが表示されます.これがコンストラクションメソッドですが、thisキーワードはインスタンスオブジェクトを表します.すなわち,ES 5のコンストラクション関数Pointは,ES 6のPointクラスに対応するコンストラクションメソッドPointクラスがコンストラクションメソッドに加えてtoStringメソッドを定義している.注意、「クラス」を定義する方法は、前にfunctionというキーワードを付ける必要がなく、直接関数定義を入れればいいのです.また、メソッド間のカンマ区切りは不要で、加算するとエラーが表示されます
    constructor 1、constructorメソッドはクラスの構造関数であり、newコマンドでオブジェクトインスタンスを作成すると自動的に呼び出されるデフォルトのメソッドです.上記の例2、クラスにはconstructorメソッドが必要です.明示的に定義されていない場合、デフォルトのconsructorメソッドがデフォルトで追加されます.コンストラクション関数を追加しなくても、デフォルトのコンストラクション関数があります.
     constructor( ){}
    

    3、一般的なconstructorメソッドはインスタンスオブジェクトthisを返しますが、constructorメソッドはクラスのインスタンスではないインスタンスを返す新しいオブジェクトを返すように指定することもできます.1つのクラスに別のクラスが作成されたことに相当します
    
        class Cat{
            
        }
        class Dog{
            constructor() {
              return new Cat();
            }
            
        }
        var dog=new Dog();
        alert(dog instanceof Dog);//false
    
    

    クラスのコンストラクション関数は、newを使用しないと呼び出せません.エラーが発生します.これは通常の関数との主な違いであり、通常の関数はnewを使わなくても実行できます.
    クラスのインスタンスオブジェクト生成クラスのインスタンスオブジェクトの書き方は,ES 5と全く同様にnewコマンドを用いる.newを付け忘れた場合、関数のようにClassを呼び出すとエラーが発生します
        var p1=new Point(120.3,40.1);//  
        var p2=Point(120.3,40.1);//  
    

    作者:wqjcarnationリンク:https://www.jianshu.com/p/00b0a42d8762出典:著作権は作者の所有である.商業転載は著者に連絡して許可を得てください.非商業転載は出典を明記してください.