ES 6-オブジェクト向け+継承法

ES 6にはclass,extendsキーワードが新たに追加され,これらはオブジェクト向けおよび継承を容易かつ規範的に実現できる.この新しい実装方法はjavaとよく似ており、javaを学んだパートナーは簡単に受け入れられるように見えます.では、例を直接見てみましょう
1.class
まず、クラスを作成する方法を見てみましょう.

以前の表記

function User(id,name){
			this.id=id;
			this.name=name;
		}
		//       
		User.prototype.showId=function(){
			console.log('id='+this.id);
		}
		User.prototype.showName=function(){
			console.log('name='+this.name);
		}
		//      
		let user1 = new User('123456','   ');
		user1.showId();   //id=123456
		user1.showName(); //name=   

ここではUser構造関数を作成し,idとnameを示す方法を追加した.このような構造は比較的散乱しており、属性や方法は構造的に1つに書かれていないので、そんなに紛失しているように見えます(ここで見てもいいですが、継承を実現するときは本当に散乱しています.以下に挙げます)

書き方

	class User{
			//     
			constructor(id,name){
				this.id=id;
				this.name=name;
			}
			showId(){
				console.log('id='+this.id);
			}
			showName(){
				console.log('name='+this.name);
			}
		}

		let user1 = new User('123456','   ');
		user1.showId();   //id=123456
		user1.showName(); //name=   

ほら、簡潔にしましょう.classキーワードで直接クラスを定義します.属性と方法はclassの括弧の中にあります.ここのconstructor(){...}は、コンストラクション関数を表し、プロパティを初期化します.その後、このような方法を直接以下に追加すれば、functionName(){...}の間に記号を区切る必要はありません.これは固定的な書き方です.
2.extends
同様に、継承を実現する前に

以前の表記(組合せ継承)

		//  
		function User(id,name){
			this.id=id;
			this.name=name;
		}
		User.prototype.showId=function(){
			console.log('id='+this.id);
		}
		User.prototype.showName=function(){
			console.log('name='+this.name);
		}

		//   
		function VIPuser(id,name,level){
			//         
			User.call(this,id,name);
			this.level=level;
		}
		//             
		VIPuser.prototype=new User();
		//    
		VIPuser.prototype.constructor=VIPuser;
		
		//         
		VIPuser.prototype.showLv=function(){
			console.log('Lv='+this.level);
		}

		let vip1=new VIPuser('123456','   vip',99);
		vip1.showId();    //id=123456
		vip1.showName();  //name=   vip
		vip1.showLv();    //Lv=99

ここではVIPuserクラスを新規作成し、Userクラスに継承し、vipレベルレベルレベル属性と独自のメソッドを追加します.まず、サブクラスの継承を見てみましょう.

//         
User.call(this,id,name);

親クラスのコンストラクション関数を一度実行させ、現在の指向を子クラスのインスタンスに変換します

親クラスのインスタンスを子クラスのプロトタイプに割り当てる

そして新サブクラスconstructorの指向、

最後に自分の方法を追加しました.

これは本当に煩わしいので、ES 6の書き方を見てみましょう.

書き方

	  //  
	  class User{
			//     
			constructor(id,name){
				this.id=id;
				this.name=name;
			}
			showId(){
				console.log('id='+this.id);
			}
			showName(){
				console.log('name='+this.name);
			}
		}

		//  
		class VIPuser extends User{
			constructor(id,name,level){
				super(id,name);
				this.level=level;
			}
			showLv(){
				console.log('Lv='+this.level);
			}
		}

		let vip1=new VIPuser('123456','   vip',99);
		vip1.showId();    //id=123456
		vip1.showName();  //name=   vip
		vip1.showLv();    //Lv=99

肝心なのはここにある

	class VIPuser extends User{
			constructor(id,name,level){
				super(id,name);
				//      
				this.level=level;
			}
			showLv(){
				console.log('Lv='+this.level);
			}
		}

簡潔明瞭!新しいクラスを作成して、誰が直接extendsの親クラスを継承したいのか、カッコの中にはconstructor(){...}コンストラクション関数がありますが、ここで注意してください.コンストラクション関数に入るにはまずsuper(id,name);superはスーパークラスを表し、ここではjavaの書き方と同じです.まず親の属性を継承します(以前の書き方とUser.call(this,id,name);機能は同じです)、親の属性を取ってから自分の新しい方法を追加することができます.
新しいclass、extendsは本当にとても強くて使いやすくて、コードも楽に見えます