网页的结构越来越复杂，简直可以看做一个简单APP，如果还像以前那样把所有的代码都放到一个文件里面会有一些问题：全局变量互相影响JavaScript文件变大，影响加载速度结构混乱、很难维护和后端（比如Java）比较就可以看出明显的差距。2009年Ryan Dahl创建了node.js项目，将JavaScript用于服务器编程，这标志“JS模块化编程”正式诞生。基本原理模块就是一些功能的集合，那么可以将一个大文件分割成一些小文件，在各个文件中定义不同...
世面上有好多JavaScript的加载器，比如 sea.js, require.js, yui loader, labJs….， 加载器的使用范围是一些比较大的项目， 个人感觉如果是小项目的话可以不用， 我用过seaJS和requireJS， 在项目中用过requireJS， requireJS是符合AMD，全称是(Asynchronous Module Definition)即异步模块加载机制 , seaJS是符合CMD规范的加载器。AMD__和__CMDAMD规范是依赖前置， CMD规范是依赖后置， AMD规范的加载器会把所有的JS中的依赖前置...
这个系列的第一部分介绍了Javascript模块的基本写法，今天介绍如何规范地使用模块。（接上文）七、模块的规范先想一想，为什么模块很重要？因为有了模块，我们就可以更方便地使用别人的代码，想要什么功能，就加载什么模块。但是，这样做有一个前提，那就是大家必须以同样的方式编写模块，否则你有你的写法，我有我的写法，岂不是乱了套！考虑到Javascript模块现在还没有官方规范，这一点就更重要了。目前，通行的Javascript模块规...
随着网站逐渐变成”互联网应用程序”，嵌入网页的Javascript代码越来越庞大，越来越复杂。网页越来越像桌面程序，需要一个团队分工协作、进度管理、单元测试等等……开发者不得不使用软件工程的方法，管理网页的业务逻辑。JavaScript模块化编程，已经成为一个迫切的需求。理想情况下，开发者只需要实现核心的业务逻辑，其他都可以加载别人已经写好的模块。但是，Javascript不是一种模块化编程语言，它不支持”类”（class），更遑论...
什么是模块化开发？前端开发中，起初只要在script标签中嵌入几十上百行代码就能实现一些基本的交互效果，后来js得到重视，应用也广泛起来了，jQuery，Ajax，Node.Js，MVC，MVVM等的助力也使得前端开发得到重视，也使得前端项目越来越复杂，然而，JavaScript却没有为组织代码提供任何明显帮助，甚至没有类的概念，更不用说模块（module）了，那么什么是模块呢？一个模块就是实现特定功能的文件，有了模块，我们就可以更方便地使用别...
前言 关于模块化，最直接的表现就是我们写的 require 和 import 关键字，如果查阅相关资料，就一定会遇到 CommonJS 、CMD AMD 这些名词，以及 RequireJS、SeaJS 等陌生框架。比如 SeaJS 的官网 这样描述自己: “简单友好的模块定义规范，Sea.js 遵循 CMD 规范。自然直观的代码组织方式，依赖的自动加载……” 作为前端新手，我表示实在是一脸懵逼，理解不能。按照我一贯的风格，介绍一个东西之前总得解释一下为什么需要这个东...
前言关于模块化，最直接的表现就是我们写的 require 和 import 关键字，如果查阅相关资料，就一定会遇到 CommonJS 、CMD AMD 这些名词，以及 RequireJS、SeaJS 等陌生框架。比如 SeaJS 的官网 这样描述自己: “简单友好的模块定义规范，Sea.js 遵循 CMD 规范。自然直观的代码组织方式，依赖的自动加载……”作为前端新手，我表示实在是一脸懵逼，理解不能。按照我一贯的风格，介绍一个东西之前总得解释一下为什么需要这个东西。Jav...
利用闭包的强大威力，但从表面上看，它们似乎与回调无关。下面一起来研究其中最强大的一个：模块。function foo() {var something = "cool";var another = [1, 2, 3];function doSomething() {console.log( something );}function doAnother() {console.log( another.join( " ! " ) );} } 正如在这段代码中所看到的，这里并没有明显的闭包，只有两个私有数据变量something和another，以及doSomething() 和doAnother() 两个内部函...
通过jquery可以很容易实现CP端的拖拽。但是在移动端却不好用了。于是我自己写了一个在移动端的拖拽demo，主要用到的事件是触摸事件（touchstart，touchmove和touchend）。这个demo实现的功能是：可以拖拽的元素（在这里是图片）位于列表中，这些元素可以被拖到指定区域，到达指定区域（控制台）后，元素被插入控制台后，原来的拖动元素返回原位置，新的元素依然可以在控制台中拖动，也能拖出控制台。在这个demo中一个用三个模块，分...
requirejs是一个JavaScript文件和模块加载器。requireJS允许你把你的javascript代码独立成文件和模块，同时管理每个模块间的依赖关系。RequireJS的目标是鼓励代码的模块化，它使用了不同于传统"script"标签的脚本加载步骤。使用RequireJS加载模块化脚本将提高代码的加载速度和质量。一、为什么要用require.js？最早的时候，所有Javascript代码都写在一个文件里面，只要加载这一个文件就够了。后来，代码越来越多，一个文件不够了，...
随着网站功能逐渐丰富，网页中的js也变得越来越复杂和臃肿，原有通过script标签来导入一个个的js文件这种方式已经不能满足现在互联网开发模式，我们需要团队协作、模块复用、单元测试等等一系列复杂的需求。RequireJS是一个非常小巧的JavaScript模块载入框架，是AMD规范最好的实现者之一。最新版本的RequireJS压缩后只有14K，堪称非常轻量。它还同时可以和其他的框架协同工作，使用RequireJS必将使您的前端代码质量得以提升。requi...
虽然 JavaScript 天生就是一副随随便便的样子，但是随着浏览器能够完成的事情越来越多，这门语言也也越来越经常地摆出正襟危坐的架势。在复杂的逻辑下， JavaScript 需要被模块化，模块需要封装起来，只留下供外界调用的接口。闭包是 JavaScript 中实现模块封装的关键，也是很多初学者难以理解的要点。最初，我也陷入迷惑之中。现在，我自信对这个概念已经有了比较深入的理解。为了便于理解，文中试图封装一个比较简单的对象。我们...
我们以前是怎么开发JavaScript代码的在过去由于应用复杂度不高，JavaScript之于web页面一直处于一种辅助程序的地位，甚至谈不上是一门应用开发语言。而且多数网站都是一次性应用，规模较小，相对于可维护性，开发速度更重要。大部分时候是没有专业前端开发人员的，都是做后台的人查查手册就开始干活了。很多时候所有的JavaScript代码放在同一个文件中，所有代码耦合在一起，无法复用。所有的变量都是全局变量，可能互相覆盖。做的好...
JavaScript模块化开发库之SeaJSSeaJS由国内的牛人lifesinger开发。目前版本是1.1.1，源码不到1500行，压缩后才4k，质量极高。这篇会讲述SeaJS的一些基本用法，不会面面俱到，但会就个人的理解讲述官方文档没有提到的一些细节。 一、SeaJS的全局接口 SeaJS向全局公开了两个标识符： seajs 和 define。 如果你的项目中已经用了标识符seajs，又不想改。这时SeaJS可以让出全局的seajs。如var boot = seajs.noConflict();这时boot就相当...
什么是Require.jsRequire.js是一个AMD规范的轻量级js模块化管理框架，最新版本require.js 2.1.11压缩后只有14.88K，它可以把js代码分成一个个模块，实现异步或动态加载，还能很清晰的看出模块之间的依赖，从而提高代码质量，性能和可维护性。Require.js的作者是AMD规范的创始人 James Burke。Require.js能带来什么好处下面我们可以举一个简单的例子说明:通常我们的页面结构是以下这样<!DOCTYPE html> <html> <head><meta charset="...