ES5 classes in the

The basic characteristics of small make up for classes and class before (the so-called encapsulation, inheritance, polymorphism) understanding has not been very in place, at the same time, also used in the actual project application is relatively small, small make up today about the combination of the basic usage of the ES5 and you chat, hope friend will have their own harvest in this article, and can have practical applications in the future projects. You can also follow my wechat public number, Snail Quanzhan.

Basic usage of class

function People(name,age){
    // This refers to People{}
    this.name = name
    this.age = age
}

let p1 = new People("lilei".30)
console.log(p1) // People{name:"lilei",age:34}

let p2 = new People("hanmei".18)
console.log(p2) // People{name:"hanmei",age:18}
Copy the code

2. Class methods: There will be some waste of resources in this instance, because the method will exist in the class at the time of each instantiation. In practice, class methods will be defined in the prototype to save resources

function People(name,age){
    // This refers to People{}
    this.name = name
    this.age = age
    this.showName = function(){
        console.log("Current person's name is:"+this.name)
    }
}

let p1 = new People("lilei".30)
console.log(p1) // People{name:"lilei",age:34}
p1.showName() // The current person's name is lilei

let p2 = new People("hanmei".18)
console.log(p2) // People{name:"hanmei",age:18}
p2.showName() // The current person's name is: hanmei
Copy the code

Create an instance of the actual class method

function People(name,age){
    this.name = name
    this.age = age
}
People.prototype.showName = function(){
    console.log(this.name)
}
let p1 = new People("lilei".30)
console.log(p1) // People{name:"lilei",age:34}
p1.showName() // lilei

let p2 = new People("hanmei".18)
console.log(p2) // People{name:"hanmei",age:18}
p2.showName() // hanmei
Copy the code

Class static properties and static methods: the above attributes, such as name and age, are attributes and methods only after instantiation. The above attributes and methods are generally called instance properties and instance methods, which can only be handled after class instantiation. Instance methods can only be called after class instantiation. Static properties and methods can be invoked directly from the class without instantiation. Class static properties

function People(name,age){
    // This refers to People{}
    this.name = name // Instance properties
    this.age = age // Instance properties
}
People.count = 10
console.log(People.count) / / 10
Copy the code

Class static methods

function People(name,age){
    // This refers to People{}
    this.name = name // Instance properties
    this.age = age // Instance properties
}
People.getCount = function(){
    console.log("Current number is"+People.count)
}
console.log(People.count) / / 10
Copy the code

1, constructor inheritance: inherit only the attributes of the parent class, not the methods of the parent class

/ / parent class
function Animal(name){
    this.name = name
}

Animal.prototype.showName = function(){
    console.log("The name is:"+this.name)
}

/ / subclass
function Dog(name,color){
    Animal.call(this,name) // Inherit attributes
    this.color = color
}

let d1 = new Dog("wangcai"."white")
console.log(d1) // Dog{name:"wangcai",color:"white"}
d1.showName() // error: d1.showName is not a function // constructor inherits only the attributes of the parent class
Copy the code

2. Stereotype inheritance: Only methods of the parent class can be inherited, not attributes of the parent class

/ / parent class
function Animal(name){
    this.name = name
}

Animal.prototype.showName = function(){
    console.log("The name is:"+this.name)
}

/ / subclass
function Dog(name,color){
    // animal. call(this,name) // Inherit attributes
    this.color = color
}
Dog.prototype = new Animal()
Dog.prototype.constuctor = Dog

let d1 = new Dog("wangcai"."white")
console.log(d1) // Dog{name:"wangcai",color:"white"}
d1.showName() // undefind
Copy the code