策略模式 在选择最佳策略以处理特定任务(上下文)的时候仍然保持相同的接口: //表单验证的例子 var data = { firs_name: "Super", last_name: "Man", age: "unknown", username: "o_0" } validator = { types: {}, message: [], config: {}, validate: function(data) { var i…

单体模式:保证一个特定类仅有一个实例;即第二次使用同一个类创建新对象时,应该得到与第一个所创建对象完全相同对象: 在JS中,可以认为每次在使用对象字面量创建对象的时候,实际上就在创建一个单体: 当使用new创建新对象时 使用静态属性中的实例: function Universe() { if(typeof Universe.instance === 'object') { return Universe.instance; } this.start_time = 0; this.bang = '…

沙箱模式: 解决空间命名模式的几个缺点: 命名空间模式中无法同时使用一个应用程序或库的两个版本运行在同一个页面中,因为两者需要相同的全局符号: 以点分割,需要输入更长的字符,解析时间也更长: 全局构造函数 //在命名空间模式中,可以使用全局对象:在沙箱模式中主要使用全局构造函数 添加特征: 强制new模式 接受额外配置参数,指定对象实例所需的模块名: 例子 Sandbox(['ajax','event'], function (box) {}); -------------- Sandbox('…

观察者模式 通过创建一个可观察的对象,当发生一个感兴趣的事件时将该事件通告给所有观察者,从而形成松散的耦合 订阅杂志 //发布者对象 var publisher = { subscribers: { any: [] //事件类型 }, //将订阅者添加到subscribers数组: subscribe: function(fn, type) { type = type || 'any'; if(typeof this.subscribers[type] === 'undefined') { th…

原型继承 ://现代无类继承模式 基本代码: var parent = { name : "Papa" } var child = object(parent); function object(o) { function F() {}; F.prototype = o; return new F(); } 选择继承的时候可以考虑,传入实例还是构造函数原型: var child = object(parent); var child = object(Parent.prototype)…

注意分离: 通过将CSS关闭来测试页面是否仍然可用,内容是否依然可读: 将JavaScript关闭来测试页面仍然可以执行正常功能:所有连接是否正常工作:所有的表单是否可以正常工作: 不使用内联处理器(onclick之类)和内联样式属性,因为这些不属于内容层: 使用语义上有意义的HTML元素: DOM脚本: DOM访问: //DOM访问的代价是昂贵的 ; 避免在循环中使用DOM访问: 在可能的情况下使用selector API;  /尽可能使用id,getElementById是最便捷的查找方法:…

优先使用对象组合,而不是类继承: 类式继承:通过构造函数Child()来获取来自于另一个构造函数Parent()的属性: 默认模式:子类的原型指向父类的一个实例 function inherit(C, P) { C.prototype = new P(); } function Parent(name) { this.name = name || 'Adam'; } Parent.prototype.say = function () { return this.name; } function…

命名空间: 优点:可以解决命名混乱和第三方冲突: 缺点:长嵌套导致更长的查询时间:更多的字符: 通用命名空间函数: var MYAPP = MYAPP || {}; MYAPP.namespace = function (ns_string) { var parts = ns_string.split('.'); parent = MYAPP; if(parts[0] === 'MYAPP') { parts = parts.slice(1); } for(var i = 0; i < part…

回调函数模式: 基本例子: var findNodes = function (callback) { ...................... if (typeof callback !== 'function') { callback = false; } ................ while(i) { i --; ............ if(callback) { callback(found) } ............ } } 回调方法是对象方法的时候: var fi…

远程脚本 XMLHttpRequest JSONP 和XHR不同,它不受同域的限制: JSONP请求的可以是任意的文档: 请求的URL通常格式为http://example.js?calback=CallFunction <button id="server">Server play</button> <script> var start = { get: function (id) { return document.getElementById(…