首页 > 编程笔记 > JavaScript笔记 > JS面向对象编程
阅读:62
JS模块化编程简介
模块就是提供一个接口,却隐藏状态与实现的函数或对象。一般在开发中使用闭包函数来构建模块,摒弃全局变量的滥用,规避 JavaScript 缺陷。
全局变量是 JavaScript 最糟糕的特性之一,在一个大型 Web 应用中,全局变量简直就是一个魔鬼,可能带来无穷的灾难。
模块开发的一般形式:一个定义了私有变量和函数的函数,利用闭包创建可以访问到的私有变量和函数的特权函数,最后返回这个特权函数,或者把它们保存到可访问的地方。
使用模块可以避免全局变量的滥用,从而保护信息的安全性,实现优秀的设计实践。使用这种模式也可以实现应用程序的封装,或者构建其它框架。
模块模式通常结合实例模式使用。JavaScript 的实例就是对象字面量表示法创建的,对象的属性值可以是数值或函数,并且属性值在该对象的生命周期中不会发生变化。模块通常作为工具为程序其他部分提供功能支持。通过这种方式能够构建比较安全的对象。
全局变量是 JavaScript 最糟糕的特性之一,在一个大型 Web 应用中,全局变量简直就是一个魔鬼,可能带来无穷的灾难。
示例1
本示例为 String 扩展一个 toHTML 原型方法,该方法能够把字符串中的 HTML 转义字符替换为对应的字符串。//为Function增加method原型方法 Function.prototype.method = typeof Function.prototype.method === "function" ? Function.prototype.method : //先检测是否已经存在该方法,否则定义函数 function (name, func) { if (!this.prototype[name]){ //检测当前类型中是否存在指定名称的原型 this.prototype[name] = func; //绑定原型方法 } return this; //返回类型 }; String.method('toHTML', function () { //为String增加toHTML原型方法 var entity = { //过滤的转义字符实体 quot : '""', lt : '<', gt :'>' }; return function () { //返回方法的函数体 return this.replace(/&([^&;]+);/g, function (a, b) { //匹配字符串中HTML转义字符 var r = entity[b]; //映射转义字符实体 return typeof r === 'string' ? r : a; //替换并返回 }); }; }()); //生成闭包体在上面代码中,为 String 类型扩展了一个 toHTML 原型方法,它调用 String 对象的 replace 方法来查找以
&
开头和以;
结束的字符串。如果这些字符可以在转义字符实体表 entity 中找到,那么就将该字符实体替换为映射表中的值。toHTML 方法用到了一个正则表达式。 return this.replace(/&([^&;]+);/g, function (a, b) { var r = entity[b]; return typeof r === 'string' ? r : a; }); 在最后一行使用()
运算符立刻调用刚刚构造出来的函数。这个调用所创建并返回的函数才是 toHTML 方法。
console.log('<quot;>'); //<quot;> console.log('<quot;>'.toHTML()); //<''>模块利用函数作用域和闭包来创建绑定对象与私有属性的关联。在这个示例中,只有 toHTML 方法才有权访问字符实体表 entity 这个数据对象。
模块开发的一般形式:一个定义了私有变量和函数的函数,利用闭包创建可以访问到的私有变量和函数的特权函数,最后返回这个特权函数,或者把它们保存到可访问的地方。
使用模块可以避免全局变量的滥用,从而保护信息的安全性,实现优秀的设计实践。使用这种模式也可以实现应用程序的封装,或者构建其它框架。
模块模式通常结合实例模式使用。JavaScript 的实例就是对象字面量表示法创建的,对象的属性值可以是数值或函数,并且属性值在该对象的生命周期中不会发生变化。模块通常作为工具为程序其他部分提供功能支持。通过这种方式能够构建比较安全的对象。
示例2
下面示例设计一个能够自动生成序列号的对象。toSerial() 函数返回一个能够产生唯一序列字符串的对象。这个字符串由两部分组成:字符前缀+序列号。这两部分可以分别使用 setPrefix 和 setSerial 方法进行设置,然后调用实例对象的 get 方法来读取这个字符串。没执行该方法,都会自动产生唯一一个序列字符串。var toSerial = function () { //包装函数 var prefix = ''; //私有变量,前缀字符,默认为空字符 var serial = 0; //私有变量,序列号,默认为0 return { //返回一个对象直接量 setPrefix : function (p) { //设置前缀字符 prefix = String (p); //强制转换为字符串 }, setSerial : function (s) { //设置序列号 serial = typeof s == "number" ? s : 0; //如果参数不是数字,则设置为0 }, get : function () { //读取自动生成的序列号 var result = prefix + serial; serial += 1; //递加序列号 return result; //返回结果 } }; }; var serial = toSerial (); //获取生成序列号对象 serial.setPrefix ('NO.'); //设置前缀字符串 serial.setSerial (100); //设置起始序号 console.log(serial.get()); //“No.100” console.log(serial.get()); //“No.101” console.log(serial.get()); //“No.102”serial 对象包含的方法都没有使用 this 或 that,因此没有办法损害 serial,除非调用对应的方法,否则不能改变 prefix 或 serial 的值。serial 对象是可变的,所以它的方法可能会被替换掉,但是替换后的方法依然不能访问私有成员。如果把 serial.get 作为一个值传递给第三方函数,那么这个函数只能通过它产生唯一字符串,不能通过它来改变 prefix 或 serial 的值。
所有教程
- socket
- Python基础教程
- C#教程
- MySQL函数
- MySQL
- C语言入门
- C语言专题
- C语言编译器
- C语言编程实例
- GCC编译器
- 数据结构
- C语言项目案例
- C++教程
- OpenCV
- Qt教程
- Unity 3D教程
- UE4
- STL
- Redis
- Android教程
- JavaScript
- PHP
- Mybatis
- Spring Cloud
- Maven
- vi命令
- Spring Boot
- Spring MVC
- Hibernate
- Linux
- Linux命令
- Shell脚本
- Java教程
- 设计模式
- Spring
- Servlet
- Struts2
- Java Swing
- JSP教程
- CSS教程
- TensorFlow
- 区块链
- Go语言教程
- Docker
- 编程笔记
- 资源下载
- 关于我们
- 汇编语言
- 大数据
- 云计算
- VIP视频