文档章节

初识JavaScript中的模块

小王JOJO
 小王JOJO
发布于 2015/04/13 17:08
字数 504
阅读 98
收藏 5

模块

    模块可以提供一个接口,并且隐藏其中的状态与实现的的函数或者对象,利用模块我们可以完全屏蔽全局变量的使用(全局变量太坑了,55555)

一个小例子

Function.prototype.method = function(name,func){
	this.prototype[name] = func;
	return this;
}
String.method("def",function(){
	var ent = {
		quot:'""',
		lt:'<',
		gt:'>'
	};
	//这里的整个匿名自执行函数是window调用的
	//this---->window


	
	return function(){
		return this.replace(/&([^&;]+);/g,function(a,b){
			var r = ent[b];
			return typeof r ==="string" ? r : b;
		});
	};

}());




/**************test*********************/
var  a = "&lt;&quot;&gt;".def();
console.log(a);//<"">

在String的自定义def属性 , 这个属性是一个自执行函数, 它会return一个新的函数,并赋值给def(比较绕........),这个新的函数就是最终的在String添加的def方法,只有他才有权力访问内部的ent 对象

一个单例模式

再看一个生成密匙的例子

<!-- lang: js -->
//模块生成安全的对象
var serial_maker = function (){
	var prefix = "";
	var seq = 0;
	return {	
		set_seq:function(s){
			seq = s;
		},
		set_pre:function(p){
			prefix = p;
		},
		gensym:function(){
			var result = prefix + seq;
			seq += 1;
			return result;
		}
	}
}

var seqer = serial_maker();
seqer.set_pre("W");
seqer.set_seq(100);

console.log(seqer.gensym());//W100
console.log(seqer.gensym());//W101
console.log(seqer.gensym());//W102

这里在是返回一个对象,这个对象里的属性是函数,这些函数能访问serial_maker 中定义的变量,而且外面是无法修改serial_maker变量中的值的,serial_maker 返回的值是唯一的

#PS

模块是JavaScript编程的重要思想 , 其实很多情况下,我感觉用模块是比较好的选择,并不是一定要用面向对象的思想,好多框架也是建立在模块的基础的上,比如jQuery,使用的就是架构用面向对象,内部实现使用模块的模式,影响比较神的是jQuery在延迟对象和回调函数部分,内部就使用了模块的方法实现

© 著作权归作者所有

共有 人打赏支持
小王JOJO
粉丝 1
博文 7
码字总数 5082
作品 0
西青
程序员
Node.js---01、初识NodeJS和Node.js的HTTP服务器搭建

一、前言 我们先从以下几个方面在大体上认识一下Node.js: Node.js 是什么?==> 运行环境 是一个 可以运行 并加载 ES语法的 脚本运行环境 JS(ES5)、ES6、Common.js 语法 …… Node.js 可以加...

秋季长青
2017/11/06
0
0
React Native 从入门到原理

React Native 是最近非常火的一个话题,介绍如何利用 React Native 进行开发的文章和书籍多如牛毛,但面向入门水平并介绍它工作原理的文章却寥寥无几。 本文分为两个部分:上半部分用通俗的语...

guozhendan
06/26
0
0
Node.js模块与npm包管理

一、Node.js模块对象的属性 在Node.js模块内部,模块对象具有以下的属性: module.id:属性值是当前模块的id,在默认情况下,主模块的ID属性值是“.”,其他模块的ID属性值为该模块文件的绝对...

同Young不同样
08/10
0
0
谈谈神秘的ES6——(一)初识ECMAScript

谈谈神秘的ES6——(一)初识ECMAScript 在《零基础入门JavaScript》我们就说过,ECMAScript是JavaScript的核心,是JavaScript语法和语义的解释器,同时也是一个标准。而ECMAScript标准其实也...

JandenMa
07/18
0
0
用js来实现那些数据结构及算法—目录

  首先,有一点要声明,下面所有文章的所有内容的代码,都不是我一个人独立完成的,它们来自于一本叫做《学习JavaScript数据结构和算法》(第二版),人民邮电出版社出版的这本书。github代...

zaking
05/10
0
0

没有更多内容

加载失败,请刷新页面

加载更多

在t-io老巢造谣,不过有造谣的就会有反造谣的!

只发当事人的截图,不发表评论,以免有引导嫌疑 PS: 截图是由不同的人发过来的 本人已经不在此微信群 图3:有造谣的,就有反造谣的 图4是2018-09-23的t-io官方群的一个发言小统计,有助于让...

talent-tan
今天
75
0
heartbeat 资源

drbd+apache+heartbeat : http://blog.51cto.com/11838039/1827901 heartbeat双机热备的架设 : http://blog.51cto.com/11838039/1827560 对heaetbeat的深一步认识 : http://blog.51cto.co......

寰宇01
今天
4
0
Spring 转换 model 为 json 时增加属性

缘起 目前的项目中有个需求是在附件对象转换成 json 时增加个 url 属性,以前的方式是在返回附件对象或列表时候做一次统一处理,这次想看看 spring 或者 jackson fasterxml 是否自带类似功能...

郁也风
今天
4
0
10大PHP比特币开源项目

如果你是一个Phper,如果你希望学习区块链,那么本文列出的 10个开源的Php比特币项目,将有助于你了解在自己的应用中 如何加入对比特币的支持。 如果你希望快速掌握使用Php对接比特币钱包的方...

汇智网教程
今天
5
0
springclould feign客户端添加全局参数

用springclould feign作为调用服务的客户端,一般来说参数可以写在feignclient的方法参数里 有时需要所有feign请求都统一添加一些参数,例如token用于鉴权等,可以这样做: 添加一个配置类,...

canneljls
今天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部