温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

es6与es5的构造函数有哪些区别

发布时间:2022-04-26 10:05:41 来源:亿速云 阅读:183 作者:zzz 栏目:web开发

这篇文章主要介绍“es6与es5的构造函数有哪些区别”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“es6与es5的构造函数有哪些区别”文章能帮助大家解决问题。

区别:1、es6构造函数中类的变量不会被提升,也就是对象只能在类的定义之后才能创建,而es5中声明构造函数会变量提升;2、es6不可以直接调用构造函数,es5中可以直接调用构造函数,将构造函数当成普通函数使用。

本教程操作环境:windows10系统、ECMAScript 6.0版、Dell G3电脑。

es6与es5的构造函数有什么区别

使用构造函数构造可以复用的对象
构造函数就是你构造出来的函数,是一种特殊的方法,与普通函数有着质的区别,其作用,在创建对象的时候主要用来初始化对象,就是给对象成员赋初始值,构造函数的主要特征就是方法名、首字母大写,并且用new来使用

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,而普通的构造函数可以当作普通函数来使用。

关于“es6与es5的构造函数有哪些区别”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识,可以关注亿速云行业资讯频道,小编每天都会为大家更新不同的知识点。

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI