class usage and tutorial in ES6 (basic)

I. constructor (more to use in the future)

The function of the constructor constructor is to execute the code in the constructor constructor first whenever the new class is used.

Traditional constructor:

function Animal (name, age) {
         //Instance attribute
         this.name = name;
         this.age = age;
     }
const a1 = new Animal('dog', 3);

Class class:

class Animal {
         constructor(name, age){
             //Instance attribute
             this.name = name;
             this.age = age;
         }
     }
const a2 = new Animal('cat', 2);

Every class has a constructor constructor. If the constructor is not specified manually, it can be considered that there is an invisible and empty constructor inside the class.
```
class Animal {
 //constructor() {here is the invisible, empty constructor
//}
}
```

2. Use static to create static attributes (not much will be used in the future)

What are static properties:

Properties directly accessed through the "constructor";
//For example, the following sounds are directly attached to Animal, so sounds is a static attribute.
```javascript
    function Animal (name, age) {
       this.name = name;
       this.age = age;
   }
   Animal.sounds = 'yayaya';
   console.log(Animal.sounds)// yayaya

   const a1 = new Animal('dog', 3);
   console.log(a1.sounds)// undefined
   console.log(a1.name)//dog
   console.log(a1.age)//3
```
//On the contrary, name and age can be accessed by the new instance a1, so name and age are * * instance properties.**

How to define static properties within a class
The attributes decorated by the static keyword are static attributes.

    class Animal {
         constructor(name, age){
             this.name = name;
             this.age = age;
         }
         static sounds = 'yayaya';
     }
     console.log(Animal.sounds)//yayaya

     const a2 = new Animal('cat', 2);
     console.log(a2.sounds)//undefined
     console.log(a2.name)//cat
     console.log(a2.age)//2

III. example method (to be used frequently in the future)

What is an example method:

Methods that can be accessed by instances of new

How traditional constructors define instance methods:

    function Animal (name, age) {
         this.name = name;
         this.age = age;
     }
     Animal.prototype.sounds = function () {
         console.log('yayaya')
     }

     const a1 = new Animal('dog', 3);
     a1.sounds()//yayaya

In class, define the instance method:

    class Animal {
         constructor(name, age){
             this.name = name;
             this.age = age;
         }
         sounds () {
             console.log('yayaya')
         }
     }

     const a2 = new Animal('cat', 2);
     a2.sounds()//'yayaya'

class internal definition instance method, and constructor, static level definition

Printing a1 and a2 on the console shows that instance methods are defined on the prototype chain, so there is no difference between the two methods in essence.

IV. using static to create static methods (not much will be used in the future)

Static method is the method attached to the constructor, and the instance out of new cannot be accessed;

Traditional constructors define static methods in the following ways:

    function Animal (name, age) {
         this.name = name;
         this.age = age;
     }
     Animal.sounds = function () {
         console.log('yayaya')
     }
     Animal.sounds() //yayaya

     const a1 = new Animal('dog', 3);
     a1.sounds()// a1.sounds is not a function

How to define static methods within a class:

    class Animal {
         constructor(name, age){
             this.name = name;
             this.age = age;
         }
         static sounds () {
             console.log('yayaya')
         }
     }
     Animal.sounds() //yayaya

     const a2 = new Animal('cat', 2);
     a2.sounds() // a2.sounds is not a function

Within the class class, static attributes and static methods are defined by static keywords.

matters needing attention:

In the {} interval within the class class, only constructor constructor, static static method, static static property and instance method can be written (instance property is in constructor constructor)!

Posted by predator12341 on Fri, 18 Oct 2019 00:24:03 -0700

Programmer Group