ホームページ > ウェブフロントエンド > フロントエンドQ&A > es6 と es5 のコンストラクターの違いは何ですか

es6 と es5 のコンストラクターの違いは何ですか

WBOY
リリース: 2022-04-25 18:09:15
オリジナル
2379 人が閲覧しました

違い: 1. es6 コンストラクター内のクラスの変数はプロモートされません。つまり、オブジェクトはクラスの定義後にのみ作成できますが、es5 でコンストラクターを宣言すると変数が生成されます。 ; 2. es6ではできない コンストラクタを直接呼び出す. es5ではコンストラクタを直接呼び出して、通常の関数として利用することができます。

es6 と es5 のコンストラクターの違いは何ですか

このチュートリアルの動作環境: Windows 10 システム、ECMAScript バージョン 6.0、Dell G3 コンピューター。

es6 と es5 のコンストラクターの違いは何ですか。

コンストラクターを使用して再利用可能なオブジェクトを構築します。
コンストラクターは、構築する関数です。特別なメソッドです。通常の関数との質的な違い. これらの関数は主にオブジェクト作成時にオブジェクトを初期化するために使用されます, つまり、オブジェクトのメンバーに初期値を割り当てます. コンストラクターの主な特徴は、メソッド名、最初の文字が大文字であること、

ES5

function foo(){
	this.name = 'Katherine';
	this.age  = '26';
}
var f = new foo();
console.log(f)		//Object
console.log(f.name)	//Katherine
console.log(f.age)  //26

function foos(name,age,sex){
	this.name = name;
	this.age  = age;
	this.sex  = sex;
}
var f1 = new foos('Kathrine', '26', 'female');
var f2 = new foos('Stefan', '27', 'male');
var f3 = new foos('Damon', '29', 'male');
console.log(f1) //foos {name: "Kathrine", age: "26", sex: "female"}
console.log(f2) //foos {name: "Stefan", age: "27", sex: "male"}
console.log(f3) //foos {name: "Damon", age: "29", sex: "male"}
ログイン後にコピー

ES6

class foo{
	constructor(){
		this.name = 'Karherine';
		this.age  = '26';
	}
	vampire(va){
		console.log('Her name is '+this.name+' and she was '+this.age+' years old')
	}
}
let f = new foo()
	f.vampire();  //Her name is Karherine and she was 26 years old
//继承原型	
class foos extends foo{
	constructor(){
		super();
		this.name = 'Stefan';
		this.age  = '27';
	}
}	
let f1 = new foos();
	f1.vampire();  //His name is Stefan and he was 27 years old
ログイン後にコピー

1. ES5 では new を使用してオブジェクトを生成することも、コンストラクターを直接呼び出して次のように使用することもできます。普通の関数。たとえば、関数 foo();

2。ES6 ではオブジェクトの生成に new を使用する必要があり、コンストラクターを直接呼び出して通常の関数として使用することはできません。

ES5 とは異なり、クラス変数はプロモートされません。つまり、オブジェクトはクラスが定義された後にのみ作成できます。

クラス呼び出しでは new を使用する必要があり、通常のコンストラクターは通常の関数として使用できます。

【関連する推奨事項: JavaScript ビデオ チュートリアル Web フロントエンド ]

以上がes6 と es5 のコンストラクターの違いは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
es6
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート