Как реализован класс Es6?

ECMAScript 6

В Es5 нет понятия классов.Прежде чем ставить классы, надо сначала поговорить о наследовании классов

наследование классов

Классы имеют три свойства: общедоступные свойства, частные свойства, статические свойства (Es7)/статические классы (Es6).

Как реализовать класс

  • Наследовать общедоступные свойства
function Parent(){
    this.name = 'parent';
}
new Parent();//this指向当前实例
Parent() //this指向window
function Child(){
    this.age = 9;
    Parent.call(this);//相当于this.name = 'parent'  //继承私有属性
}
  • Наследовать свойства родительского класса
    • Строго говоря, подчеркнутая общая спецификация называется частной.Даже если она унаследована, частные свойства класса не будут наследоваться.Частными свойствами являются только те свойства, к которым могут обращаться внутренние методы класса.继承私有属性изменить на继承父类属性, приношу извинения за доставленные вам недоразумения и неприятности Комментарии приветствуются, если статья неверна, спасибо! Спасибо @MrTreasure!
function Parent(){
    this.name = 'parent';
}
Parent.prototype.eat = function(){
    console.log('eat')
}
function Child(){
    this.age = 9;
    Parent.call(this);//相当于this.name = 'parent'  //继承私有属性
}
Child.prototype.smoking = function(){
    console.log('smoking')
}
Child.prototype = Parent.prototype;//这个不叫继承
//因为这样如果改变 Child.prototype 加属性，Parent.prototype的实例也会有这个属性，，此时这两者属于兄弟关系

Child.prototype._proto_ = Parent.prototype   // 方法一
//object.create
Child.prototype = object.create(Parent.prototype); // 常用,方法二
function create(parentPrototype,props){
    function Fn(){}
    Fn.prototype = parentPrototype;
    let fn = new Fn();
    for(let key in props){
        Object.defineProperty(fn,key,{
            ...props[key],
            enumerable:true
        });
    }
    return fn();
}
Child.prototype = create(Parent.prototype,{constructor:{value:Child}})

![](https://user-gold-cdn.xitu.io/2018/5/28/163a486d1740a83f?w=1220&h=634&f=png&s=369712)
  • Наследовать общественную и частную собственностьChild.prototype = new Parent()

Составление класса

  1. Класс может быть только новым
class Parent{
    //私有属性
    constructor(){
        this.name = 'parent',
        this.age = '40'
    }
    //公有属性，原型上的方法
    eat(){
        console.log('eat')
    }
    //静态方法/属性  es6/es7
    //属于类上的方法 Child.a()
    static b(){
        return 2
    }
}
new Parent();
class Child extends Parent{ //继承父亲的私有和公有
    //私有属性
    constructor(){
        super() // 相当于Parent.call(this)
        this.name = 'child'
    }
    //公有属性，原型上的方法
    smoking(){
        console.log('smoking')
    }
    //静态方法/属性  es6/es7
    //属于类上的方法 Child.a()
    static a(){
        return 1
    }
}
let child = new Child();
console.log(child.name,child.age,child.eat(),child.smoking,Child.b())
//类可以继承公有，私有和静态
//父类的构造函数中返回类一个引用类型，会把这个引用类型作为子类的this

Сначала мы напишем функцию, которая создает класс

//检测实例是不是new出来的
function _classCallCheck(instance,constructor){
  if(!(instance instanceof constructor)){
    throw new Error('Class constructor Child cannot be invoked without new')
  }
}
//constructor构造函数
//prprotoPropertys构造函数原型
//staticPropertys静态方法的描述
function definePropertys(target,arr){
  for(let i=0;i<arr.length;i++){
    Object.defineProperty(target,arr[i].key,{
      ...arr[i],
      configurable : true,
      enumerable : true,
      writable:true
    })
  }
}
function _createClass(constructor,protoPropertys,staticPropertys){
  if(protoPropertys.length > 0){
    definePropertys(constructor.prototype,protoPropertys)
  }
  if(staticPropertys.length > 0){
    definePropertys(constructor,staticPropertys)
  }
}
let Parent = function(){
  //写逻辑
  function P(){
    _classCallCheck(this,P)
    this.name = 'parent';
    //return {}
  }
  _createClass(P,//属性描述器
    [
      {
        key: 'eat',
        value: function () {
          console.log('吃')
        }
      }
    ],
    [
      {
        key:'b',
        value:function () {
          return 2;
        }
      }
    ]
  )
  return P;
}()
let p = new Parent();
console.log(p.eat())

Вышеупомянутая функция не имеет эффекта наследования, будем ее постепенно улучшать.

наследование классов

function _inherits(subClass,superClass){
  //继承公有属性
  subClass.prototype = Object.create(superClass.prototype,{constructor:{
    value:subClass
  }})
  //继承静态方法
  Object.setPrototypeOf(subClass,superClass);
}
let Child = (function(Parent){
  _inherits(C,Parent)
  //继承私有属性
  function C(){
    _classCallCheck(this,C);
    let that = this;
    let obj = Parent.call(this);//继承并执行父类
    if(typeof obj === 'object'){
      that = obj
    }
    that.age = 9 ; //解决了父类返回引用类型的问题
  } 
  return C;
})(Parent)
let child = new Child()
console.log(child)
console.log(Child.b())
console.log(parent)

[Running] node "/Users/myloveyunyun/Desktop/node/pro.js"
C { name: 'parent', age: 9 }
2
P { name: 'parent' }

Итак, наш класс создан

Категории