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


    命名空间:

    • 优点:可以解决命名混乱和第三方冲突;
    • 缺点:长嵌套导致更长的查询时间;更多的字符;
    • 通用命名空间函数:
      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 < parts.length; i++) {
            if(typeof parent[parts[i]] === 'undefined') {
                parent[parts[i]]  = {};
            }
             parent = parent[parts[i]];
         }
         return parent;
      }
      var module2 = MYAPP.namespace('MYAPP.modules.module2');

    声明依赖关系:虽然已经进行了模块化命名,但再声明依赖能更优化

    如对于:MYAPP, MYAPP.util.Event, MYAPP.util.Dom;
    //在一个函数或模块顶部进行声明
    
    var  myFunc = function() {
       var event = MYAPP.util.Event;
       var dom = MYAPP.util.Dom;
    ................
    } 
    

    解析局部变量的速度比解析全局变量快;

    私有属性:

    • 私有属性和特权方法:构造函数方法
      function Gadget() {
         var name = 'iPod';
         this.getName = function () {
              return name;
         }
      }
      

      注意,如果私有属性设置是一个对象,且只读,那么不要将它直接返回,而是返回其浅复制后的副本;  

    • 私有属性:对象/匿名即时调用函数
      var myobj = (function () {
         var name = 'my';
         return {
            getName: function () {
                 return name; 
             }
         }
      }());
      
      myobj.getName();
    • 私有属性:原型   如果是所有创建对象都需要的私有属性,可以设置到原型中
      Gadget.prototype = (function () {
         var browser = 'Mobile Webkit';
         return {
              getBrowser: function () {
                   return browser; 
              }
         }
      })

    模块模式:

    • 组合:
      • 命名空间
      • 即时函数
      • 私有和特权成员
      • 声明依赖
    • 例子
      var 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 < parts.length; i++) {
            if(typeof parent[parts[i]] === 'undefined') {
                parent[parts[i]]  = {};
            }
             parent = parent[parts[i]];
         }
         return parent;
      };
      MYAPP.namespace('MYAPP.utilities.array');
      MYAPP.utilities.array = (function () {
      	   //依赖
         var uobj = MYAPP.utilities.object,
         	   ulang = MYAPP.utilities.lang,
         	   //私有属性
         	   array_string= '[object Array]',
         	   ops = Object.prototype.toString,
         	   //...
         	   //私有方法
             inArray =  function (needle, haystack) {
         		for(var i = 0, max = haystack.length; i < max; i++) {
         			if(haystack[i] === needle) {
         				return true;
         			}
         		 }
         	   },
         	   isArray = function (a) {
         		return ops.call(a) === array_string;
         	   };
      
         //可选的一次性初始化过程
      
         //公有API
         return {
         	inArray:inArray,
         	isArray:isArray,
         	//...
         }
      })();
    • 例子:使用构造函数
      MYAPP.namespace('MYAPP.utilities.Array');
      MYAPP.utilities.Array = (function () {
      	   //依赖
         var uobj = MYAPP.utilities.object,
         	   ulang = MYAPP.utilities.lang,
         	   //私有属性和方法
         	   Constr;
      
         //可选的一次性初始化过程
         //....
      
         //公有API-构造函数
         Constr = function(o) {
         	 this.elements = this.toArray(o);
         };
         //公有API-原型
         Constr.prototype = {
         	constructor: MYAPP.utilities.Array,
         	version: '2.0',
         	toArray: function (obj) {
         		for (var i = 0, a = [], len = obj.length; i < len; i++) {
         			a[i] = obj[i];
         		}
         		return a;
         	}
         }
         //返回要配置给新空间的构造函数
         return Constr;
      })();
      var arr = new MYAPP.utilities.Array(['a','b']);
    • 将全局变量导入模块中
      MYAPP.utilities.module = (function (app, global) {})(MYAPP, this);
      

        

  • 相关阅读:
    一剑走四方华山论剑
    本命年之冬去春来
    time of our lives从世界杯主题曲看厚脸皮的德国人:)
    我回来啦:)
    PHP undefined index的几种解决方法
    Nginx 502 Bad Gateway错误及解决方案收集
    Nginx Cache的5种方案
    PHP中ts和nts版本 vc6和vc9编译版本的区别
    Linux 查看连接数命令
    Nginx Proxy 作图片缓存配置文件
  • 原文地址:https://www.cnblogs.com/jinkspeng/p/4155238.html
Copyright © 2020-2023  润新知