Javascript constructor and prototype implement encapsulation inheritance

Source: Internet
Author: User
A strongly-typed language like Java, c & amp; 43; & amp; 43; type is a template of all objects. Data and operations can be described (encapsulated) through type definition. As needed, types can be extended, inherited, and mutations, greatly improving code reusability and readability compared with procedural programming syntax. Jav

A strong type language like Java and c ++, a type is a template of all objects. It can be used to describe (encapsulate) data and operations through a type definition. As needed, types can be extended, inherited, and mutations, greatly improving code reusability and readability compared with procedural programming syntax. Javascript is also an object-oriented language. Without a type definition, you can define a prototype to implement a type template.

Basic Types in Javascript:

Javascript reference type:Javascript itself provides several different types of use: Function, Object, Boolean, Number, String, Array

Specifically, the Function type is the most special. It must be mentioned separately. First, we must know that the so-called Type of Javascript is not represented by class, but by function, this type of information itself is an object. It is difficult to understand the definition of types and objects in Java,

For example, Javascript defines a Function-type object as follows:

function Cat(){      return 1;};

In this Code, Cat plays two roles: Custom Cat, object Cat, Function Cat, and reference Function.

As a custom type, Cat can be used as an object template, that is, constructor. In fact, Javascript can only create templates for other objects by defining the Function type, which is equivalent to the Class in Java, the Object (Function) type is equivalent to the Object class in Java. For example, new Object (); new Function (); new Array (); therefore, functions, numbers, and arrays can all be considered as subclasses of Object (Function, in addition to these built-in reference types, you can also use the keyword function/Function to define the type. The code above is a way to define the Function Cat type and instance, you can also create an instance of Function type by calling a special template Function:

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

In terms of usage, Cat uses different identities. As a type template, it can act as a constructor to create instances, for example, var cat = new Cat (); of course, the instance actually does not have any attributes, and all inherits the Object instance;

Method for creating an Object instance: var o = new Object (); var o = {};

Method for creating a Function instance: var f = new Function ("return 1"); var f = function () {return 1 ;}

Object. constructor = Function. Is the Object constructor actually a Function method?

That is to say, all instances are created through the constructor Function..


First, create an instance in a simple and crude way:

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

Using the cat. constructor attribute or cat instanceof Object, cat is an instance constructed by the Object function. All the attributes of cat inherit from the sub-Obeject function except name and age.

The above code can also be replaced:

var cat  =new Object();cat.name = 'xiaoqi';cat.age ='1';


The Object function is the original template of all objects.

If developers familiar with Java and C ++ need to understand that Object functions are templates of all objects, they must change their concepts. In Javascript, a function is a common function and a real object. Therefore, in addition to the Code in the function body, as an object, it can also have other attributes. In addition, it also has a special capability, that is, to create a new object as a constructor.

function Cat(name, age){   this.name = name;   this.age = age;}      Cat("xiaoqi",1);

When the function Cat is called as a general function, it does change the two attributes of the object referred to by this as described by itself. At the same time, the function Cat is also an Object for some basic attributes such as call, apply, prototype, and so on, in addition, you can add, delete, and modify attributes. Therefore, the above Code is replaced:

Cat. call (this, ["xiaoqi", 1]);

So far, the Cat function has already had a number of roles, that is, the function is an object, and its capabilities are not limited:

Special functions-Constructor

The so-called special functions are completely called by the publisher. The Cat function itself is a constructor. Its syntax is similar to that of a General function. The difference is how we call it:

function Cat(name, age){   this.name = name;   this.age = age;}var cat = new Cat("xiaoqi", 1);

Familiar with Java is certainly very familiar with the last line of new keywords, but there is no corresponding definition of class Cat here. It seems that all the mysteries are in this Cat function. We know that Javascript has an original template, and that the template of all objects is an Object, and the Cat function will automatically inherit the Object, then, this constructor can create a new Object using the Object template. In this case, this does not point to the called function, but to the newly created object. Therefore, we can define more attributes for Cat in the constructor:

function Cat(name, age){   this.name = name;   this.age = age;   this.play =function(){   }}var xiaoqi = new Cat("xiaoqi",1);var daqi = new Cat("daqi",2);xiaoqi.play(); daqi.play();

Therefore, the function is used to represent the writing of a type. If the access level is not considered, it is more concise and clear to write more classes than Java. Of course, Javascript does not want to become Java, and cannot replace Java. Next we will continue to discuss another important feature of object orientation, Inheritance.

Implement inheritance using the prototype attribute

Suppose there is already a constructor:

function Animal(){this.run= function(){}}

When we create a specific Animal type, such as Cat, we want to be able to add this Animal by running the inheritance method. Javascript is implemented through the prototype attribute:

function Cat(name, age){   this.name = name;   this.age = age;}Cat.prototype = new Animal();Cat.prototype.constructor = Cat;var cat =new Cat("xiaoqi",1);cat.play();

In fact, we need to understand why Cat. prototype can be inherited. Let's take a look at what happened when Cat. prototype = new Animal (); is called?

Let's first look at a simple constructor:

Function Simple () {}// this code is equivalent to: var Simple = new Function ("// body ");
Simple is an instance of the type Function. By default, Simple inherits the Function. all properties in prototype indicate that when new is used to call the constructor, not only the Function body is called for initialization, but also the Function. prototype indicates that the object is copied to the new instance.

Simple is a constructor, so you can continue to construct Simple-based instances:

var simple = new Simple();

Simple is a Simple instance. There is no initialization code in the Simple constructor. All attributes of simple are derived from Simple. prototype. simple. prototype is from Object by default. prototype. That is, the prototype attribute of any Function instance comes from Object. prototype.

To sum up, Any constructor, in addition to the initialization code in the function body, also copies the objects mentioned in prototype to the new instance. If the new instance is a Function instance, it inherits the prototype attribute from the Object by default.


Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.