Class class

  • New to ES6 is the concept of classes, which allow you to declare a class using the class keyword and then instantiate objects from that class.

  • A class is abstracted as the common part of an object. It generally refers to a class.

  • A class is a function

  • Object refers to a particular object and instantiates a concrete object through a class

  • The characteristics of object-oriented thinking

    • Extract (abstract) common properties and behaviors of objects and organize (encapsulate) them into a class (template)
    • Instantiate the class and get the object of the class

  • Class constructor

    The constructor() method is the class’s constructor(default method), which is used to pass arguments and return the instance object. If the definition is not shown, a constructor() is automatically created for us inside the class.

  • Create classes and generate instances

Class Creates a student's class
class Student {
    constructor(name, age) {
        this.name = name;
        this.age = age; }}// 2. Use class to create object new
let stu1 = new Student("Xiao Ming".18);
let stu2 = new Student("Small fang".18);
console.log(stu1, stu2); //Student {name: 'xiao Ming ', age: 18}

/* Create a class with the class keyword. The class name is capitalized 2. Class contains a constructor function that accepts arguments passed in and returns an instance object. This function is automatically called whenever a new instance is generated. If we do not write this function, our class will automatically generate this function for us
Copy the code
  • Add methods to the class
Class Creates a student's class
class Student {
    constructor(name, age) {
            this.name = name;
            this.age = age;
        }
        // Add method
    homework(job) {
        console.log(this.name + job); }}// 2. Use class to create object new
let stu1 = new Student("Xiao Ming".18);
let stu2 = new Student("Small fang".18);
console.log(stu1, stu2);

stu1.homework("Write an essay"); // Xiao Ming writes a composition
stu2.homework("Do the exercises"); // Xiao Fang does exercises
Copy the code
  • The super keyword
    • The super keyword is used to access and call functions on an object’s superclass, either the constructor of the superclass or the ordinary functions of the superclass
  • extends
    • Inherits the methods and properties of the parent class
// Class inheritance
// class Father {
// constructor() {

/ /}
// money() {
// console.log(" inherit ");
/ /}
// }
Inheritance of the // // // class
// class Father {
// constructor() {

/ /}
// money() {
// console.log(" inherit ");
/ /}
// }
// // extends extends the methods and properties of the parent class
// class Son extends Father {

// }
// let son = new Son();
// son.money(); / / inheritance


class Father {
    constructor(x, y) {
        this.x = x;
        this.y = y;
    }
    sum() {
        console.log(this.x + this.y); }}class Son extends Father {
    constructor(x, y) {
        super(x, y); // The constructor in the parent class is called}}let son = new Son(10.20);
son.sum(); / / 30
// class Son extends Father {

// }
// let son = new Son();
// son.money(); / / inheritance


class Father {
    constructor(x, y) {
        this.x = x;
        this.y = y;
    }
    sum() {
        console.log(this.x + this.y); }}class Son extends Father {
    constructor(x, y) {
        super(x, y); // The constructor in the parent class is called}}let son = new Son(10.20);
son.sum(); / / 30
Copy the code
  • Call the normal function of the parent class
// the super keyword calls the normal function of the parent class
class Father {
    say() {
        return "father"}}class Son extends Father {
    say() {
        // console.log("son");
        // super.say() calls the ordinary say() function in the superclass.
        console.log(super.say()); }}let son = new Son();
son.say(); // father

1. In inheritance, if a subclass outputs a method, the subclass executes method 2 if it has the method. In inheritance, if a subclass does not have this method, it looks up to its parent class, which executes its parent's method (the nearest principle) */
Copy the code
  • Make a subclass inherit a method from its parent class while having its own method
// Subclasses have their own methods while inheriting methods from their parent
class Father {
    constructor(x, y) {
        this.x = x;
        this.y = y;
    }
    sum() {
        console.log(this.x + this.y); }}class Son extends Father {
    constructor(x, y) {
        // Call the superclass constructor with super must come before the subclass's this, otherwise an error is reported
        super(x, y);
        this.x = x;
        this.y = y;
    }
    subtract() {
        console.log(this.x - this.y); }}let son = new Son(20.10);
son.sum(); / / 30
son.subtract(); / / 10

// When a subclass uses super in its constructor, it must come before this (the parent constructor must be called before the subclass constructor).
Copy the code

Considerations for using classes

  • There is no variable promotion for classes in ES6, so classes must be defined before objects can be instantiated
  • Public attributes and methods in a class must use this
  • Repeat class
    • Repeating a class declaration causes a type error
class student {};
class student {};
// Uncaught TypeError: Identifier 'student' has already been declare
Copy the code
  • This points to the problem
class Father {
    let _that;
    constructor(x, y) {
        _that=this;
        // This in constructor points to the created instance object
        this.x = x;
        this.y = y;
    }
    sum() {
 		// This refers to the caller
        console.log(this);
        console.log(this.x + this.y); }}let fahter = new Father();
console.log(_that === father); // true
father.sum(); // This refers to the instance object
Copy the code