Home > Web Front-end > JS Tutorial > What are js constructor methods?

What are js constructor methods?

PHP中文网
Release: 2017-06-28 11:46:09
Original
1130 people have browsed it

The following will bring you a brief discussion on the methods and prototype of js constructor. The editor thinks it is quite good, so I will share it with you now and give it as a reference for everyone.

When the method is written in the constructor, we call it the method in the function, and when the method is written on the prototype attribute, we call it the method on the prototype.

•Methods within the function: Using the methods within the function we can access the private variables inside the function. If the object we get out of the constructor new needs us To operate private variables inside the constructor, we must consider using methods within the function at this time.

•Methods on prototype: When we need to pass a When a function creates a large number of objects, and these objects have many methods; then we have to consider adding these methods to the prototype of the function. In this case, the memory footprint of our code is relatively small.

•In actual applications, these two methods are often used in combination; so we must first understand what we need, and then choose how to use it


// 构造函数A
function A(name) {
  this.name = name || 'a';
  this.sayHello = function() {
    console.log('Hello, my name is: ' + this.name);
  }
}

// 构造函数B
function B(name) {
  this.name = name || 'b';
}
B.prototype.sayHello = function() {
  console.log('Hello, my name is: ' + this.name);
};

var a1 = new A('a1');
var a2 = new A('a2');
a1.sayHello();
a2.sayHello();

var b1 = new B('b1');
var b2 = new B('b2');
b1.sayHello();
b2.sayHello();
Copy after login

Write two constructors, the first is A, this constructor contains a method sayHello; the second is constructor B, we write the method sayHello on the prototype attribute of constructor B. Writing methods inside the constructor increases the cost of initializing an object through the constructor. Writing methods on the prototype attribute effectively reduces this cost. You may feel that calling methods on an object is better than calling its The methods on the prototype chain are much faster. In fact, this is not the case. If your object does not have a lot of prototypes, their speeds are actually about the same.

In addition, it is necessary Some things to note:

•First of all, if you define a method on the prototype attribute of a function, keep in mind that if you change a method, all the data generated by this constructor will All methods of the object will be changed.

• Another point is the problem of variable promotion. We can take a look at the following code:


func1(); // 这里会报错,因为在函数执行的时候,func1还没有被赋值. error: func1 is not a function
var func1 = function() {
  console.log('func1');
};

func2(); // 这个会被正确执行,因为函数的声明会被提升.
function func2() {
  console.log('func2');
}
Copy after login

• Regarding the issue of object serialization. The attributes defined on the prototype of the function will not be serialized. You can see the following code:


function A(name) {
  this.name = name;
}
A.prototype.sayWhat = 'say what...';

var a = new A('dreamapple');
console.log(JSON.stringify(a));
Copy after login

We can see the output results Is {"name":"dreamapple"}

The above is the detailed content of What are js constructor methods?. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template