Home  >  Article  >  Web Front-end  >  What is the difference between the constructors of es6 and es5

What is the difference between the constructors of es6 and es5

WBOY
WBOYOriginal
2022-04-25 17:48:012360browse

Difference: 1. The variables of the class in the es6 constructor will not be promoted, that is, the object can only be created after the definition of the class, while declaring the constructor in es5 will raise the variables; 2. This is not possible in es6 Call the constructor directly. In es5, you can call the constructor directly and use the constructor as an ordinary function.

What is the difference between the constructors of es6 and es5

The operating environment of this tutorial: Windows 10 system, ECMAScript version 6.0, Dell G3 computer.

What is the difference between the constructors of es6 and es5

Use the constructor to construct reusable objects
The constructor is the function you construct. It is a special method. There is a qualitative difference between ordinary functions. Their function is mainly used to initialize the object when creating an object, which is to assign initial values ​​to the object members. The main features of the constructor are the method name, the first letter is capitalized, and new is used

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 can use new to generate objects, or you can directly call the constructor and use it as an ordinary function. For example, function foo();

2. ES6 must use new to generate objects, and you cannot directly call the constructor to use it as a normal function.

Unlike ES5, class variables will not be promoted, which means that objects can only be created after the class is defined.

Class calls must use new, and ordinary constructors can be used as ordinary functions.

【Related recommendations: javascript video tutorial, web front-end

The above is the detailed content of What is the difference between the constructors of es6 and es5. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn