沙箱模式:

  • 解决空间命名模式的几个缺点:

    • 命名空间模式中无法同时使用一个应用程序或库的两个版本运行在同一个页面中,因为两者需要相同的全局符号;
    • 以点分割,需要输入更长的字符,解析时间也更长;
  • 全局构造函数 //在命名空间模式中,可以使用全局对象;在沙箱模式中主要使用全局构造函数
    • 添加特征:

      • 强制new模式
      • 接受额外配置参数,指定对象实例所需的模块名;
    • 例子
      Sandbox(['ajax','event'], function (box) {});
      --------------
      Sandbox('ajax', 'event', function (box) {});
      ---------------
      可以设置参数*表示所有可用的模块;或者不设参数来默认 Sandbox(*, function (box) {});
      Sandbox(function (box) {});
  • 增加模块: 通过增加静态属性
    Sandbox.modules = {};
    Sandbox.modules.dom = function(box) {
    box.getElement = function(){};
    box.getStyle = function(){};
    box.foo = 'bar';
    }
    Sandbox.modules.event = function(box) {
    //如果需要访问Sandbox原型
    box.constructor.prototype.m = 'mmm';
    box.attachEvent = function() {};
    box.dettachEvent = function() {};
    }
    Sandbox.modules.ajax = function(box) {
    box.makeRequest = function() {};
    box.getRequest = function() {};
    }
  • 实现构造函数
    function Sandbox() {
    //将参数转化为数组
    var args = Array.prototype.slice.call(arguments),
    //最后一个是回调函数
    callback = args.pop(),
    //提取数组或单独的模块
    modules = (args[0] && typeof args[0] === 'string') ? args : args[0],
    i;
    //强制new模式
    if(!(this instanceof Sandbox)) {
    return new Sandbox(modules, callback);
    }
    //向this添加需要的属性
    this.a = 1;
    this.b = 2;
    //向this对象添加模块
    //不指定模块或‘*’都表示使用所有模块
    if(!modules || modules === '*') {
    modules = [];
    for(i in Sandbox.modules) {
    if (Sandbox.modules.hasOwnProperty(i)) {
    modules.push(i);
    }
    }
    }
    //初始化所需模块
    for(i = 0; i < modules.length; i++) {
    Sandbox.modules[modules[i]](this);
    }
    callback(this);
    }
    //添加需要的原型属性
    Sandbox.prototype = {
    name: 'My Application',
    version: '1.0',
    getName: function() {
    return this.name;
    }
    }

静态成员: 静态属性和方法就是那些从一个实例到另一个实例都不会发生改变的属性和方法

  • 公有静态成员:

    var Gadget = function(price) {
    this.price = price;
    };
    //静态方法
    Gadget.isShiny = function () {
    var msg = 'you bet';
    if(this instanceof Gadget) {
    msg += ', it costs $' + this.price + ' !';
    }
    return msg;
    }; Gadget.prototype.isShiny = function() {
    return Gadget.isShiny.call(this);
    } var a = new Gadget('499.99');
    a.isShiny();
  • 私有静态成员:
    • 同一个构造函数创建的所有对象共享该成员;
    • 构造函数外部不能访问该成员;
      var Gadget = (function () {
      //静态变量/属性
      var counter = 0,
      NewGadget;
      NewGadget = function () {
      counter++;
      }
      //特权方法
      NewGadget.prototype.getLastId = function () {
      console.log(counter);
      }
      //
      return NewGadget;
      })(); var g1 = new Gadget();
      g1.getLastId();

对象常量:

  • 通用实现方法

    var  constant = (function () {
    var constants = {},
    ownProp = Object.prototype.hasOwnProperty,
    allowed = {
    string: 1,
    number: 1,
    boolean: 1
    },
    prefix = (Math.random() + '_').slice(2);
    return {
    set: function(name, value) {
    if(this.isDefined(name)) {
    return false;
    }
    if(!ownProp.call(allowed, typeof value)) {
    return false;
    }
    constants[prefix + name] = value;
    return true;
    },
    isDefined: function (name) {
    return ownProp.call(constants, prefix + name);
    },
    get: function (name) {
    if(this.isDefined(name)) {
    return constants[prefix + name];
    }
    return null;
    }
    }
    })();
    • set(name, value);
    • isDefined(name);
    • get(name);

链模式:用于调用对象的方法,当创建的方法返回值是无任何意义的值时,可以使它们返回this;

  • 优点:代码更简洁,;可以分割函数创建简短,具有特定功能的函数,而不是创建实现太多功能的函数;
  • 缺点:难以调试

method方法:语法糖的一种

例子:

if(typeof Function.prototype.method !== 'function') {
Function.prototype.method = function (name, implementation) {
this.prototype[name] = implementation;
return this;
}
}; var Person = function (name) {
this.name = name;
}
.method('getName', function () {
return this.name;
})
.method('setName', function (name) {
this.name = name;
return this;
}); var a = new Person('Adam');

  

