JavaScript language Essence Note 03

Inherited
Pseudo class
Object Descriptor
Prototype
The function of
Parts

Inherited

JS is not class-based, but prototype-based, which means that objects inherit directly from other objects.

1 Pseudo-Class

JS provides a rich set of code reuse patterns that can emulate class-based patterns because JS does not actually have classes, so it is called pseudo-class.
We can define a constructor and expand its prototype:

var function (name) {    this. Name =function  () {    returnthis       function () {return this. Saying | |  ';};

You can now construct an instance:

var New Mammal (' Herb the Mammal '); var // ' Herb the mammal '

You can construct another pseudo-class to inherit mammal:

varCat =function(name) { This. Name =name;  This. saying = ' Meow ';};//Replace Cat.prototype as a new mammal instanceCat.prototype =Newmammal ();//Expand New Prototype objects, add purr and Get_name methodsCat.prototype.purr =function(n) {varI, S = ";  for(i = 0; i < n; i + = 1) {        if(s) {s+ = '-'; } s+ = ' r '; }    returns;}; Cat.prototype.get_name=function ( ) {    return  This. says () + "+ This. Name + "+ This. says ();};varMycat =NewCat (' Henrietta ');varsays = Mycat.says ();//' Meow 'varPurr = Mycat.purr (5);//' R-r-r-r-r 'varName =mycat.get_name ();//' Meow Henrietta Meow '

2 Object Descriptor

Sometimes the constructor takes a large string of arguments. This can be annoying because it can be very difficult to remember the order of the parameters. For example:

var myObject = Maker (f,l,s,c);

Better to write like this:

var myObject = Maker ({    first:f,    last:l,    state:s,    city:c});

Multiple parameters can now be sorted in any order, and if the constructor uses the default values wisely, some parameters can be ignored and the code easier to read.

3 prototypes

In a purely prototype pattern, we discard the class and focus instead on the object. Prototype-based inheritance is conceptually simpler than class-based inheritance: A new object can inherit the properties of an old object. You can construct a useful object, and then construct more objects that are similar to that object.

Build a useful object with the object literal:

var mymammal = {    ' Herb The mammal ',    function  () {        return This . Name;    },    function  () {        return  this. Saying | | ";}    ;

Add a Create method to object to create a new instance

if (typeof object.create!== ' function ') {    function  (o) {        var  function  () {};         = o;         return New F ();    };}

To customize a new instance:

varMycat =object.create (mymammal); Mycat.name= ' Henrietta '; mycat.saying= ' Meow '; Mycat.purr=function(n) {varI, S = ";  for(i = 0; i < n; i + = 1) {        if(s) {s+ = '-'; } s+ = ' r '; }    returns;}; Mycat.get_name=function ( ) {    return  This. says () + "+ This. Name + "+ This. says ();};

This is a kind of "differentiated inheritance". By customizing a new object, we indicate the difference between it and the base object on which it is based.

4 functional

The functional mode has great flexibility to better encapsulate and hide information.

Constructs a function that produces an object, giving it the name beginning with a lowercase letter, because it does not need to use the new prefix. The function consists of 4 steps:

• 1. It creates a new object. There are a number of ways to construct an object. It can construct an object literal, or it can be used with the new prefix to invoke a constructor, or it can use the Object.beget method to construct a new instance of an existing object, or it can call any function that returns an object.
• 2. It selectively defines private instance variables and methods. These are the normal variables defined by the VAR statement in the function.
• 3. It extends the method to this new object. These methods have privileged access to parameters, as well as variables defined by the VAR statement in the second step.
• 4. It returns a new object.

The following is a pseudo-code for a functional constructor:

var function (spec, my) {    var that , other private instance variables;     = My | |　　 {}; Add shared variables and functions    to my = A new Object added to that privileged method     return that ;

5 Parts

You can assemble objects from a set of parts. For example, construct a function that adds a simple event handling attribute to any object. It adds an on method, a fire method, and a private event registry object to the object:

vareventuality =function(that) {varRegistry = {}; That.fire=function(event) {//triggers an event on an object. The event can be a string that contains the name of the event, or an object that has a type attribute that contains the event name.
A function that matches the name of an event in an event handler registered by the ' on ' method is called.         varArray, func, Handler, I, type=typeofevent = = = ' String '?Event:event.type;//If there is a set of event handlers for this event, then they are traversed and executed sequentially.         if(Registry.hasownproperty (type)) {array=Registry[type];  for(i = 0; i < array.length; i + = 1) {Handler=Array[i];//Each handler contains a method and a set of optional parameters.
If the method is a string-like name, look for the function. func=Handler.method; if(typeofFunc = = = ' String ') {func= This[func]; }//call a handler if the entry contains parameters, then pass them past. Otherwise, the event object is passed. func.apply ( This, Handler.parameters||[Event]); }        }        return  This;    }; That.on=function(Type, method, parameters) {//registers an event, constructs a handler entry, inserts it into the handler array.
If this type of event does not already exist, build one.
        varHandler ={method:method, parameters:parameters}; if(Registry.hasownproperty (type)) {Registry[type].push (handler); } Else{Registry[type]=[Handler]; }        return  This;    }; returnthat ;}; 

We can call eventuality on any individual object and grant it an event handling method. We can also call it in a constructor function before that is returned.

eventuality (that);

In this way, a constructor function can assemble objects from a set of parts.

Reference: "The JavaScript language essence" Douglas Crockford Zhao Zehin Shan Translation

Reprint please specify the source:

Jesselzj
Source: http://jesselzj.cnblogs.com

JavaScript language Essence Note 03