JS basics-constructor VS prototype Function

Source: Internet
Author: User

JS basics-constructor VS prototype Function

JS is an object-based language. During usage, you may encounter the problem of copying objects. However, if we directly assign 'obj1 = obj1' values, data overwrite may occur. That is, when the referenced address is consistent during object reference, the object data is modified. In this case, we can use the factory mode to instantiate the object, so that the reference address of the object is consistent, resulting in data coverage. At this time, the problem arises, and the factory mode is used, and the specific object to which the specific instance belongs is unclear, in JS, the constructor is used to solve the data coverage problem of the object instance (the principle is similar to that of other languages ).

1. Constructor

Constructor has been used in other languages. It is usually the same as the class name. But there is no explicit 'class' concept in JS. In my opinion, the objects declared by it are a type to some extent, because each of its objects can have its own corresponding instances.

Constructor solves data coverage:

Function Box (name, age) {this. name = name; this. age = age; this. run = function () {return this. name + this. age + 'running... ';}} function Desk (name, age) {this. name = name; this. age = age; this. run = function () {return this. name + this. age + 'running... ';}}

Call it:

var box1=new Box('lee',22);        var box2=new Desk('john',66);
Alert (box1 instanceof Box); // TRUEalert (box2 instanceof Box); // you can identify the instance of a specific object, FALSE

At the same time, constructor can impersonate an object to change the scope of the object and implement the behavior that it cannot implement. But at the same time, another problem is raised. The constructor is inconsistent with the reference address of the reference type. This shows that two or more identical data are stored in the memory, use memory of the corresponding size for storage, which will undoubtedly cause a waste of memory. Of course, we can use the constructor to declare the reference type separately, but this method is poorly encapsulated and can be easily called by the outside world. Therefore, the prototype is used in JS.

Ii. prototype functions

Each function created in JS has a prototype property, which is also an object. Its purpose is to include attributes and methods that can be shared by all instances of a specific type. As shown in, the prototype object of the function is shared by all instances of the function.


Medium _ proto _ is the pointer to the prototype object. It points to the prototype object, and the constructor is the constructor of the prototype object to execute the specific constructor object. In practical applications, you can use the constructor attribute to change the constructor object to which a prototype object belongs.

Create prototype attributes and methods for a function:

Function Box () {} // The constructor has nothing in it. If so, it is called the instance attribute and the instance method Box. prototype. name = 'lil'; // prototype attribute Box. prototype. age = 22; Box. prototype. run = function () {// The prototype method return this. name + this. age + 'running... ';}
This method can solve the problem of inconsistent referenced addresses (constructor + prototype ).

You can use Box. prototype. isPrototypeOf (box1) to determine the prototype of the instance. At the same time, when creating a function prototype, you can also use a literal method to create a function:

Box. prototype = {name: 'lil', age: 100, run: function () {return this. name + this. age + 'running ...';}}

The above are some basic knowledge about constructor and prototype functions in JS. A summary is as follows:

1. when instantiating a constructor, you must use new to operate the constructor. When declaring the constructor, you do not need a new object, and the new object is hidden.

2. constructor can be used to solve the data overwrite problem in Object Instantiation, but it may cause inconsistent reference addresses.

3. The prototype function solves the issue of inconsistent reference addresses.

4. However, prototype functions can be shared but cannot be rewritten. The original information will be overwritten.

For rewriting problems, you can use the prototype + constructor to perform their respective duties. The following is a detailed summary.

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.