class和普通构造函数区别

js构造函数


function MathHandle(x,y){
    this.x=x;
    this.y=y;
   }
   MathHandle.prototype.add = function() {
         return this.x+this.y;// body...
   };
   var m=new MathHandle(1,2);
   console.log(m.add());//3

class语法

class MathHandle{
    constructor(x,y){
        this.x=x;
        this.y=y;
    }
    add(){ return this.x+this.y;}
   }
   const m=new MathHandle(1,2);
   console.log(m.add());

语法糖


typeof MathHandle//'function'
MathHandle === MathHandle.prototype.constructor//true
m.__proto__ === MathHandle.prototype//true

继承-js

function Animal(){
    this.eat=function(){
        console.log("Animal eat");
    }
}
function Dog(){
    this.bark=function(){
        console.log("Dog bark");
    }
}
Dog.prototype=new Animal();
var a=new Dog();
a.bark();
a.eat();

继承-class

class Animal{
    constructor(name){
        this.name=name
    }
    eat(){
        console.log(this.name +'eat');
    }
}
class Dog extends Animal{
    constructor(name){
        super(name)//访问和调用Dog对象的父对象Animal上的函数。
        this.name=name// 在派生类中, 必须先调用 super() 才能使用 "this",忽略这个,将会导致一个引用错误。
    }
    bark(){
        console.log(this.name+'bark');
    }
}
const dog=new Dog("泰迪");
dog.eat();
dog.bark();

区别:

class在语法上更加贴合面向对象的写法

class实现继承更加容易理解,更易于后端语言使用

本质是语法糖,使用prototype

你可能感兴趣的:(ES6)