JavaScript：js继承有几种，你了解吗？

• 原型链继承

Proson方法通过new的方式赋值给Chid原型链从而继承原型链的方法以及属性

// 原型链继承
function Proson() {
  this.name = '小美'
  this.age = 18
}

Proson.prototype.getProson = function () {
  console.log(this.name, );
}

function Chid() {

}
Chid.prototype = new Proson()
let demo = new Chid()
demo.getProson() //小美

• 构造函数继承

只能继承普通方法及属性，不能继承原型链的属性方法,每创建一个新的实例都会去调用一次父级Proson方法（可优化）

function Proson() {
  this.name = '小美'
  this.age = 18
  console.log(this); //Chid {name: "小美", age: 18}
}

// 通过call把Proson的指向改到Chid
function Chid(name, age) {
  Proson.call(this)
  this.name = name || this.name
  this.age = age || this.age
}
let demo = new Chid('孙悟空')
console.log(demo); //Chid {name: "孙悟空", age: 18}

• 组合继承

通过原型链继承和构造函数继承达到方法的复用，以及新引入的每一个实例都是私有的

function Proson() {
  this.name = '小美'
  this.age = 18
}

Proson.prototype.getProson = function () {
  console.log(this.name);
}

function Chid(name, age) {
  //此时Proson的this指向Chid
  Proson.call(this)
  this.name = name || this.name
  this.age = age || this.age
}
// 把Proson方法通过new的方式赋值给Chid原型链从而继承原型链的方法以及属性
Chid.prototype = new Proson()
let demo = new Chid('孙悟空')
demo.getProson() //孙悟空

• 原型式继承

Proson通过传入一个对象，把对象赋值到Fn方法的原型链上面，可添加任意的属性方法,但是每一个实例都会继承Proson的原型属性

function Proson(obj) {
  function Fn() {}
  Fn.prototype = obj
  return new Fn()
}
const obj = {
  name: '夏美',
  age: 19,
  getFn: function () {
    console.log('this=>', this);
  },
  arr: ['搜索', '查询']
}

let demo = Proson(obj)
demo.getFn()
let demo2 = Proson(obj)
demo2.arr.push('修改') //原型属性共享，demo.arr也会有修改这个值
console.log(demo2, demo);

• 寄生式继承

Child通过传入一个对象，通过Object.create创建一个新对象,新对象可以继承传入对象的属性方法

function Child(parameterObj) {
  let _obj = Object.create(parameterObj)
  obj.getName = function () {
    console.log('getName:this=>', this) //this指向一个创建后的对象_obj,_obj继承传入的parameterObj属性方法
    this.arr.push('修改')
  }
  return _obj
}
const obj = {
  name: '夏美',
  age: 19,
  getFn: function () {
    console.log('getFn:this=>', this);
  },
  arr: ['搜索', '查询']
}
const demo = new Child(obj)

• 寄生式组合继承

核心概要：proTo作为中间纽扣，传入两个方法，把第fnCre的原型通过Object.create继承给obj，再把obj赋值给fn.prototype参数，使得原型链的方法能继承，并且通过new创建的对象不管几次，而proTo方法只调用了一次父级

function Proson(name) {
  this.name = name
  this.age = 18
}

Proson.prototype.getFn = function () {
  console.log('getFn:this=>', this);
}
// 通过apply改变Child的this指向
function Child(name, age) {
  Proson.apply(this, [name])
  this.name = name || this.name
  this.age = age || this.age
}

function proTo(fn, fnCre) {
  let obj = Object.create(fnCre.prototype)
  fn.prototype = obj
}
proTo(Child, Proson)
const demo = new Child('小美')
demo.getFn()

• Object.create

Object.create:接受两个参数都是非必传的：
1、接受一个对象，对象的方法属性都继承到新对象；
2、新对象可以指定有哪一些属性及方法

const obj = {
  name: '夏美',
  age: 19,
  getFn: function () {
    console.log('this=>', this);
  },
  arr: ['搜索', '查询']
}
// 第二个参数指定属性：sex,setName
const demo = Object.create(obj, {
  sex: {
    value: '女'
  },
  setName: {
    value: function (name) {
      this.name = name
      console.log(this);
    }
  }
})
console.log(demo); //{sex: "女", setName: ƒ}