class类

es6之前的

function Point(x,y){
    this.x=x;
    this.y=y
}
Point.prototype.getPostion=function(){
    return '('+this.x+','+this.y+')'
}
var p1=new Point(2,3)
conosle.log(p1)//输出Point{x:2,y:3}
console.log(p1.getPostion())//输出(2,3)

new的操作过程可以理解为：

（1）创建一个新对象

（2）将构造函数的作用域赋给新对象（this指向该新对象）

（3）执行构造函数中的代码（为新对象添加属性）

（4）返回新对象

代码可以理解成如下

let p1={}
p1.__proto__=Point.prototype
Point.call(p1)

es6

class Point{
    constructor(x,y){
        this.x=x;
        this.y=y
    }
    getPostion(){
        return `(${this.x},${this.y})`
    }
}
//hasOwnProperty判断是不是属于p1的原有的属性
const p1=new Point(1,2)
console.log(p1)//输出Point{x:1,y:2}
conosle.log(p1.hasOwnProperty('x'))//true
console.log(p1.hasOwnProperty('getPostion'))//false，是继承Point
console.log(p1.__proto__.hasOwnProperty('getPostion'))//true

get(访问触发)和set(修改触发)

es5
var info={
    _age:18,
    set age(newvalue){
        if(newvalue>18){
            console.log('怎么变老了')
        }else{
            console.log('哈哈我还年轻')
        }
    },
    get age(){
        console.log('你问我年龄干嘛')
        return this._age
    }
}
console.log(info.age)//输出:你问我年龄干嘛
info.age=17//输出:哈哈我还年轻
info.age=19//输出:怎么变老了

es6
class Info{
    constructor(age){
        this._age=age
    }
    set age(newage){
        console.log('new age is:'+newage)
        this._age=newage
    }
    get age(){
        return this._age
    }
}
const infos=new Info(18)
infos.age=17//输出:new age is:17
console.log(infos.age)//输出:17

静态方法（static）

class Point{
    constructor(x,y){
        this.x=x;
        this.y=y
    }
    getPostion(){
        return `(${this.x},${this.y})`
    }
    static getclassname(){
        return Point.name
    }
}
const p=new Point(1,2)
console.log(p.getPosition())
console.log(p.getclassname())//报错，static静态方法不能被实例继承
console.log(Point.getclassname())//调用成功，输出:Point

new target(输出实例化的类)

class Point{
    constructor(){
        conosle.log(new.target)
    }
}
const p3=new Point()//输出
class Point{
    constructor(){
        conosle.log(new.target)
    }
}
class Child extends Point{
    constructor(){
        super()
    }
}
const c=new Child()//输出
class Child extends Point{
    constructor(){
        super()
    }
}

继承

es5
function Food(){
    this.type='food'
}
Food.prototype.getType=function(){
    return this.type
}
function Vegetables (name){
    this.name=name
}
Vegetables.prototype=new Food()
const tomato=new Vegetables('tomato')


es6
class Parent{
    constructor(name){
        this.name=name
    }
    getName(){
        return this.name
    }
    static getcalss(){
        return this.name
    }
}
class Child extends Parent{
    constructor(name,age){
        super(name)
        this.age=age
    }
}
const c=new Child('lison',18)
console.log(c instanceof Child)//true，继承了父类的实例，所以c既是child的实例，也是parent的实例，static静态方法也继承
console.log(c instanceof Parent)//true

super

作为函数调用：

子类必须调用super，子类中的super相当于父类的constructor，此时的this指的是子类

作为对象调用：

在普通方法中，指的是父类的原型对象(prototype)

在静态方法中（static）,指的是父类本身

class Parent {
    constructor(){
        this.type='parent'
    }
    getName(){//原型对象中
        return this.type
    }
}
Parent.getType=()=>{//本身
    return 'is parent'
}
class Child extends Parent{
    constructor(){
        super()
        console.log('constructor:'+super.getName())
    }
    getParentName(){
        conosle.log('getParentName:'+super.getName())
    }
     getclass(){
        conosle.log('getParentName:'+super.getType())
    }
     static getsclass(){
        conosle.log('getParentName:'+super.getType())
    }
}
const c=new Child()
c.getParentName()//输出：parent
c.getclass()//报错
Child.getsclass()//输出：is parent