"Javascript Supplements II" prototype prototype

In development, using some JavaScript frameworks, such as Jquery, Ext-js, Jquery-ui, Easyui, and so on, will often see prototype in some open source code. So what exactly is prototype? What are the applications in OO front-end development? What problems can be solved from the perspective of software engineering? Let's talk about the magic of the prototype keyword in the JavaScript language.Prototype prototype 1, definition

There are two kinds of confusing types in JavaScript, function and object, and many friends think that they are a type, or that they cannot distinguish between them. Let's take a look at when the function is the object.

var function () {    alert (' prototype ');} Alert (typeof//  functionvarnew//  prototype alert (typeof//  Object

After a function is declared, he is only in static memory, its type is function, and with the new keyword, function is converted to the object type, only the object can invoke the methods and properties.

Now let's look at the definition and usage of prototype:

Prototype is a prototype object, what is "prototype object"? In fact, when this method is passed into an object, the prototype object is initialized (and the properties and methods in the object are activated, directly to be called by the object), as the Protoype object is written in the constructor of a class, and when the class is instantiated, the object in the constructor is initialized. Although JavaScript does not have the concept of class, you can think of a function as a simple class to understand. See the following example:

functionpeople (name) {//People.prototype.name = ' xxx 'Console.warn (people.prototype);} Console.warn (people); Console.warn (People.prototype); People.prototype={name:' AAA ', Method:function(){             return("My name is aaa!"); }}varn \Newpeople (); Console.warn (o.name); Console.warn (O.method ());//people (name) is a simple function//People {} is an object after passing the new keyword//Object {name= "AAA", Method=function ()} prototype object//AAA Call Object Properties//My name is aaa! Call object method

The structure of the inner prototype of an object is this: note its DOM structure.

Window. People.constructor.prototype = {

Name: ' AAA ',

Method:function () {

...

}

}

2. Application-prototype function extension

Usually we want to extend a JavaScript standard object in such a way that: (ex.) add a In_array () method to the array to determine whether a value is in the array)

Such a call to Array.prototype.in_array, we find that array is also a function, or you can think of it as a ' class ', we add a source method by prototype this property.

If you modify the Array.prototype.push, the default push method for the array will be modified, which is not recommended.

function (e) {    for (var-this [i]! = e; i++)        ;      return  This . length);}
Console.warn ([1,2,3,4,5],in_array (3));
True

-Inheritance

An example of a simple a-integration B. This inheritance method compares old style, and now the popular framework is generally used to copy and copy the attributes of the object literal, which is seldom used in this way, because it is less efficient. Only learn and learn here.

var function () {}varfunction() {    return  {        ' B ',         function () {            alert (' i\ ' m b ');        }     =  New  B (); var New A (); alert (a.name); A.method ();

3. Summary

This article simply introduces the definition and usage of the prototype attribute, and does not really need to think of it as being very esoteric and complex, and it is easy to understand the use of Java or C + + constructors, Just to be clear. Prototype provides an interface for JavaScript class functions to modify properties and methods, and when instantiated, the properties and methods of these definitions give the instantiated object to be called by the object.

"Javascript Supplements II" prototype prototype