JavaScript and JavaScript

JavaScript and JavaScript

We know that in js, there is no class concept. All instance objects of the class inherit attributes from the same prototype object. Therefore, the prototype object is the core of the class.

A class is the abstraction of an object, and an object is a specific instance of a class. Classes are abstract and do not occupy memory, while objects are specific and occupy storage space. --- Baidu encyclopedia

Early javascript requirements were very simple, basically all written as functions, followed by process-oriented writing. Later, we gradually introduced the idea of object-oriented development, and then began to write classes.

In js, the essence of writing classes is basically constructors + prototypes. Below, we will discuss several methods of writing JavaScript classes:

Constructor Method

/*** Person class: defines a Person with the name attribute and the getName Method */<script> function Person (name) {this. name = name; this. getName = function () {return this. name ;}}// here We instantiate several objects var p1 = new Person ("trigkit4"); var p2 = new Person ("mike"); console. log (p1 instanceof Person); // true console. log (p2 instanceof Person); // true </script>

According to the results output on the console above, p1 and p2 are indeed Person-like instance objects. On the left side of the instanceof operator is the object of the class to be checked, and on the right side is the constructor that defines the class. Here, instanceof is used to check whether object p1 belongs to the Person class.

The advantage of this method is that we can construct different object instances based on parameters. The disadvantage is that the getName method is generated every time we construct an instance object, resulting in a waste of memory.

We can use an external function to replace the class method, so that each object shares the same method. The modified class is as follows:

// External function <script> function getName () {return this. name;} function Person (name) {this. name = name; this. getName = getName; //} </script>

Prototype

<Script> function Person () {}; Person. prototype. name = "trigkit4"; // attributes of the class are put on prototype Person. prototype. getName = function () {return "I'm" + this. name;} var p1 = new Person (); var p2 = new Person (); console. log (p1.name); // trigkit4 console. log (p2.getName (); // I'm trigkit4 </script>

The disadvantage of the prototype method is that the object instance cannot be constructed through parameters (generally, the attributes of each object are different). The advantage is that all object instances share the getName method (relative to the constructor method ), no memory waste.

Constructor + prototype
Take the advantages of the first two methods:
A. Use constructors to define class attributes (fields ).
B. Define the class method in prototype mode.

<Script> function Person (name) {this. name = name;} // The prototype allows the object instance to share the getName method Person. prototype. getName = function () {return "I'm" + this. name ;}</script>

In this way, we can both construct objects with different attributes and share methods with object instances without wasting memory.

To make the js Code style more compact, we move the prototype method code to the braces of function Person.

<Script> function Person (name) {this. name = name; Person. prototype. getName = function () {return name; // this is not suitable for use. name} var p1 = new Person ('trigger4'); console. log (p1.getName (); // trigkit4 </script>

Here, we need to know several methods for defining classes, in addition to the above constructor, there are:

Object. create () method
In this method, "class" is an object, not a function.

 var Person = {    name : "trigkit4",    age : 21,    run: function(){      alert("I like running");    }  }

Then, directly use Object. create () to generate an instance without using new.

var p1 = Object.create(Person);  alert(p1.age);//21  p1.run();//I like running

This method is simpler than the constructor method, but it cannot implement private attributes and private methods, and data cannot be shared between instance objects. The simulation of "class" is not comprehensive enough.

CreateNew () method
This method does not require this and prototype. The method is to simulate a class with an object, define a constructor createNew () in the class, and then create a constructor in createNew () defines the Instance Object and uses this instance object as the return value.

<script>  var Person = {    createNew : function () {      var person = {};      person.name = "trigkit4";      person.run = function(){        alert("I like running");      };      return person;    }  }</script>

Call createNew () to obtain the instance object.

 var p1 = Person.createNew();  p1.run();//I like running

In fact, this writing method is similar to the literal Writing Method of an object, except that one is separated by commas (,) and the other is separated by semicolons.

The above is all the content of this article. I hope it will be helpful for your learning and support for helping customers.