Basic javascript knowledge sharing and function-based Knowledge

In C ++, a class is declared as a class. JavaScript is different from C ++. It uses the same function as a function for declaration, this allows many Jscript learners to mix classes and functions. In Jscript, functions and classes are indeed somewhat mixed, but after a long time, they will naturally understand, this article is intended to attack a friend who wants to attack object-oriented programming, so I am not going to discuss it too deeply.

1. objects are suitable for data collection and management, and are easy to form a tree structure. Javascript includes a prototype chain feature that allows an object to inherit attributes of another object. Correct use of it can reduce the initialization time and memory consumption of objects. 2. functions are basic module units of javascript For code reuse, information hiding, and combined calls. A function is used to specify the behavior of an object. In general, programming is the skill to break down a set of requirements into a group of functions and data structures. 3. We can use functions and closures to construct modules. A module is a function or object that provides interfaces but hides Implementation states and implementations.

1. Custom type-constructor mode (pseudo-class mode)

In a class-based system, an object is defined as follows: class is used to describe what it is. If the building is a class-based system, the architect will first draw a blueprint for the house, and then the house will be built according to the blueprint.

When using the custom type mode to implement inheritance, we only need to pass the parameters to the constructor, And then mount the parameters on the instance object. Other methods on the Instance Object do not need to pass parameters, because this parameter can be accessed within the methods called by the instance object. The variables attached to the instance this object are called instance variables.

Combination-Inheritance

