Home > Web Front-end > JS Tutorial > body text

What are the ways to create objects in javascript

青灯夜游
Release: 2023-01-07 11:41:23
Original
3620 people have browsed it

Creation method: 1. Use the "var object name = {attribute name 1: value 1, attribute name 2: value 2,...};" statement; 2. Use the "var object name = new construction Function name (args);" statement; 3. Use the "Object.create (prototype object, descriptors)" statement.

What are the ways to create objects in javascript

The operating environment of this tutorial: windows7 system, javascript version 1.8.5, Dell G3 computer.

There are three ways to create objects in JavaScript:

  • Object direct quantity

  • Constructing an object

  • Use Object.create

Object direct quantity

Using direct quantity can be fast Creating objects is also the most efficient and simple way. The specific usage is as follows:

var objectName = {
    属性名1 : 属性值1,
    属性名2 : 属性值2,
    ...
    属性名n : 属性值n
};
Copy after login

In object literals, the attribute name and attribute value are separated by colons. The attribute value can be any type of data, and the attribute name can be a JavaScript identifier or a string. type expression. Properties are separated by commas, and no comma is required at the end of the last property.

Example

The following code uses object literals to define two objects.

var o = {  //对象直接量
    a : 1,  //定义属性
    b : true  //定义属性
}
var o1 = {  //对象直接量
    "a" : 1,  //定义属性
    "b" : true  //定义属性
}
Copy after login

Constructing objects

Use the new operator to call the constructor to construct an instance object. The specific usage is as follows:

var objectName = new functionName(args);
Copy after login

Parameter description is as follows:

  • objectName: the returned instance object.

  • functionName: Constructor, basically the same as an ordinary function, but does not need to return a return value and returns an instance object, which can be accessed in advance using this within the function.

  • args: Instance object initialization configuration parameter list.

Example

The following example uses different types of constructors to define various instances.

var o = new Object();  //定义一个空对象
var a = new Array();  //定义一个空数组
var f = new Function();  //定义一个空函数
Copy after login

Use Object.create

Object.create is a new static method in ECMAScript 5, used to create an instance object. This method can specify the object's prototype and object properties. The specific usage is as follows:

Object.create(prototype, descriptors)
Copy after login

The parameter description is as follows:

  • prototype: a required parameter, specifying the prototype object, which can be null.
  • descriptors: Optional parameter, a JavaScript object containing one or more property descriptors. Property descriptors include data properties and accessor properties, where the data properties are described below.
  • value: Specify the attribute value.
  • writable: Default is false, sets whether the attribute value is writable.
  • enumerable: Default is false, set whether the property is enumerable (for/in).
  • configurable: Default is false, set whether attribute characteristics can be modified and attributes deleted.

Accessor properties include two methods, a brief description is as follows:

  • set(): Set the attribute value.

  • get(): Returns the attribute value.

Example

The following example uses Object.create to define an object, inherits null, and contains two enumerable attributes size and shape. The attribute values ​​​​are "large" " and "round".

var newObj = Object.create (null, {
    size : {  //属性名
        value : "large",  //属性值
        enumerable : true  //可以枚举
    },
    shape : {  //属性名
        value : "round",  //属性值
        enumerable : true  //可以枚举
    }
});
console.log(newObj.size);  //large
console.log(newObj.shape);  //round
console.log(Object.getPrototypeOf(newObj));  //null
Copy after login

【Related recommendations: javascript learning tutorial

The above is the detailed content of What are the ways to create objects in javascript. 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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template