全局引入的应用场景.PPT

javascript module pattern 引言 js引擎发展，性能提升； 多平台的应用： 服务器(nodejs)-v8； 跨平台游戏app(cocos2d-js)-spidermonkey； 单页面web应用； 客户端开发。 目录 准备知识 module模式的产生 用法详述 准备 对象字面量 - ｛｝ 使用大括号｛｝把键值对包起来，键值对以逗号，分割 var obj = { key1 : value1 , key2 : function value2( ) { } } 可以在对象外部增加新属性： obj.key3 = 123; 函数 - function 可以在函数内部定义函数； 可以做为返回值返回。 作用域和执行上下文 - scopeexecution context 子函数拥有自己的作用域，并可以访问父函数的作用域 依此类推形成作用域链。 闭包 - closures 函数的特性 + 作用域和执行上下文 = js的闭包特性 开始 刚学习JavaScript的时候，一般都是用下面的方式来写代码： 优点：简单，方便~ 问题：谁都可以来改年龄，我们要“私有化” 然后 让我们尝试私有化变量。下面的代码看起来挺不错的，但私有变量可以被随便访问。 最后 这样做好像可以了 new 只要new后面的构造器返回一个引用对象（数组，对象，函数等），都将覆盖自己的对象；但如果返回一个原始类型，那么就返回自己的对象。 发现 经过两次改造，我们发现 最后这种方式很好的解决了我们私有化的问题； 以它为基础，做一些抽象和变形，命名为module模式。 MODULE模式概述 关于module模式，最早由YUI的成员提出了这个概念； 使用闭包的方式封装，返回的是一个对象； 解决的主要的问题是私有和公有的问题，保护了全局作用域。 全局作用域的重要性 少写一个`var`是如何毁掉我们网站的 /web/2012/0104/230065.shtml 讲述了因为在用nodejs处理多用户并发请求时，把一个局部变量少写了var导致他变成全局变量，然后使得用户的请求数据乱了套的故事。 一个页面有多个文件，每个文件都可能有全局变量。 多人协作开发，鉴于大家的对一些变量命名时大都会参考有道词典，写出一些自己都不认识的单词，重名的几率就更高了。 Module模式的用法 匿名闭包 全局引入 扩展 松耦合扩展 模块导出 子模块 / 命名空间 继承与重载 匿名闭包 匿名闭包 我们创建了一个匿名的函数，并立即执行它。 例子里面，由于外部无法引用它内部的变量，因此在执行完后很快就会被释放，关键是这种机制不会污染全局对象。 有的函数只需要执行一次，其内部变量无需维护。 比如UI的初始化。 立即执行的函数 立即执行的函数如何写 !function () { /* code */ } (); 0,function () { /* code */ } (); (function () { /* code */ } ()); //推荐 (function () { /* code */ })(); 要想达到立即执行一个函数也有多种方法：原理消除语法歧义，把一个函数声明变成一个函数表达式。 全局引入 全局引入的应用场景 全局引入的应用场景-扩展 问题： 对于module模式而言，我们的代码模块要在一个文件中声明。 但是项目大了，必须拆分文件。 做法：首先我们引入模块，然后为其添加属性，随后将其导出。 全局引入的应用场景-扩展 全局引入的应用场景-扩展 这样写有一个问题，我们先引入b.js ，在引入a.js的话就： 全局引入的应用场景-松耦合扩展 说明： 1）为了解决上面这个问题。 2）异步加载js文件时，需要解决多个文件加载顺序的问题。 我们只需要简单改造，就能解决这个问题。 全局引入的应用场景-松耦合扩展 逻辑“或”运算符 || 运算符，双目运算符。可接受两个不同类型的值或表达式，返回值不一定是布尔值。 返回的是第一个做布尔运算后得到true的原始值。 你可能会问，if(xx||xx) 不是应该用布尔来做判断吗？那 || 返回都不是布尔那怎么办? js会做自动类型转换，其实是把 || 的返回值再做一次类型转换再来做条件判断的。 hello kitty!是非空字符串，会被自动转换为true。 模块导出 模块导出 对代码进行封装，隐藏模块中功能的具体实现； 保存程序运行过程中的一些中间值； 这是module模式最典型的用法。 子模块 / 命名空间 这种方法很简单，一般和我们刚刚介绍的一些用法一起使用。 继承与重载 想用module模式实现继承，怎么破？ module模式生下来就不是为解决