Function Person (name, age, job) {// instance variable this. name = name; this. age = age; this. job = job;} Person. prototype. sayName = function () {alert (this. name);} var person1 = new Person ('nicholas ', 29, 'Software engineer'); var person2 = new Person ('greg', 27, 'Doctor '); function SuperType (name) {this. name = name; this. colors = ['red', 'Blue ', 'green'];} SuperType. prototype. sayName = function () {console. log (this. name);} function SubType (name, age) {// inherits the SuperType attribute. call (this, name); this. age = age;} // Inheritance Method SubType. prototype = new SuperType (); SubType. prototype. sayAge = function () {console. log (this. age)} var instance1 = new SubType ('nicholas ', 29); instance1.colors. push ('black') console. log (instance1.colors); instance1.sayName (); instance1.sayAge (); var instance2 = new SubType ('greg ', 27) console. log (instance2.colors); instance2.sayName (); instance2.sayAge ();

In terms of inheritance attributes and inheritance methods, we have called the superclass constructor twice. When we call the new superclass constructor to create a prototype of the sub-class constructor, there is a problem, the prototype object of the subclass constructor is now an instance of the superclass constructor. Therefore, there will also be attributes added by the superclass constructor for the instance object this, but the value is undefined, that is to say, when new calls the superclass constructor function to change the prototype of the subclass modifier, there will be additional attributes in the prototype of the subclass constructor. This results in waste. What we need is that the prototype of the subclass constructor can inherit the prototype method of the superclass constructor. So what we need,

1. Create a subclass constructor prototype object.

2. This subclass constructor prototype inherits from the prototype of the superclass constructor.

3. because we have rewritten the prototype object of the subclass constructor in 1, that is, re-created the prototype object, therefore, we need to add the constructor attribute on the new prototype object and assign it to the subclass constructor function.

Rewrite the above Code as follows.

Constructor attributes: attributes that are only available on the constructor prototype and point to the constructor. By default, the rewritten prototype does not have the constructor attribute.

Parasitic combination-Inheritance

Function inheritPrototype (subType, superType) {var prototype = Object. creat (superType. prototype); prototype. constructor = subType; subType. prototype = prototype;}; function SuperType (name) {this. name = name; this. colors = ['red', 'Blue ', 'green'];} SuperType. prototype. sayName = function () {console. log (this. name);} function SubType (name, age) {// inherits the SuperType attribute. call (this, name); this. age = age;} // Inheritance Method inheritPrototype (SubType, SuperType); SubType. prototype. sayAge = function () {console. log (this. age);} var instance = new SubType ();

By hiding the so-called prototype operation details, it does not seem so weird now. But is it true that:
No private environment. All attributes are public. The method of the parent class cannot be accessed. Difficult to debug

2. Prototype

In a pure prototype model, we will discard classes and focus on objects. Compared with class-based inheritance, prototype-based inheritance is simpler in concept: a new object can inherit the attributes of an old object. You can start by constructing a useful object and then construct more objects similar to that object. This completely avoids the classification process of splitting an application into a series of nested abstract classes.
In a prototype-based system, the object we create looks like all the objects of this type we want, and then tells the javascript engine that we want more objects like this. If the building is based on a prototype, the architect will first build a house, and then build the house to look like this.

Method Object. creat () is an alternative to the new operator. When you use it to create javascript objects, it adds a prototype-based feeling.

function myMammal = {  name : 'Herb the Mammal',  get_name : function () {    return this.name;  },  says : function () {    return this.saying || '';  }}var myCat = Object.create(myMammal);myCat.name = 'Henrietta';myCat.saying = 'meow';myCat.purr = function (n) {  var i, s = '';  for (i = 0;i < n; i += 1) {    if(s) {      s += '-'    }    s += 'r';  }  return s;}myCat.get_name = function () {  return this.says + ' ' + this.name + this.says;}

This is a "differentiated inheritance ". By customizing a new object, we specify the difference between it and the basic object on which it is based.
Sometimes it is useful when some data structures inherit from other data structures.

3. function-factory Model

In pseudo-class mode, the constructor Cat has to repeat the jobs that the constructor Mammal has done. In the function mode, it is no longer necessary, because the constructor Cat will call the constructor Mammal to let Mammal do most of the work in object creation, and all the Cat will only focus on its own differences.
The function mode has great flexibility. Compared with the pseudo-class mode, it not only brings less work, but also gives us better encapsulation and information hiding, as well as the ability to access the parent class method.

If we create an object using a function style and all methods of the object do not use this or that, the object is persistent. A persistent object is a set of simple functions.

Private variables: Any variables defined in the function can be considered as private variables because they cannot be accessed outside the function.

Closure

A closure is a method that prevents the garbage collector from removing a variable from the memory so that the variable can be accessed outside the execution environment where the variable is created.
Remember: closures are created by functions. Each function call creates a unique execution environment object. After the function is executed, the execution object will be discarded unless the caller references it. Of course, if the function returns a number, it cannot reference the execution environment object of the function. However, if a function returns a more complex structure, such as a function, object, or array, and saves the returned value to a variable, a reference to the execution environment is created.

Function. prototype. method = function (name, func) {this. prototype [name] = func; return this;} // factory mammal function var mammal = function (spec) {var that = {}; that. get_name = function () {return spec. name;} that. says = function (spec) {return spec. saying | '';} return that;} // factory cat function (based on the mammal function) var cat = function (spec) {spec. saying = spec. saying | 'meow '; var that = mammal (spec); that. purr = function (n) {var I, s = ''; for (I = 0; I <n; I + = 1) {if (s) {s + = '-';} s + = 'R' ;}} that. get_name = function () {return that. says () + ''+ spec. name + ''+ that. says () ;}return that ;}// create the myCat Object var myCat = cat ({name: 'henrietta '}); Object. method ('superior ', function (name) {var that = this, method = that [name]; return function () {return method. apply (that, arguments)}) // factory coolcat function (based on cat function) var coolcat = function (spec) {var that = cat (spec), super_get_name = that. superior ('get _ name'); that. get_name = function (n) {return 'like' + super_get_name () + 'baby';} return that;} var myCoolCat = coolcat ({name: 'bix '}); var name = myCoolCat. get_name ();

The functional module mode has great flexibility. Compared with the constructor mode, it not only brings less work, but also gives us better encapsulation, rest, and hiding, as well as the ability to access the parent class methods. If all States of an object are private, the object becomes a "tamper-proof" object. The attributes of the object can be replaced or deleted, and the integrity of the object will not be damaged. We create an object using a functional style, and this or that is not used in all methods of the object, then the object is a persistent object. A persistent object is a set of simple functions.
A persistent object is not infiltrated. When accessing a persistent object, the attacker will not access the internal status of the object unless authorized by the method.

Module Mode

The preceding mode is used to create private variables and privileged methods of custom types. While Douglas calls the module mode to create private variables and privileged methods for a single instance. A singleton is an object with only one instance. (That is, the object created in the literal representation of the object)

Var singleton = function () {// Private variable and function var privateVariable = 10; function privateFunction () {return false;} // privileged/public method and attribute return {publicProvperty: true; publicMethod: function () {privateVariable ++; return privateFunction ();}}}

Essentially, this object literally defines the public interface of a singleton. This mode is useful when you need to initialize a single instance and maintain its private variables. In short, if you must create an object and initialize it with some data, you must also publish some methods that can access the private data.

Enhanced module Mode

This enhanced module mode is suitable for those instances that must be of a certain type, and some attributes and methods must be added to enhance them.

Var singleton = function () {// Private variable and function var privateVariable = 10; function privateFunction () {return false} // create object var object = new CustomType (); // Add the privileged/Public attribute and method object. publicProperty = true; object. publicMethod = function () {privateVariable ++; return privateFunction ();} return object ;}()