javascript优化--07模式(对象)02的更多相关文章

  1. javascript优化--06模式(对象)01

    命名空间: 优点:可以解决命名混乱和第三方冲突: 缺点:长嵌套导致更长的查询时间:更多的字符: 通用命名空间函数: var MYAPP = MYAPP || {}; MYAPP.namespace = ...

  2. javascript优化--11模式(设计模式)02

    策略模式 在选择最佳策略以处理特定任务(上下文)的时候仍然保持相同的接口: //表单验证的例子 var data = { firs_name: "Super", last_name ...

  3. javascript优化--09模式(代码复用)02

    原型继承 ://现代无类继承模式 基本代码: var parent = { name : "Papa" } var child = object(parent); function ...

  4. javascript优化--13模式1(DOM和浏览器模式)

    注意分离: 通过将CSS关闭来测试页面是否仍然可用,内容是否依然可读: 将JavaScript关闭来测试页面仍然可以执行正常功能:所有连接是否正常工作:所有的表单是否可以正常工作: 不使用内联处理器( ...

  5. javascript优化--08模式(代码复用)01

    优先使用对象组合,而不是类继承: 类式继承:通过构造函数Child()来获取来自于另一个构造函数Parent()的属性: 默认模式:子类的原型指向父类的一个实例 function inherit(C, ...

  6. javascript优化--05模式(函数)

    回调函数模式: 基本例子: var findNodes = function (callback) { ...................... if (typeof callback !== ' ...

  7. javascript优化--10模式(设计模式)01

    单体模式:保证一个特定类仅有一个实例;即第二次使用同一个类创建新对象时,应该得到与第一个所创建对象完全相同对象: 在JS中,可以认为每次在使用对象字面量创建对象的时候,实际上就在创建一个单体: 当使用 ...

  8. javascript优化--12模式(设计模式)03

    观察者模式 通过创建一个可观察的对象,当发生一个感兴趣的事件时将该事件通告给所有观察者,从而形成松散的耦合 订阅杂志 //发布者对象 var publisher = { subscribers: { ...

  9. javascript优化--14模式2(DOM和浏览器模式)

    远程脚本 XMLHttpRequest JSONP 和XHR不同,它不受同域的限制: JSONP请求的可以是任意的文档: 请求的URL通常格式为http://example.js?calback=Ca ...

随机推荐

  1. 关于windows系统下 webpack的使用

    最近包子在研究webpack打包,发现,真是个好东西,以前完全不懂,其实很简单,步骤如下: 1.安装webpack嘎嘎嘎嘎~~~ 2.初始化一下 3.这玩意是啥,我不知道,就依葫芦画瓢 4.这玩意是啥 ...

  2. pdo调用

    php单次调用,例题 <body> <?php //造DSN:驱动名:dbname=数据库名;host=服务器地址 $dsn = "mysql:dbname=mydb;ho ...

  3. 机器学习公开课笔记(8):k-means聚类和PCA降维

    K-Means算法 非监督式学习对一组无标签的数据试图发现其内在的结构,主要用途包括: 市场划分(Market Segmentation) 社交网络分析(Social Network Analysis ...

  4. PHP数字格式化,每三位逗号分隔数字,可以保留小数

    在报价的时候为了给浏览者更清晰明确的数字,所以需要用到数字格式化,有两种方法,一种自己写函数,另一种当然是系统自带的,其实我更喜欢系统自带的. 先来系统简单的: string number_forma ...

  5. 白手起家搭建django app

    $django-admin.py startproject web2 $cd web2/ $python manage.py startapp blog $vim web2/settings.py 注 ...

  6. [BZOJ2959]长跑——新技能:LCT+缩圈

    [BZOJ2959]长跑 试题描述 某校开展了同学们喜闻乐见的阳光长跑活动.为了能“为祖国健康工作五十年”,同学们纷纷离开寝室,离开教室,离开实验室,到操场参加3000米长跑运动.一时间操场上熙熙攘攘 ...

  7. lvs之dr技术的学习与实践

    1.配置测试环境 修改IP windows 200.168.10.4 lvs server  ip:200.168.10.1 因为IP隧道模式只需要一个网卡  所以就停掉其他网卡 web server ...

  8. WPF 布局总结

    一.WPF布局原理 WPF窗口只能包含单个元素,为在WPF窗口中放置多个元素,需要放置一个容器,让后在容器中添加其他元素.“理想的”WPF窗口需遵循以下几个原则: 1.不应显示设定元素的尺寸.元素应当 ...

  9. CPU供电维修

  10. html 构建响应式网站之viewport的使用

    在网页代码的头部,加入一行viewport元标签 <!DOCTYPE html> <html lang="en"> <head> <met ...