With the release of ES6,javascript formally introduced the class(class), so that js object oriented more standardized standards, at the same time to want to cross the language development of the front-end students to provide a higher step, because, back-end language OOP is also class, grammar is basically the same ah! Isn’t surprise

Class static class static class static Take out your small mazza, and notebook began…..

Antecedents to review

A class contains only properties and methods. Objects that can be instantiated, such as this.

  / / class declaration
    class Boy {
      // Define attributes
      info = 'Who else can I fall in love with after seeing your beauty? ';
      // Define the method
      say() {
        console.log('Little sister,' + this.info); }}// instantiate the class
    let b = new Boy;
    // The method was successfully called
    b.say();
Copy the code

The results of

When we declare a method that uses the static modifier again, using the instantiated object, you’ll see

 / / class declaration
    class Boy {
      // Define attributes
      info = 'Who else can I fall in love with after seeing your beauty? ';
      // Define the method
      say() {
        console.log('Little sister,' + this.info);

      }
      // static modifier methods
      static desc() {
        console.log('Little sister, WHEN I see you, I fall asleep... '); }}// instantiate the class
    let b = new Boy;
    // The method was successfully called
    //b.say();
    // Call the static modified method
    b.desc();

Copy the code

Code error!! This method cannot be called by the instantiated object

Don’t worry, let’s uncover the mystery of static

Properties and methods that are static can only be called by class names, not instantiated objects. It also cannot be inherited by subclasses, in other words, it belongs to the current class.

The basic use

Use static to decorate properties and methods

    class A {
      // Static attributes
      static info = 'Who else can I fall in love with after seeing your beauty? ';
      // Static method
      static love() {
        console.log('Little sister, when I see you, I fall asleep, trapped by love, trapped by you! '); }}// Call directly with the class name
    console.log(A.info);
    A.love();
Copy the code

The results of

In normal methods, static properties and static methods are also required to be called using the class name

class A {
      // Static attributes
      static info = 'Who else can I fall in love with after seeing your beauty? ';
      // Static method
      static love() {
        console.log('Little sister, when I see you, I fall asleep, trapped by love, trapped by you! ');

      }
      // Normal method, call static property
      say() {
        console.log('Little sister,'+ A.info); }}Copy the code

You can also change the value of a static property in a normal method by calling it directly using the class name

Can be inherited

The purpose of extends is for a subclass to inherit from its parent. After that, all methods that a subclass owns include static methods and properties.

 class A {
      // Static attributes
      static info = 'Who else can I fall in love with after seeing your beauty? ';
      // Static method
      static love() {
        console.log('Little sister, when I see you, I fall asleep, trapped by love, trapped by you! ');

      }
      // Normal method, call static property
      say() {
        console.log('Little sister,'+ A.info); }}class B extends A {
      run() {
        console.log('Methods of class B.. '); }}// Use a normal method call in the parent class
    B.love();

Copy the code

Pay attention to the point

If a static method contains the this keyword, this refers to the class, not the instance.

    class A {
      // Static attributes
      static info = 'Who else can I fall in love with after seeing your beauty? ';
      // Static method
      static love() {
        // console.log(' Little sister, when I see you, I fall asleep, I fall asleep for love, I fall asleep for you! ');
        console.log(this);

        // call normal methods in static classes
        this.say();

      }
      // Normal method, call static property
      say() {
        console.log('Little sister,' + A.info);

      }
    }

    A.love();
Copy the code

Analysis:

In the code above, the static method love calls this.say(), where this refers to class A, not an instance of A, the same as calling a.say ().

Static methods and ordinary methods can have the same name because they don’t belong to the same object, like this!

   class A {
      // Static attributes
      static info = 'Who else can I fall in love with after seeing your beauty? ';
      // Static method
      static love() {
        console.log('Little sister, when I see you, I fall asleep, trapped by love, trapped by you! ');
        // console.log(this);

      }
      // Common method,love
      love() {
        console.log('I am the ordinary method.... ');

      }
      // Normal method, call static property
      say() {
        console.log('Little sister,'+ A.info); }}// Static love method
    A.love();
    // instantiate the class
    let a1 = new A;
// The normal love method
    a1.love();
Copy the code

Leave your questions in the comments section, earth does not explode, answer uninterrupted…..