JavaScript学习笔记-面向对象的模块化编程
面向对象的模块化编程
模块是一个独立的JS文件,模块文件可以包含一个类定义、一组相关的类、一个实用函数库、一些待执行的代码
模块化的目标:支持大规模的程序开发,处理分散源代码的组装,并能让代码正确执行;不同的模块必须避免修改全局上下文,模块应当尽可能少的定义全局标识;
在模块创建过程中避免污染全局变量的一种方法是使用一个对象作为命名空间('容器');
为了保持干净的全局命名空间,将'容器'类定义为一个单独的全局对象,如:var sets = {};
这个sets对象就是模块的命名空间,并且将每个其它类/变量/方法等都定义为这个对象的属性,可以将这些属性封装起来私有化,也可以通过对外开放接口来达到从外部访问该属性;
调用命名空间内的属性:
(一): var s1 = new sets.Set1(4,5); //直接使用来创建类Set2的实例
(二):var s2 = sets.Set2; //导出类Set1到s1 然后就可以创建实例了 var s3 = new s2(4,5);
多层嵌套的命名空间:
var collections;
if(!collections) collections = {};
collections.sets = {};
collections.sets.A_Class = function(){...}; //在collections.sets命名空间内定义类A_Class
最顶层的命名空间通常用来标识模块作者或组织,可通过网站域名来标识,避免命名冲突,如com.biadu.collections.sets;
可以将整个模块导入:var sets = com.biadu.collections.sets;也可以导入命名空间内单独的类;
按照约定,模块的文件名,目录结构应当和命名空间相匹配:
如: 使用命名空间com.biadu.collections.sets的模块应当在这个文件中:com/biadu/collections/sets.js;
一个模块往往会对外导出(开放)一些公共API,其他人通过这些API来使用这个模块,它包括函数\类\属性\方法;但具体实现模块的一些额外的辅助函数和方法不需要对外开放,在模块外部不可见\不可访问;
模块函数(私有命名空间):用一个模块函数包裹模块的所有属性\函数\方法,并立即执行模块函数;模块函数也可以有名字,但它是用函数表达式定义的,因此这个名字不是全局变量,用法:
( function namespace(){......}() );最外层括号表示是函数表达式,而非声明语句;
一旦将模块代码封装进该模块函数,就需要导出其公共API:
方法一: 将模块函数返回的构造函数赋值给一个全局变量,这样这个变量就可以调用该构造函数指代的类的属性了
方法二:通过return{...};来返回要对外开放的属性,返回给全局变量;
方法三:将模块函数当做构造函数,通过new来调用,然后将要对外开放的属性赋值到this对象中;
方法四:在模块函数里直接设置那个对象的属性;
//====第一种
var Set = (function namespace(){
function Set(){
this.n = 0;
this.add.apply(this,arguments);
}
Set.prototype.contains = function(values){
return v2s(values);
};
Set.prototype.add = function(x,y){return x+y};
function v2s(val){return val*2;}
return Set;
}());
var ss = new Set(1,2,3);
ss.n;
ss.contains(8);
ss.add(5,6);
//====第二种
var collections;
if(!collections) collections = {};
collections.sets = (function namespace1(){
//.........定义代码
var aPropoty=1, b=2;
var aFunction = function(){return aPropoty+b;};
return{
a1:aPropoty,
a2:b,
f:aFunction
};
}() );
collections.sets.f();
collections.sets.a1;
//====第三种
var collections1;
if(!collections1) collections1 = {};
collections1.sets = (new function namespace2(){
var aPropoty=1, b=2;
var aFunction = function(){return aPropoty+b;};
this.a1 = aPropoty;
this.a2 = b;
this.f = aFunction;
}() );
collections1.sets.f();
collections1.sets.a1;
collections1.sets.a2;
//====第四种
var collections2;
if(!collections2) collections2 = {};
collections2.sets = {};
( function namespace(){
var aPropoty=1, b=2;
var aFunction = function(){return aPropoty+b;};
collections2.sets.a1 = aPropoty;
collections2.sets.a2 = b;
collections2.sets.f = aFunction;
}() );
collections2.sets.a1;
collections2.sets.a2;
collections2.sets.f();
JavaScript学习笔记-面向对象的模块化编程的更多相关文章
- jquery学习笔记---requirejs 和模块化编程
http://www.cnblogs.com/lisongy/p/4711056.html jquery模块化编程:http://www.cnblogs.com/digdeep/p/4602460.h ...
- 高性能javascript学习笔记系列(3) -DOM编程
参考 高性能javascript 文档对象模型(DOM)是独立于语言的,用于操作XML和HTML文档的程序接口API,在浏览器中主要通过DOM提供的API与HTML进行交互,浏览器通常会把DOM和ja ...
- javascript学习笔记 - 面向对象 理解对象
ECMAScript 中有两种属性:数据属性和访问器属性 一 属性类型 1.数据属性.数据属性有4个描述其行为的特性 [[Configurable]]表示能否通过delete删除属性从而重新定义属性: ...
- Java程序猿的JavaScript学习笔记(6——面向对象模拟)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- 0028 Java学习笔记-面向对象-Lambda表达式
匿名内部类与Lambda表达式示例 下面代码来源于:0027 Java学习笔记-面向对象-(非静态.静态.局部.匿名)内部类 package testpack; public class Test1{ ...
- C#学习笔记——面向对象、面向组件以及类型基础
C#学习笔记——面向对象.面向组件以及类型基础 目录 一 面向对象与面向组件 二 基元类型与 new 操作 三 值类型与引用类型 四 类型转换 五 相等性与同一性 六 对象哈希码 一 面向对象与面向组 ...
- Java程序猿的JavaScript学习笔记(汇总文件夹)
最终完结了,历时半个月. 内容包含: JavaScript面向对象特性分析,JavaScript高手必经之路. jQuery源代码级解析. jQuery EasyUI源代码级解析. Java程序猿的J ...
- Java程序猿的JavaScript学习笔记(8——jQuery选择器)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- Java程序猿JavaScript学习笔记(2——复制和继承财产)
计划和完成在这个例子中,音符的以下序列: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaSc ...
随机推荐
- java.util.Arrays.sort两种方式的排序(及文件读写练习)
import java.io.*; import java.util.*; public class SortTest{ public static void main(String args[]) ...
- Linux的学习--crontab
之前了解过一点crontab,前段时间比较闲,就熟悉了一下,今天总结记录一下. crontab命令常见于Unix和类Unix的操作系统之中,用于设置周期性被执行的指令.该命令从标准输入设备读取指令,并 ...
- [New Portal]Windows Azure Virtual Machine (14) 在本地制作数据文件VHD并上传至Azure(1)
<Windows Azure Platform 系列文章目录> 之前的内容里,我介绍了如何将本地的Server 2012中文版 VHD上传至Windows Azure,并创建基于该Serv ...
- linux专题一之文件管理(目录结构、创建、查看、删除、移动)
在linux系统中一切都是文件./ 在linux中为根目录,是一切文件的根目录.本文将通过linux系统的目录结构和与linux文件操作有关的相关命令(touch.mkdir.cp.mv.mv.les ...
- SQL--触发器
- C#协变和逆变
我们知道在C#中,是可以将派生类的实例赋值给基类对象的.
- C#实现网页爬虫
HTTP请求工具类(功能:1.获取网页html:2.下载网络图片:): using System; using System.Collections.Generic; using System.Dra ...
- HTML 5表单应用小结
本文内容 HTML 5表单的组织方式 HTML 5表单的新增特性 访问表单控件及响应表单控件事件 HTML 5表单的组织方式 ★ 将表单字段及其标签关联起 ...
- 【要什么自行车】ASP.NET MVC4笔记03:调用编辑器 kindeditor
参考:http://www.cnblogs.com/guzhongx/p/kindeditor.html 1.下载kindeditor,存放于Content文件夹下 <script src=&q ...
- CPU介绍
CPU内核主要分为两部分:运算器和控制器. (一) 运算器 cpu基本想到的是计算,因此有算数计算,还有逻辑计算单元以及移位简单的运算:fp运算单独拿出:要运算就需要输入数字,因此有寄存器组,即通用寄 ...