JavaScript Design Patterns and development Note 1. Object-oriented JavaScript

• Polymorphic
• Packaging
• Prototype mode
• Inherited JavaScript objects based on the prototype pattern

1. polymorphic

The actual meaning of polymorphism is that the same operation acts on different objects and can produce different interpretations and different execution results. In other words, when the children of the Children's Palace are given the same message, the objects will give different feedback according to the message.多态最根本的作用就是吧通过过程化的条件分子语句转换为对象的多态性，从而消除这些条件分支语句。

varGoogleMap ={show:function() {Console.log ("Start rendering Google Maps"); }};varbaidumap={show:function() {Console.log (' Start rendering Baidu map '); }};//If you want to add a search mapvarsosomap={show:function() {Console.log (' Start rendering Search map '); }}varRendermap =function(map) {if(Map.showinstanceofFunction)    {map.show (); }}rendermap (GoogleMap); Rendermap (sosomap);

2. Encapsulation

The purpose of encapsulation is to hide information, encapsulation should be considered as "any form of encapsulation", that is, encapsulation is not only hidden data, but also includes hidden implementation details, design details and hidden object types.

var myObject = (function() {    var _name = ' sarmtom ';  // Private member Variable    return {                // public method      getName:function(          ) {return  _name,}}      ;})

Each function we create has one prototype（原型）属性 , which is a pointer to an object that is used to contain properties and methods that can be shared by all instances of a particular type. 如果按照字面意思来理解，那么prototype就是通过调用构造函数而创建的原型对象. The advantage of using a prototype object is that you can have all object instances share the properties and methods that it contains. 换句话说，不必在构造函数中定义对象实例的信息，而是可以将这些信息直接添加到原型对象中.

function= ' Smartom '="Soft Engineer"; Person.prototype.syaName=function() {    Console.log (this. name);} var New Person (); A.syaname ();

Patterns for using cloned prototypes

varPlane =function(){     This. Blood = 100;  This. Attacklevel = 1;  This. Defenselevel = 1;}varPlan =NewPlan ();p Lan.blood= 500;p Lane.attacklevel= 10;p Lane.defenselevel= 7;varCloneplan =object.create (plane); Console.log (Cloneplan);//output: Object{blood:500,atacklevel:10,defenselevel:7}//In browsers that do not support the Object.create method, you can use the Code/*object.create = Object.create | | function (Object) {var F = function () {};    F.prototype = obj; return new F ();*/

Prototype inheritance in 3.JavaScript

• All the data are objects.
• To get an object, instead of instantiating it, find an object prototype and clone it.
• The object remembers its prototype.
• If the object cannot respond to a request, it delegates the request to its own prototype.

1.所有数据都是对象

JavaScript除了undefined之外，一切都是对象，为了 实现这个目标，number,boolean,string，这几种基本类型数据也可以通过“包装类”的方式编程对象类型的数据处理。事实上，javascript中的跟对象Object.prototype对象。Object.prototype对象是一个空的对象。我们再JavaScript中遇到的每一个对象，实际上都是从Object.prototype对象克隆出来的，Object.prototype对象就是它们的原型。比如

 

var New Object (); var obj2 = {};

< Span class= "hljs-built_in" >< Span class= "hljs-built_in" >  
 2. To get an object, instead of instantiating the class, find an object as a prototype and clone it. 
 
               

 function   person (name) { this . Name = name;    Person.prototype.getName  = function   () {  return  this  .name;}  var  a = new  person (' Smartom '  // smartom  Console.log (   A.getname ()); // smartom  Console.log (object.getprototypeof (a) ==person.prototype); // true  

在JavaScript中没有类的概念，在这里Person并不是类，而是函数构造器，JavaScript函数既可以作为普通函数被调用，也可以作为构造器被调用。当使用new运算符来调用函数时，此时的函数就是一个构造器。用new运算符来创建对象的过程，实际上也只是先克隆Object.prototype对象，在进行一些其它操作的过程。

3.对象会记住它的原型

JavaScript给对象提供了一个名为__proto__的隐藏属性，某个属性的__proto__属性会指向它的构造器的原型对象，即{Constuctor}.prototype。

var New  ===object.prototype);  // result is true

4.如果对象无法响应某个请求，它会把这个请求委托给它的构造器的原型

var obj = {name: ' Smartom '}; var function  = obj; var New A (); Console.log (a.name);

Let's see what this code interpreter does:

• First, try to traverse all the properties in a, but do not find the Name property
• The request to find the name attribute is delegated to the prototype of the constructor of object A, which is a.__proto__ recorded and points to A.prototype, and A.prototype is set to object obj;
• The Name property is found in object obj and its value is returned.

var function  = {name: "Smartom"}; var function  New  A (); var New  // output Smartom

When we look at this code execution, the engine does those things.

• First, try traversing the properties in B, but not the Name property.
• The request to find the name attribute is delegated to the prototype of the constructor of object B, which is b.__proto__ logged and points to B.prototype, and B. The prototype is set to an object created through new A ().
• The name attribute is still not found in the object, and the request is continued to be delegated to the prototype A.prototype of the object constructor.
• The Name property was found in A.prototype and returned.

Finally, it is important to note that the prototype chain is not infinitely long. Now we try to access the Address property of object A. There is no address attribute on object B and its constructor prototype, then the request will eventually be returned as undefined.

JavaScript Design Patterns and development Note 1. Object-oriented JavaScript