Home  >  Article  >  Web Front-end  >  Three ways to create objects in JavaScript_js object-oriented

Three ways to create objects in JavaScript_js object-oriented

WBOY
WBOYOriginal
2016-05-16 18:44:25811browse

There are several ways to create objects in JavaScript:
(1) Use built-in objects
(2) Use JSON symbols
(3) Custom object construction

1. Using built-in objects

The built-in objects available in JavaScript can be divided into two types:
1, JavaScript language native objects (language-level objects), such as String, Object, Function, etc.;
2 , the host object (environment host-level object) of JavaScript runtime, such as window, document, body, etc.

What we call using built-in objects refers to instantiating a new object through the construction method of JavaScript language native objects. For example:

Copy code The code is as follows:

var str = new String("Instance initialization String ");
var str1 = "String directly assigned";
var func = new Function("x","alert(x)");//Example initialization func
var o = new Object ();//Example to initialize an Object

2. Use JSON symbols

(i) What is JSON?
JSON (JavaScript Object Notation) That is, JavaScript object naming is a lightweight data exchange format that is easy to read and write, as well as easy to parse and generate. It is based on a subset of "JavaScript Programming Language, Standard ECMA-262 3rd Edition - December 1999". JSON is a completely language-independent text format, making it an ideal format for data exchange.

JSON, as a component of JavaScript, is also provided by a series of languages ​​such as ActionScript, C, C#, ColdFusion, E, Java, JavaScript, ML, ObjectiveCAML, Perl, PHP, Python, Rebol, Ruby, Lua, etc. support, making JSON the preferred solution for Ajax development.

There are two ways to construct JSON. One is to use a simple collection of "key/value pairs", which is understood in different languages ​​as objects, records, structures, dictionaries, hash tables, keys List, or associative array, etc. The other uses an ordered list of values, which is understood by most languages ​​as an array.

The commonly used creation method is the first one, which is in the form of a collection of "key/value pairs". In this form, an object starts with "{" (left bracket) and ends with "}" (right bracket). Each "name" is followed by a ":" (colon), and the "key/value" pairs are separated by a "," (comma).

JSON has the following characteristics: (1) Simple formatted data exchange; (2) Easy for people to read and write; (3) Easy for machine analysis and operation.
In JavaScript, JSON is understood as an object. Through JSON in the form of strings, data can be easily parsed into JavaScript and read and passed. Through JSON, the problem that JavaScript objects cannot be serialized and passed as parameters is solved to a certain extent.

1, simple JSON

{name:"Andy Lau",age:"25",sex:"male"}

2, type of JSON value

JSON values ​​can be simple data types, such as numbers, floating point, characters, etc., or arrays and objects. For example, JSON with an array as the member key value:

{member:[{name:"Andy Lau"},{name:"Aaron Kwok"},{name:"Jacky Cheung"},{name:"Dawn" }]}

{
book:[{name:"Romance of the Three Kingdoms"},{name:"Journey to the West"},{name:"Water Margin"},{name:"A Dream of Red Mansions"} ],
author:[{name:"Luo Guanzhong"},{name:"Wu Chengen"},{name:"Shi Naian",{name:"Cao Xueqin"}}]
}

3. Using JSON in JavaScript

JSON is a JavaScript native format, which means that processing JSON data in JavaScript does not require any special API or toolkit. JavaScript treats JSON as an object by default.

Pass the object to a variable, for example:
Copy the code The code is as follows:

var somebooks = {
book:[{name:"Romance of the Three Kingdoms"},{name:"Journey to the West"},{name:"Water Margin"},{name:"A Dream of Red Mansions"}],
author:[{name:"Luo Guanzhong"},{name:"Wu Chengen"},{name:"Shi Naian",{name:"Cao Xueqin"}}]
}

Each "key" of JSON is equivalent to an attribute of the object. For example, to access the first entry in a book, in JavaScript, you can simply use "somebooks.book[0].name" to get "Romance of the Three Kingdoms" this value.

We can not only convert a JSON string into an object, but also "compile" an object into a JSON string to facilitate the transmission of objects in JavaScript. For example:
Copy code The code is as follows:

var Animals = new Object();
Animals.name = "dog";
Animals.sex = "Male";
Animals.age = "2";

The Animals object cannot be serialized and transmitted. Convert the Animals object into a JSON string, that is, "{name:"dog",sex:"Male",age:"2"}". In this way, the JSON string is passed as a parameter of the HTTP request, thereby achieving the purpose of serializing and transmitting the Animals object.

(ii) JSON expresses JavaScript objects in string form. For example:
Copy code The code is as follows:

var myObject = {nickname: "my girlfried" ,name:"big pig"};

JSON actually acts as a protocol for converting between JavaScript objects and strings. Since the "appearance" of JSON can be seen as a string, JSON can play a certain role in JavaScript object transmission. For example, convert the object strObject into a string and transmit it, and then restore it to the object through the eval method after reaching the destination:
Copy code The code is as follows:

function test (o)
{
alert (o.name)
}
var strObject = '{nickname:"my girlfriend" ,name:"big pig"}';
test (eval("(" strObject ")"));

3. Custom object construction

There are two ways to create advanced object construction: using the "this" keyword construction and using the prototype prototype construction. For example:
Copy code The code is as follows:

//Use this keyword to define the context of the construction Attributes
function Girl()
{
this.name = "big pig";
this.age = 20;
this.standing;
this.bust;
this.waist;
this.hip;
}

//Use prototype
function Girl(){}
Girl.prototype.name = "big pig";
Girl.prototype.age = 20;
Girl.prototype.standing;
Girl.prototype.bust;
Girl.prototype.waist;
Girl.prototype.hip;
alert( new Girl().name);

There is essentially no difference between the two definitions in the above example. They both define the attribute information of the "Girl" object. The difference between "this" and "prototype" mainly lies in the order of attribute access. For example:
Copy code The code is as follows:

function Test()
{
this.text = function()
{
alert("defined by this");
}
}
Test.prototype.test = function()
{
alert("defined by prototype");
}
var _o = new Test();
_o.test();//Output "defined by this"

When accessing the properties or methods of an object, the rules for searching the prototype chain will be followed. First look for its own static properties and methods, then look for the accessible properties and methods of the construction context, and finally look for the prototype chain of the construction.

Another difference between the definitions of "this" and "prototype" is that the attributes occupy different spaces. Using the "this" keyword, the example initializes the space required for all properties and methods contained in the constructor for each instance, and uses the "prototype" definition, because "prototype" is actually a reference to the parent. , is just a copy of the data, so it saves resources in initialization and storage than "this".
Statement:
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