JS高级ES6的6种继承方式

function ParentClass() {
  this.name = '一碗周'
}
ParentClass.prototype.getName = function () {
  return this.name
}

// 定义子类，将来用于继承父类
function ChildClass() {}

// * 将子类的原型指向父类的实例化，子类拥有父类实例化后的内容
ChildClass.prototype = new ParentClass()

// 将子类进行实例化
var child = new ChildClass()

console.log(child.getName()) // 一碗周

function ParentClass() {
  this.colors = ['red', 'blue', 'green']
}
function ChildClass() {}

ChildClass.prototype = new ParentClass()

var child1 = new ChildClass()
var child2 = new ChildClass()
console.log(child1.colors) // [ 'red', 'blue', 'green' ]

child2.colors.push('black')
console.log(child2.colors) // [ 'red', 'blue', 'green', 'black' ]

console.log(child1.colors) // [ 'red', 'blue', 'green', 'black' ]

function Parent() {
  // 父级对象

  this.parent = 'parent'
}

Parent.prototype.name = '一碗周' // 为 Parent 父级对象的原型增加属性

function Child() {
  // 子级对象

  this.child = 'child'

  Parent.call(this) // 使用 call() 或者 apply() 方法调用父级构造函数 实现继承。
}

const child = new Child()

console.log(child)

console.log(child.name) // undefined     // 不会继承父类的原型

// 父级对象
function Parent() {
  this.parent = 'parent'
}
// 为 Parent 父级对象的原型增加属性
Parent.prototype.name = '一碗周'
// 子级对象
function Child() {
  this.child = 'child'
  // 使用 call() 或者 apply() 方法调用父级构造函数 实现继承。
  Parent.call(this)
}
// 解决不会继承构造函数的原型对象的问题
Child.prototype = Parent.prototype

const child = new Child()
console.log(child.name) // 一碗周

var person = {
  name: '一碗周',
  friends: ['张三', '李四', '王五'],
}

var anotherPerson = Object.create(person)
anotherPerson.name = '一碗甜'
anotherPerson.friends.push('赵六')

console.log(person.friends) // [ '张三', '李四', '王五', '赵六' ]

var person = {
  name: '一碗周',
  friends: ['张三', '李四', '王五'],
}

function createAnother(original) {
  var clone = Object.create(original) // 通过调用 object() 函数创建一个新对象
  clone.sayMe = function () {
    // 以某种方式来增强对象
  }
  return clone // 返回这个对象
}

var anotherPerson = createAnother(person)
anotherPerson.sayMe()

function inheritPrototype(ChildClass, ParentClass) {
  var prototype = Object.create(ParentClass.prototype) // 创建对象，创建父类原型的一个副本
  // 修改创建的父类原型副本的 constructor 并将子类的 prototype 指向这个类，形成与父类无关联的类
  prototype.constructor = ChildClass
  ChildClass.prototype = prototype
}

// 父类初始化实例属性和原型属性
function ParentClass(name) {
  this.name = name
  this.colors = ['red', 'blue', 'green']
}
ParentClass.prototype.sayName = function () {
  console.log(this.name)
}

// 借用构造函数传递增强子类实例属性（支持传参和避免篡改）
function ChildClass(name, age) {
  // 拷贝父类所有自有属性
  ParentClass.call(this, name)
  this.age = age
}

// 将父类原型指向子类
inheritPrototype(ChildClass, ParentClass)

// 新增子类原型属性
ChildClass.prototype.sayAge = function () {
  console.log(this.age)
}

var instance1 = new ChildClass('一碗周', 19)
var instance2 = new ChildClass('一碗甜', 18)

instance1.colors.push('black')
console.log(instance1.colors) // [ 'red', 'blue', 'green', 'black' ]
instance1.sayName() // 一碗周
instance2.colors.push('yellow')
console.log(instance2.colors) // [ 'red', 'blue', 'green', 'yellow' ]