ES6 中的构造函数和ES5中的构造函数语法

359 阅读1分钟

ES5构造函数

function Person( name ,age){
    this.name = name;
    this.age = age;
}
//向构造函数原型中添加一个方法
Person.prototype.fun = function(){
    console.log(this.name, this.age);
}
//使用构造函数创建一个实例化对象
var xm = new Person('小明' , 18);
xm.fun();
//向控制台输出xm这个对象
console.log(xm);
    

输出结果为


ES6构造函数

class Person{
    constructor(name , age) {
        this.name = name;
        thsi.age = age;
    }
    fun(){
        console.log(this.name , this.age);
    }
}
var xm = new Person('小明' , 18);
xm.fun();
console.log(xm);

输出结果


ES6中使用了class(类)这个概念作为对象的模板,通过constructor()这个构造方法来添加属性,并且类的方法除了constructor()之外都定义在prototype对象上,所以在ES6中构造函数添加方法不需要在通过prototype来进行添加,可以直接写在class(类)中

区别:

与ES5不同,类的变量不会被提升,也就是说对象只能在类的定义之后才能创建。

类的调用必须要使用new,而普通的构造函数可以当作普通函数来使用。

共同点:

两者在new一个新对象时都会默认生成一个constructor,并且该属性都指向构造函数。

ES5和ES6生成对象的__proto__都是指向构造函数的prototype对象

以上便是对ES6构造函数和ES5构造函数对比的一点理解,欢迎指正^_^