javascript(模块模式)
2017-03-02 13:41
197 查看
javascript Module(模块)模式
从javascript对象创建说起
说起Module(模块)模式,可能一些刚刚接触javascript的同学还是觉得比较陌生,但是相信大多数学习javascript的同学都知道javascript对象创建的方式。最熟悉的莫过于构造器方式创建对象。Constructor(构造器)模式
基本Construcor(构造器)
function Car(model,year,miles){ this.model = model; this.year = year; this.miles = miles; this.toShow = function(){ return this.model + "已经行驶了:" +this.miles + "公里!"; } } //用法: //可以创建car的新实例 var benz = new Car('Benz',2012,2000); var bmw = new Car('bmw',2014,5000); //打开浏览器控制台(console),查看这些对象上调用toShow()方法的输出 console.log(benz.toShow()); console.log(bmw.toShow())上面是一个最简单的构造器模式的版本,它存在一些问题,比如让继承变得困难。最关键的问题是,
toShow()这样的函数是为每个使用Car构造器创建的新对象而分别重新定义的。最不是最理想的,因为这种函数应该在所有的Car类型实例之间共享。所以后又有了基于原型的构造器对象创建
带原型的Constructor(构造器)
function Car(model,year,miles){ this.model = model; this.year = year; this.miles = miles; } //注意这里直接使用了Object.prototype.newMethod,而不是直接定义Object.prototype是为了避免重新定义prototype对象 /* Car.prototype = { constructor: Car,//这样写需要重新定位constructor toShow:function(){ return this.model + "已经行驶了:" +this.miles + "公里!"; } } */ Car.prototype.toShow = function(){ return this.model + "已经行驶了:" +this.miles + "公里!"; } //用法: var benz = new Car('Benz',2012,2000); var bmw = new Car('bmw',2014,5000); console.log(benz.toShow()); console.log(bmw.toShow());
现在toShow()的单一实例就能在所有Car对象之间共享了。
基本的关于构造器创建对象的模式说完了
以下来讲解:
Module(模块)模式
看一个例子:var basketModule = (function(){ //购物车数组,私有变量 var basket = []; //私有函数 function doSomethingPrivate(){ //。。。 } //私有函数 function doSomethingElsePrivate(){ //。。。 } //返回一个暴露出的公有对象 return { //添加item到购物车 addItems:function(values){ basket.push(values); }, //获得购物车里商品总数 getItemCount:function(){ return basket.length; }, //私有函数的公有形式别名 doSomething:doSomethingPrivate, //获取所有商品的总价格 getTotal:function(){ var itemCount = this.getItemCount(), total = 0; while(itemCount--){ total += basket[itemCount].price; } return total; } }; })(); //用法: basketModule.addItem({ item:"面包", price:5 }); basketModule.addItem({ item:"可乐", price:2 }); //2 console.log(basketModule.getItemCount()); //7 console.log(basketModule.getTotal());
总结
Module模式用于进一步模拟类的概念,通过这种方式,可以使一个单独的对象拥有公有/私有方法和变量,从而屏蔽来自全局作用域的特殊部分。产生的结果是:函数名与在页面上其他脚本定义的函数冲突的可能性降低。
Module模式使用闭包封装”私有”状态和组织。它提供了一种包装混合公有/私有方法和变量的方式,防止其泄露至全局作用域,并与别的开发人员的接口发生冲突。通过该模式,只需返回一个公有API,而其他的一切都维持在私有闭包里面。
这样做为我们提供了一个屏蔽处理底层事件逻辑的整洁解决方案,同时只暴露一个接口供应用程序的其他部分使用。该模式除了返回一个对象而不是一个函数之外,非常类似于一个立即调用的函数表达式(IIFE)。
即:
(function(){
})();
9696
相关文章推荐
- Javascript的一种模块模式
- 深入理解JavaScript 模块模式
- Javascript模块模式学习分享
- 深入理解 JavaScript 模块模式
- 深入理解JavaScript 模块模式
- javascript_静态私有变量,模块模式,增强模块模式
- 理解JavaScript模块模式
- 深入理解JavaScript 模块模式
- Javascript的一种模块模式
- 转Javascript的一种模块模式
- JavaScript编程模式:模块的力量
- JavaScript(2)——模块模式
- Javascript中的单例和模块模式
- Javascript模块模式分析
- [JavaScript]Javascript的一种模块模式
- JavaScript编程模式:模块的力量
- javascript 模式之模块模式
- JavaScript的模块模式