What is a JavaScript constructor

In JavaScript, a constructor is a special function used to initialize a newly created object after the memory of the object is allocated. The object constructor is used to create a special type of object. When the object is first allocated When created, it is used to assign values ​​to member properties and methods by receiving parameters.

The operating environment of this tutorial: Windows 10 system, JavaScript version 1.8.5, Dell G3 computer.

What is a JavaScript constructor?

In object-oriented programming, the constructor is a constructor that is used to create a new object after the memory of the newly created object is allocated. A special function that initializes this object. In JavaScript everything is an object. The object constructor is used to create a special type of object. First, it prepares the object to be used. Second, when the object is first created, it receives parameters to assign values ​​to the member properties and methods.

Object creation

Three basic ways to create objects:

var newObject = {};
// or
var newObject = Object.create( null );
// or
var newObject = new Object();

When the Object constructor creates an object wrapper for a specific value, or when no value is passed, it will create an empty object and returns it.

Four ways to assign a key-value pair to an object:

// ECMAScript 3 兼容形式
// 1. “点号”法
// 设置属性
newObject.someKey = "Hello World";
// 获取属性
var key = newObject.someKey;
// 2. “方括号”法
// 设置属性
newObject["someKey"] = "Hello World";
// 获取属性
var key = newObject["someKey"];
// ECMAScript 5 仅兼容性形式
// For more information see: http://kangax.github.com/es5-compat-table/
// 3. Object.defineProperty方式
// 设置属性
Object.defineProperty( newObject, "someKey", {
    value: "for more control of the property's behavior",
    writable: true,
    enumerable: true,
    configurable: true
});
// 如果上面的方式你感到难以阅读，可以简短的写成下面这样：
var defineProp = function ( obj, key, value ){
    var config = {
        value
    }
  Object.defineProperty( obj, key, config );
};
// 为了使用它，我们要创建一个“person”对象
var person = Object.create( null );
// 用属性构造对象
defineProp( person, "car",  "Delorean" );
defineProp( person, "dateOfBirth", "1981" );
defineProp( person, "hasBeard", false );
// 还可以创建一个继承于Person的赛车司机
var driver = Object.create( person );
// 设置司机的属性
defineProp(driver, "topSpeed", "100mph");
// 获取继承的属性 (1981)
console.log( driver.dateOfBirth );
// 获取我们设置的属性 (100mph)
console.log( driver.topSpeed );
// 4. Object.defineProperties方式
// 设置属性
Object.defineProperties( newObject, {
  "someKey": { 
    value: "Hello World", 
    writable: true 
  },
  "anotherKey": { 
    value: "Foo bar", 
    writable: false 
  } 
});
// 3和4中的读取属行可用1和2中的任意一种

Basic constructor

As we saw earlier, JavaScript does not support the concept of classes, but it does have a constructor function that works with objects. Using the new keyword to call this function, we can tell JavaScript to use this function as a constructor, which can initialize an object with its own defined members.

Inside this constructor, the keyword this refers to the object just created. Back to object creation, a basic constructor looks like this:

function Car( model, year, miles ) {
  this.model = model;
  this.year = year;
  this.miles = miles;
  this.toString = function () {
    return this.model + " has done " + this.miles + " miles";
  };
}
// 使用:
// 我们可以实例化一个Car
var civic = new Car( "Honda Civic", 2009, 20000 );
var mondeo = new Car( "Ford Mondeo", 2010, 5000 );
// 打开浏览器控制台查看这些对象toString()方法的输出值
console.log( civic.toString() );
console.log( mondeo.toString() );

The above is a simple version of the constructor pattern, but it has two problems:

It is difficult to inherit

In each object created by the Car constructor, functions such as toString() are redefined

This is not very good. The ideal situation is that all Car type objects should reference the same function

Use the "prototype" constructor

In JavaScript, functions have a prototype attribute. When we call the JavaScript constructor to create an object, the properties on the constructor prototype can be accessed and called for the created object

function Car( model, year, miles ) {
  this.model = model;
  this.year = year;
  this.miles = miles;
}
// 注意这里我们使用 Object.prototype.newMethod 而不是 Object.prototype ，以避免我们重新定义原型对象
Car.prototype.toString = function () {
  return this.model + " has done " + this.miles + " miles";
};
// 使用:
var civic = new Car( "Honda Civic", 2009, 20000 );
var mondeo = new Car( "Ford Mondeo", 2010, 5000 );
console.log( civic.toString() );
console.log( mondeo.toString() );

Through the above code, a single toString() instance is accessed by all Car objects are shared.

Related recommendations: javascript learning tutorial

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