The Javascript constructor and prototype encapsulation

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

Like Java, c+ + a strongly typed language that all objects, type is a template type, by definition, can describe the data and operations (package). According to the demand, types can be extended inheritance, polymorphic variation, makes the code reuse compared and readability of procedural programming syntax is greatly improved. Javascript is an object-oriented language, the type that does not define the situation, by defining a prototype implementing type template.

The basic types of Javascript.:

The Javascript reference types: Javascript offers several different type: Function, Object, Boolean, Number, String, Array

The Function of this type is the most special, must take out a separate way, first must know the type of the so-called Javascript is not expressed using class, but expressed by function, this type of information is itself an object. If in accordance with the definition of types and objects in Java is not easy to understand,

For example, Javascript defines a type for the Function object.:

function Cat(){return 1;};

This code Cat plays two roles, one is a custom type Cat, is a Cat object; Cat is of type Function, and the Cat is a reference to an instance of the type Function.

As a custom type, Cat can be used as object templates, also is the constructor, actually Javascript also can create other objects by defining a Function type template, equivalent to Java of Class, the Object (Function) type, is equivalent to the Java Object class . For example: new Object (New); Function (New); Array (so);, Function, Number, These types of Array can be seen as Object (Function) sub classes, in addition to the built-in reference types, Can also use the keyword function/Function defined types, the above code is a definition of Function Cat types and instances, Also by invoking special template function Function to create a type to an instance of a Function:

var Cat = new Function("return 1;");

In the use of Cat, different identity also respectively have different usage, as a type of template, it can act as a constructor to create an instance of, for example: VAR cat = new Cat (of course); case doesn't actually own any property, all inherited the Object instance;

Method to create an instance of Object: var o = new Object(); var o = {};

Method of creating Function example: VAR f = new Function("return 1"); var f =function(){return 1;}

Object.constructor == Function, The constructor for Object is actually Function method

Is that all instances are created by the Function constructor.

To simply create an instance of:

var cat = {name: 'xiaoqi', age: 1};

Through the cat.constructor attribute or the cat instanceof Object, cat is an instance of the Object function constructed, all properties of cat are inherited the Obeject function, in addition to name and age.

The above code can also be replaced:

var cat =new Object(); = 'xiaoqi';

cat.age ='1';

The Object function is the original template all objects

If you are familiar with Java and C+ + developers, to understand Object function is all object templates, we must change the existing concepts. In the Javascript function that is a function of the general meaning, but a genuine goods at a fair price of objects. Therefore, in addition to containing the function body as an object code, it may also have other properties. In addition it also has a special ability, that is as a constructor to create a new object.

function Cat(name, age){ = name;

this.age = age;



When the function of Cat as a general function to call, it does its own description, changed the this refers to the two attributes of objects. At the same time, the function Cat is an object, for some of the basic properties such as: call, apply, prototype and so on some inherited from Object important attribute, in addition to also can increase, delete and modify its properties. Therefore, the above code will replace:,["xiaoqi", 1]);

So far, Cat function has been a multitasker, that is the function and object, and these are not the only its ability:

Special function: a constructor

The special function of the so-called, is totally bluffing statement. The Cat function is a constructor, the wording of it and the general function the same, difference is that how to call it:

function Cat(name, age){ = name;

this.age = age;


var cat = new Cat("xiaoqi", 1);

Familiar with Java must be very familiar with the last line of the new keyword, but there is no definition of the corresponding class Cat Oh, it seems that all the secret all in the Cat function. We know that Javascript has a prototype template, also know all the object template is an Object object, and the Cat function will automatically inherit from Object, so this constructor can take Object as a template to create a new object. At this time, this will no longer function refers to the call, but to a newly created object. Therefore, we can define more attributes in the constructor for Cat:

function Cat(name, age){ = name;

this.age = age; =function(){



var xiaoqi = new Cat("xiaoqi",1);

var daqi = new Cat("daqi",2);;;

Therefore, function can represent a type of writing, if we do not consider the access level, even more than Java the need to write a line of class is more concise, of course, does not want to become like Javascript Java, can not substitute for Java. Then we continue to discuss another important object-oriented features, Inheritance.

The prototype property to implement inheritance

If you already have a constructor:

function Animal(){ function(){



Then we create a specific Animal type, such as Cat, we hope that through inheritance way run to add this in Animal. Javascript is realized through the prototype property:

function Cat(name, age){ = name;

this.age = age;


Cat.prototype = new Animal();

Cat.prototype.constructor = Cat;

var cat =new Cat("xiaoqi",1);;

In fact, to understand why Cat.prototype can implement inheritance, must have a look in the call to Cat.prototype = new (Animal); when, exactly what happened?

Look at a simple constructor:

function Simple(){


This code is equivalent to: var Simple = new Function("//body");

First, Simple is an instance of type Function, Simple default inherits all the properties of the Function.prototype, the new constructor is called, not only the calling function to initialize, and copy the attribute Function.prototype to the new instance.

Simple is a constructor, so you can continue to build Simple based on examples:

var simple = new Simple();

Simple is an instance of a Simple, in the Simple constructor body does not have any initialization code, all the properties of all the simple from Simple.prototype. and Simple.prototype is the default in Object.prototype. It is the prototype attribute any one instance of Function from Object.prototype.

Summary: Any constructor is invoked by calling new, in addition to function in vivo initialization code, but also to the object referred to prototype on the copy to a new instance. If a new instance is an instance of Function, it will default to inherit attributes from the prototype Object.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download

Posted by Dempsey at December 18, 2013 - 3:31 PM