There is no concept of classes in Es5. Before we talk about classes, let’s first talk about class inheritance

Class inheritance

A class has three properties, public, private, and static (Es7)/static class (Es6).

How do I implement a class

  • Inheriting public properties
function Parent(){
    this.name = 'parent';
}
new Parent();//this points to the current instance
Parent() / / this point to the window
function Child(){
    this.age = 9;
    Parent.call(this);This.name = 'parent' // Inherits private properties
}
Copy the code
  • Inherits properties from the parent class
    • Strictly speaking, the general specification is that the underlined property is called private, even if the inheritance, the private property of the class will not inherit, private property is only the internal methods of the class can access the property, we will have the originalInheriting private propertyInstead ofInherits properties from the parent classI am sorry for any misunderstanding and confusion I have caused you. If there are any mistakes in this article, I welcome your comments. Thank you! Thank you @ MrTreasure!
function Parent(){
    this.name = 'parent';
}
Parent.prototype.eat = function(){
    console.log('eat')}function Child(){
    this.age = 9;
    Parent.call(this);This.name = 'parent' // Inherits private properties
}
Child.prototype.smoking = function(){
    console.log('smoking')
}
Child.prototype = Parent.prototype;// This is not called inheritance
/ / because of this Child. If you change the prototype to add properties, the Parent. The instance will also have this property, the prototype, both belong to the brotherhood

Child.prototype._proto_ = Parent.prototype   / / method
//object.create
Child.prototype = object.create(Parent.prototype); // In common use, method 2
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)

Copy the code
  • Inherit public and private propertiesChild.prototype = new Parent()

Compilation of a class

  1. Class can only be new
class Parent{
    // Private property
    constructor() {this.name = 'parent'.this.age = '40'
    }
    // Public properties, methods on the prototype
    eat(){
        console.log('eat')}// Static methods/properties ES6 / ES7
    // A method belonging to the class child.a ()
    static b(){
        return 2}}new Parent();
class Child extends Parent{ // Inherit the father's private and public
    // Private property
    constructor() {super(a)// Equivalent to parent-.call (this)
        this.name = 'child'
    }
    // Public properties, methods on the prototype
    smoking(){
        console.log('smoking')}// Static methods/properties ES6 / ES7
    // A method belonging to the class child.a ()
    static a(){
        return 1}}let child = new Child();
console.log(child.name,child.age,child.eat(),child.smoking,Child.b())
// Classes can inherit public, private, and static
// The constructor of the parent class returns a reference type to the class, which is treated as this for the subclass
Copy the code

Let’s first write a function that creates the class

// Check whether the instance is new
function _classCallCheck(instance,constructor){
  if(! (instanceinstanceof constructor)) {throw new Error('Class constructor Child cannot be invoked without new')}}//constructor
//prprotoPropertys Constructor prototype
//staticPropertys Description of the static method
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(){
  / / write logic
  function P(){
    _classCallCheck(this,P)
    this.name = 'parent';
    //return {}
  }
  _createClass(P,// Attribute descriptors[{key: 'eat'.value: function () {
          console.log('eat')}}], [{key:'b'.value:function () {
          return 2; }}])returnP; } ()let p = new Parent();
console.log(p.eat())
Copy the code

The above function does not inherit, so we will improve it gradually

Class inheritance

function _inherits(subClass,superClass){
  // Inherit public properties
  subClass.prototype = Object.create(superClass.prototype,{constructor: {value:subClass
  }})
  // Inherit static methods
  Object.setPrototypeOf(subClass,superClass);
}
let Child = (function(Parent){
  _inherits(C,Parent)
  // Inherit private properties
  function C(){
    _classCallCheck(this,C);
    let that = this;
    let obj = Parent.call(this);// Inherit and execute the parent class
    if(typeof obj === 'object'){
      that = obj
    }
    that.age = 9 ; // Fixed the problem of the parent class returning reference types
  } 
  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' }

Copy the code

This completes the creation of our class