JavaScript design Pattern Object Factory function and the construction function detailed _ Basics

Source: Internet
Author: User

The following text details and code analysis to share the following JavaScript design pattern object Factory function and constructor knowledge.

Overview using object literals, or dynamically adding new members to empty objects, is the easiest way to create an object. However, in addition to these two common ways of creating objects, JavaScript provides other ways to create objects. 1. Create an object using a factory function we can write a function that creates an object that can be created.

Overview

Using object literals, or dynamically adding new members to empty objects, is the easiest way to create an object.
However, in addition to these two common ways of creating objects, JavaScript provides other ways to create objects.
1). creating objects using Factory functions

We can write a function that is the function of creating an object, which can be called the object factory method.

Copy Code code as follows:

//factory function     
 function Createperson (name, age , job) {        
 var o = new Object ();         
 o.name = name;        
 o.age = age;        
 o.job = job;         
 o.sayname = function () {           & nbsp
 console.info (this.name);        
 };         
 return o;     }//Create object using Factory function   & nbsp; 
 var person1 = Createperson (' John ', 29, ' software engineer ');    
 var Person2 = Createperson (' Dick ', 40, ' doctor ');

2). Defining an object constructor

a). To capitalize the first letter of an object construction function
b). Use this keyword internally to add members to an object
c). Invoking an object constructor using the New keyword

Copy Code code as follows:

Define the object "construct" function
function person (name, age, Job) {
THIS.name = name;
This.age = age;
This.job = job;
This.sayname = function () {

Console.info (this.name);
};
///Use new to invoke object constructor to create object
var p1 = new Person (' John ', 29, ' software engineer ');

var p2 = new Person (' Dick ', 40, ' doctor ');

"Constructors" called in a normal way

A constructor is actually a function, except that it must be called with a "new" keyword, and if not, the call to it is considered a normal function call.

Copy Code code as follows:

The constructor that is called as a normal function, the property that is added through this
becomes the property and method of the Window object.
Console.info (window.name);//John
Console.info (Window.age); 29
Console.info (Window.job); Software engineer

The object constructor looks like this:

Copy Code code as follows:

function person (name) {
THIS.name = name;
This.say = function () {
Return "I am" + this.name;
};
}

In fact this is the case (schematic):

Copy Code code as follows:

function person (name) {
var this = {};
THIS.name = name;
This.say = function () {
Return "I am" + this.name;
};
return this;
}

Work done by constructors

1. Create a new object
2. Let this constructor refer to this new created object
3. Execute the code in the constructor, which usually completes the task of adding properties to the new object
4. Return the newly created object reference to the outside world.
the difference between an object constructor and an object factory method

1. No explicit object creation code in an object constructor
2. The properties and methods that the new object should have are added through this reference.
3. There is no return statement in the object constructor
Typically, the first letter of an object constructor is set to uppercase to distinguish it from a normal function.
Constructor property of an object

A). Create objects using object factory functions, each object's constructor property references object ()

Copy Code code as follows:

var person = Createperson (' John ', 29, ' software engineer ');
Create an object using the factory method,

Its constructor property references the object () function
Console.info (Person1.constructor = = = Object);

True

b). Create an object using an object constructor that references the constructor for each object's constructor property

Copy Code code as follows:

var p = new Person (' John ', 29, ' software engineer ');
Create an object using the object constructor,
The constructor property of each object, referencing this constructor
Console.info (P.constructor = = person);
True how to avoid "forgetting" new? You can use Arguments.callee to solve this problem
Understand the role of Arguments.callee
function Testargumentscallee ()
{
Console.info (this);
Console.info (this instanceof Testargumentscallee);
Console.info (this instanceof Arguments.callee);
};
Testargumentscallee (); Window

False
False
New Testargumentscallee ();
Testargumentscallee
True

True

So, you can use Arguments.callee directly

Copy Code code as follows:

Avoid forgetting new
function MyObject (value)
{
if (!) ( This instanceof Arguments.callee))

{
If the caller forgets to add new, add new and call again

return new MyObject (value);
}
This.prop = value;
}
Test
var obj1 = new MyObject (100);
Console.info (Obj1.prop);//100
var obj2 = MyObject (200);
Console.info (Obj2.prop); 200

The above content is the JavaScript design pattern object Factory function and the construction function detailed explanation, hoped everybody likes.

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.