ES6：class类

ES6引入Class（类）。

绝大部分功能ES5能实现，新的class写法只是让对象原型的写法更加清晰、更像面向对象编程的语法。

实例化对象

ES5写法：

// 创建一个Phone类，设定初始化值（属性） 
function Phone(brand, price){   
    this.brand = brand;   
    this.price = price; 
}
// 设置类的方法 
Phone.prototype.callPhone = function(){   
    console.log('callPhone： 打电话'); 
} 
// 实例化对象 
let xiaomi = new Phone('小米', 2999); 
console.log(xiaomi); 
xiaomi.callPhone();

ES6写法：

class Phone{  // 类（对象）    
// 构造方法，通过关键字new实例化时会马上调用constructor方法  
constructor(brand, price) { // 并非必须要有     
    // 添加属性     
    this.brand = brand;     
    this.price = price;   
}   
    // 添加方法，必须使用该语法，不能使用ES5的对象完整形式callPhone: function(){}   callPhone() {     callPhone() {     
        console.log('callPhone： 打电话');  
    }  
  } 
} 

let huawei = new Phone('华为', 1999);
console.log('huawei', huawei); 
huawei.callPhone();

静态成员

ES5写法：

function Phone(){ } 
// 静态成员：属于Phone函数对象，不属于实例对象，函数对象和实例对象不相通 
Phone.name = '手机' 
Phone.change = function() {   
    console.log('change'); 
} 
Phone.prototype.size = '1inch'  // 实例对象和Phone函数对象的原型相通 
let nokia = new Phone(); 
console.log('nokia', nokia);

ES6写法：

class Phone{  
    static name = '手机'; // 静态成员，只属于Phone对象，不属于实例对象   
    static change() {     
        console.log('手机：change');   
    } 
} 
let  huawei = new Phone(); 
console.log('huawei', huawei.name); 
console.log('Phone', Phone.name);

继承

ES5实现：

function Phone(brand, price){
    this.brand = brand;
    this.price = price; 
} 
Phone.prototype.callPhone = function(){
    console.log('callPhone： 打电话'); 
} 
// 继承 
function SmartPhone(brand, price, size){   
    Phone.call(this, brand, price);   // 把Phone函数对象指向SmartPhone并继承brand、price   
    this.size = size; 
} 
// 设置子级构造函数的原型 
SmartPhone.prototype = new Phone; 
SmartPhone.prototype.constructor = SmartPhone; 
// 设置方法 
SmartPhone.prototype.takephoto = function(){   
    console.log('takephone'); 
} 
const chuizi = new SmartPhone('锤子', '599', '6inch') 
console.log(chuizi);

ES6实现：

class Phone{  // 类（对象）    
    // 构造方法，通过关键字new实例化时会马上调用constructor方法   
    constructor(brand, price) {     // 添加属性     
        this.brand = brand;     
        this.price = price;   
    }   
    // 添加方法，必须使用该语法，不能使用ES5的对象完整形式
    callPhone() {     
        console.log('callPhone： 打电话');  
    } 
} 
// 子类通过extends关键字继承 
class SmartPhone extends Phone{   
    constructor(brand, price, size){     
    // 子类调父类的构造方法实现初始化，相当于ES5：Phone.call(this, brand, price);     super(brand, price);     
    this.size = size;   
}   
    takePhoto(){     
    console.log('takephoto');   
    } 
    // 子类修改与父类的同名方法，只能重写 
    callPhone(){ 
    console.log('重写callphone') 
    } 
} 
let huawei = new SmartPhone('华为', '655', '7inch'); 
console.log('huawei', huawei);

class中getter和setter设置

class Phone{ 
    get price(){ 
        console.log('价格被获取'); 
        return '1999' // 需要返回一个值，否则值为undefined 
    } 
    set price(val){ // 需要设置一个值 
        console.log('价格被设置') 
    } 
} 
let phone1 = new Phone(); 
console.log(phone1.price) // 调用get方法，打印：价格被获取 1999 
phone1.price = 2999;  // 设置pirce值，打印：价格被设置 2999