1.1 Pattern "theme of recurring events or objects… it can be a template or model which can be used to generate things" (http://en.wikipedia.org/wiki/Pattern). • Design patterns - Elements of Reusable Object-Oriented Software. • Coding patterns -…

7.1 Singleton The idea of the singleton pattern is to have only one instance of a specific class. This means that the second time you use the same class to create a new object, you should get the same object that was created the first time. var obj =…

Scenario You want to use just the methods you like, without inheriting all the other methods that you’ll never need. This is possible with the borrowing methods pattern, which benefits from the function methods  call() and apply(). // call() example…

Loop through arguments and copy every property of every object passed to the function. And the result will be a new object that has the properties of all the source objects. function mix() { var arg, prop, child = {}; for (arg = 0; arg < arguments.le…

Shallow copy pattern function extend(parent, child) { var i; child = child || {}; for (i in parent) { if (parent.hasOwnProperty(i)) { child[i] = parent[i]; } } return child; } Deep copy pattern function extendDeep(parent, child) { var i, toStr = Obje…

No classes involved; Objects inherit from other objects. Use an empty temporary constructor function  F().  Set the prototype of  F() to be the parent object. Return a new instance of the temporary constructor. function Object(o) { function F() {} F.…

Commonalities • There’s a convention on how to name a method, which is to be considered the constructor of the class. • Classes inherit from other classes. • There’s access to the parent class (superclass) from within the child class. The function ta…

// the parent constructor function Parent(name) { this.name = name || 'Adam'; } // adding functionality to the prototype Parent.prototype.say = function () { return this.name; }; // empty child constructor function Child(name) {} inherit(Child, Paren…

In Java you could do something like: Person adam = new Person(); In JavaScript you would do: var adam = new Person(); JavaScript’s constructor invocation looks as if Person were a class, but it’s important to keep in mind that Person is still just a…

Advantage Avoid re-created instance method to this inside of the constructor. method() implementation The method() takes two parameters: • The name of the new method • The implementation of the method if (typeof Function.prototype.method !== "functio…

Chaining Pattern - Call methods on an object one after the other without assigning the return values of the previous operations to variables and without having to split your calls on multiple lines. var obj = { value: 1, increment: function () { this…

Principle Make variables shouldn't be changed stand out using all caps. Add constants as static properties to the constructor function. // constructor var Widget = function () { // implementation... }; // constants Widget.MAX_HEIGHT = 320; Widget.MAX…

Public Static Members // constructor var Gadget = function (price) { this.price = price; }; // a static method Gadget.isShiny = function () { // this always works var msg = "you bet"; // Checking if the static method is called by instance. if (t…

Drawbacks of the namespacing pattern • Reliance on a single global variable to be the application’s global. In the namespacing pattern, there is no way to have two versions of the same application or library run on the same page, because they both ne…

MYAPP.namespace('MYAPP.utilities.array'); MYAPP.utilities.array = (function () { // dependencies var uobj = MYAPP.utilities.object, ulang = MYAPP.utilities.lang, // private properties array_string = "[object Array]", ops = Object.prototype.toStr…

All object members are public in JavaScript. var myobj = { myprop : 1, getProp : function() { return this.myprop; } }; console.log(myobj.myprop); // `myprop` is publicly accessible console.log(myobj.getProp()); // getProp() is public too The same is…

It’s a good idea to declare the modules your code relies on at the top of your function or module. The declaration involves creating only a local variable and pointing to the desired module. var myFunction = function() { // dependencies var event = Y…

global namespace object // global object var MYAPP = {}; // constructors MYAPP.Parent = function() { }; MYAPP.Child = function() { }; // a variable MYAPP.some_var = 1; // an object container MYAPP.modules = {}; // nested objects MYAPP.modules.module1…

Function Application apply() takes two parameters: the first one is an object to bind to this inside of the function, the second is an array or arguments, which then becomes the array-like arguments object available inside the function. If the first…

Configuration Objects Passing a large number of parameters is not convenient. A better approach is to substitute all the parameters with only one and make it an object. var conf = { username: "batman", first: "Bruce", last: "Wayne…

Gets a length property containing the number of arguments the function expects: function func(a, b, c) {} console.log(func.length); var myFunc = function () { // serialize the arguments object as a JSON string and use that string as a key in your cac…

When you know that a certain condition will not change throughout the life of the program, it makes sense to test the condition only once. Browser sniffing (or feature detection) is a typical example. // BEFORE var utils = { addListener : function(el…

JSON: JavaScript Object Notation {"name": "value", "some": [1, 2, 3]}  The only syntax difference between JSON and the object literal is that property names need to be wrapped in quotes to be valid JSON. In object literals th…

Free and open source tools for doc generation: the JSDoc Toolkit (http://code.google.com/p/jsdoc-toolkit/) and YUIDoc (http://yuilibrary.com/projects/yuidoc). Process of generating API documentation • Writing specially formatted code blocks • Running…

1. Capitalizing Constructors var adam = new Person(); 2. Separating Words camel case - type the words in lowercase, only capitalizing the first letter in each word. upper camel case, as in  MyConstructor(), lower  camel  case,  as  in  myFunction(),…

It’s important to establish and follow coding conventions—they make your code consistent, predictable, and much easier to read and understand. A new developer joining the team can read through the conventions and be productive much sooner, understand…

关于for-in循环 循环数据时, 强烈不推荐使用for-in循环.因为当Array对象被扩展后, 再用for-in循环遍历数据会导致逻辑上的错误, 举例说明: var arr = ['a', 'b', 'c']; // 下标遍历 for(var i=0, len=arr.length; i<len; i++) { console.info(typeof i); // number console.info(i); } // for-in遍历 for(var i in arr) { consol…

第一次写这种东西, 有些生涩和蹩脚, 也是为了自己在表达或是总结方面有所提高, 同时为看过的东西留个痕迹, 以便日后查阅. 有错误或是不妥的地方, 还望各位指正, 谢谢! 第1章 简介 本章主要介绍了本书要讨论的内容, Javascript的一些基本概念, 面向对象, 原型, ECMASCript5, JSLine和console的相关内容. 不做过多阐述, 给出模式的定义 广义上: 模式是一个可以用来产生其他事物的模板或模型. 在软件开发中, 模式是指一个通用问题的解决方案. 书中主要讨论三种…

Disadvantage Other developers using your code will probably expect the built-in JavaScript methods to work consistently and will not expect your additions. Properties you add to the prototype may show up in loops that don't use hasOwnProperty(), so t…

Access a global variable in a browser environment: myglobal = "hello"; // antipattern console.log(myglobal); // "hello" console.log(window.myglobal); // "hello" console.log(window["myglobal"]); // "hello"…