Es6中关于Set新特性的应用练习（ES5和ES6实现继承的区别）

ES5 和 ES6 继承的实现以及区别

在ES5中当我们一个构造函数要使用另一个构造函数的属性或者方法，我们通常改变构造函数原型的指向，变成另外一个构造函数的实例对象。

例如：

ES5中我们通常这样去实现继承

// 定义一个Phone的类，其中包括brand，price两个属性 
function Phone(brand, price) {
      this.brand = brand
      this.price = price
    }
	// 在Phone的原型上我们添加一个自己本身手机共有的功能，call
    Phone.prototype.call = function () {
      console.log('我可以打电话')
    }
	// 又定义一个SmartPhone类，里面我们需要使用Phone的本身有的属性brand，跟price
    function SmartPhone(brand, price, color, size) {
      Phone.call(this, brand, price) //通过call 的方式 改变this的指向，这里的this就是SmartPhone的实例了，所以在											//SmartPhone的实例上面也都有了Phone里面的brand跟price属性了
      this.color = color
      this.size = size
    }

    SmartPhone.prototype = new Phone() // 改变SmartPhone的原型
    SmartPhone.prototype.constructor = SmartPhone
    SmartPhone.prototype.music = function () {
      console.log('我可以听歌')
    }
    SmartPhone.prototype.photo = function () {
      console.log('我可以拍照')
    }

    const xiaomi = new SmartPhone('xiaomi', 4999, 'red', '4.9')
    console.log(xiaomi)

用ES新增的Class 的方式我们试着将代码重写一遍。。。。。，感受一下变化

class Phone {
      constructor(brand, price) {
        this.brand = brand
        this.price = price
      }
      call() {
        console.log('我可以打电话')
      }
    }

    class SmartPhone extends Phone {
      constructor(brand, price, color, size) {
        super(brand, price) // 这里相当于ES中的Phone.call(this,brand,price)
        this.color = color
        this.size = size
      }

      music() {
        console.log('我可以听音乐')
      }
      Photo() {
        console.log('我可以拍照')
      }
    }

    const onPlus = new SmartPhone('1+', 2999, 'black', '5.2')
    console.log(onPlus)