JavaScript article: Creating object Patterns

Source: Internet
Author: User
Tags shallow copy

/*
Object creation Mode
In addition to the normal object literals and the use of constructors to create objects, there are many better object creation patterns
1. Namespace 2, Dependency Declaration 3, Module mode 4, sandbox mode
They all help us to organize the code structure of our application, and to reduce the consequences of implicitly global variables.
*/

/*before*/
Anti-module design
Parent = function () {}
Child = function () {}
Module1 = {}
Module1.data = [1,2,3,4]
Module2 = {}


/*
Name space
*/
var Newapp = {}

Newapp. Parent = function () {}
Newapp. Child = function () {}
Newapp.modules = {}
NEWAPP.modules.module1 = {}
NEWAPP.modules.module1.data = [1,2,3,4]
NEWAPP.modules.module2 = {}

/*
The advantage is that you avoid naming conflicts,
The disadvantage is that the code volume increases, any part of the code can modify the global instance, parsing query time is longer
*/

/*
In order to ensure that the global variables we declare do not conflict with the variables of other files, we can determine if they already exist.
*/
if (typeof Newapp = = = = "undefined") {
...
}
Or

var Newapp = Newapp | | {};

/*
Additional checks increase the repetition and volume of the code, encapsulating it as a function to invoke
*/
var Newapp = Newapp | | {};
Newapp.namespace = function (ns_string) {
var parts = ns_string.split ('. '),
Parent = Newapp,
I
;
if (parts[0] = = = "Newapp") {
Parts = Parts.slice (1);
}
for (i = 0, len = parts.length; i < Len; i++) {
if (typeof parent[parts[i]] = = = "undefined") {
Parent[parts[i]] = {}
}
Parent = parent[parts[i]];
}
return parent;
};
Assigns the return value to a local variable
var module1 = newapp.namespace (' NEWAPP.modules.module1 ');
return True
Console.log (Module1 = = = NEWAPP.modules.module1);


/*
declaring dependencies
*/
var myFunction = function () {
Depend on
var event = NEWAPP.util.Event,
Dom = NEWAPP.util.dom
;
Working with time and DOM variables
}
The script file that is used is declared in the display.
The resolution of local variables is faster than the resolution of global variables and only one global variable is parsed.
Local variables can be compressed

/*
Private members and methods
*/
For literals created objects and constructors using the "This" keyword to create variables and methods that can be accessed and modified externally
To turn a method and property into private, you just need to make it a local variable of the function
function inner () {
var name = "CJs";
This.getname = function () {
return name;
};
}
var out = new Inner ();
Could not get name
Console.log (Out.name);
Get By Function GetName
This method is the privileged method
Console.log (Out.getname);
Remember not to return a reference to an object or an array.

/*
Through object literals and privacy
*/
Creating closures with an immediate-running anonymous function for privacy
var obj = {}
(function () {
Private members
var name = "CJs";
Total members, no var!
obj = {
Getname:function () {
return name;
}
};
}());
return name
Obj.getname ();

You can also directly:
var obj = (function () {
var name = "CJs";
return {
Getname:function () {
return name;
}
};
}());
Obj.getname ();

This is the basic framework for module mode


/*
Prototyping and privacy
*/
For common properties and methods, add them to the prototype object as their methods and properties, reducing replication effort and saving memory

function obj () {
Private members
var name = "CJs"
Privileged Common methods
This.getname = function () {
return name;
}
}

Obj.prototype = (function () {
Private members
var age = 18;
Public Prototype method
return {
Getage:function () {
return age;
}
}
}());

var obj1 = new obj ();
Obj1.getname ();
Obj1.getage ();

/*
Reveal the model of Revalation mode
*/
Exposes an object's private methods to public methods by assigning them to external objects as their properties
If the exposed public method is tampered with, it does not affect other exposed public methods
var obj;
(function () {
var name = "CJs";
var age = 18;
var clothes = {
Pants: "Black",
Shirt: "White",
Shoes: "Yellow"
}
function GetName () {
This.what = "Hahahahahha";
return name;
}
function Getage () {
return age;
}
obj = {
Getname:getname,
Getage:getage,
Getlocal:getname,
Clothes:clothes,
Color:clothes,
Name:name,
Localname:name
};

}());

/*
Exposed method because it is only a reference, even if the user is modified, it will not affect other public functions that use internal private functions
The witty design pattern, but also only applies to the function, for the object is not applicable, need to make shallow copy to expose it
*/

/*
Ultimate Mode--------------------------------------------------------Module mode
A combination of the preceding multiple schemas, namespaces, immediate functions, private and privileged members, declaring dependencies
*/
Name space
Newapp.namespace ("NEWAPP.modules.module1")
NEWAPP.modules.module1 = (function () {
Dependency declarations
var dom = NEWAPP.util.Dom,
_event = NEWAPP.util.Event,

Name = "CJs",
Age = 18
;

return {
Public privilege functions
Getname:function () {
return name;
},
Getage:function () {
return age;
}
};
} ());//Instant function

/*
Reveal module mode
The method is similar to the module pattern, except that the method is defined as a private method, exposing the function through return
*/

JavaScript article: Creating object Patterns

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.