_javascript techniques for writing JavaScript to create objects

Source: Internet
Author: User

What is the object
An object is a collection of unordered attributes from a JavaScript definition, and its properties can contain basic values, objects, or functions. That is, an object is a set of properties that do not have a specific order, and each attribute is mapped to a value, a set of key-value pairs, and the value can be data or objects.

The simplest object
JavaScript's pair of curly braces {} can define an object, which is actually the same as invoking the constructor of object

Copy Code code as follows:

var obj={};
var obj2=new Object ();

This constructed object only contains a pointer to the object of the prototype, you can use some valueof, Hasqwnproperty, and other methods, there is little practical effect, custom objects must always have some custom attributes, methods God Horse.

Copy Code code as follows:

var obj={};
obj.a=0;
Obj.fn=function () {
alert (this);
}

var obj2={
a:0,
Fn:function () {
alert (this);
}
}


You can pass the "." After the object is defined. Add properties and methods to it, or you can use the literal assignment method to add properties and methods to the object when you define it. This creates objects whose methods and properties can use object references directly, similar to static and static functions of classes, so that there is an obvious flaw in creating objects--it is laborious to define a large number of objects. To write over and over again is almost repetitive code.

Abstract
Since it is repetitive code can be abstracted, with functions to do these repetitive work, when the object is created to invoke a dedicated method of creating objects, for different attribute values only need to pass the different parameters.

Copy Code code as follows:

function Createobj (A,FN) {
var obj={};
Obj.a=a;
OBJ.FN=FN;
return obj;
}

var obj=createobj (2,function () {
alert (THIS.A);
});

This way, when you create a large number of objects, you can do some repetitive work by calling this method, which is not perfect, because there are many times when you need to judge the type of object, the object created above is the original instance of object, but it extends some properties and methods.

There are some types of

Again, when the function is on the scene, JavaScript function is an object, in the creation of the object can be thrown aside the above createobj method, directly using function as an object, how to achieve reuse it, This is the particularity of function as object.

1. function can accept parameters and can create objects of different values of the same type based on parameters

2. Function as a constructor (called by the new operator) will return an object, in the Chinono version of jquery mentioned some of the basic knowledge of the constructor, simple copy

The return value of the constructor is divided into two cases, when the function has no return statement or returns back to a basic type (bool,int,string,undefined,null), an anonymous object created by new, which is the function instance If the Function body returns a reference type Object (Array,function,object, etc.), the object overrides the anonymous object created by new as the return value.

3. How do I use function to solve type recognition problems, each function instance object will have a constructor attribute (also not "have", but can correspond), this attribute can indicate who it constructs, also can use instanceof operator to determine if the object is an instance of XXX.

Can't just say no practice, code

Copy Code code as follows:

function person (name) {
This.name=name;
This.fn=function () {
alert (this.name);
}
}

var person1=new person (' Byron ');

Console.log (Person1.constructor==person);//true
Console.log (person1 instanceof person); True

It's perfect, and it's not! Although constructors can be object-type, the methods in each instance of an object are repeated!

Copy Code code as follows:

function person (name) {
This.name=name;
This.fn=function () {
alert (this.name);
}
}

var person1=new person (' Byron ');
var person2=new person (' Frank ');

Console.log (PERSON1.FN==PERSON2.FN);//false

Look, although two instances of FN are identical, but not the same thing, if a function object has 1000 methods, then each instance of it contains the copy of these methods, so that memory is not language AH.

It's no fun.

Is there a near-perfect way to construct objects, and without duplication of effort and type, the object-general approach does not have to be repeated? In fact, it can be found that the use of function is already distance required and close, just a little bit--need a container of all the instances of all function objects shared, in this container memory sending instance need to share the properties and methods, just this container is ready-made--prototype, Students who don't know prototype can look at JavaScript prototype

Copy Code code as follows:

function person (name) {
This.name=name;
}

Person.prototype.share=[];

Person.prototype.printname=function () {
alert (this.name);
}

var person1=new person (' Byron ');
var person2=new person (' Frank ');

Console.log (person1.printname==person2.printname);//true

So each person's instance has its own property name, there are instances of shared property share and Method Printname, the basic problem is solved, for general object processing can always this type and love of the creation of object mode.

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.