叨叨一会CommonJS Common这个英文单词的意思,相信大家都认识,我记得有一个词组common knowledge是常识的意思,那么CommonJS是不是也是类似于常识性的,大家都理解的意思呢?很明显不是,这个常识一点都不常识.我最初认为commonJS是一个开源的JS库,就是那种非常方便用的库,里面都是一些常用的前端方法,然而我错得离谱,CommonJS不仅不是一个库,还是一个看不见摸不着的东西,他只是一个规范!就像校纪校规一样,用来规范JS编程,束缚住前端们.就和Promise一样是…

CommonJS的模块加载机制 CommonJS模块的加载机制是,输入的是被输出的值的拷贝.也就是说,一旦输出一个值,模块内部的变化就影响不到这个值. 例如: // lib.js var counter = 3; function incCounter() { counter++; } module.exports = { counter: counter, incCounter: incCounter, }; // main.js var counter = require('./lib').…

运行和编译的概念 编译包括编译和链接两步. 编译,把源代码翻译成机器能识别的代码或者某个中间状态的语言. 比如java只有JVM识别的字节码,C#中只有CLR能识别的MSIL.还简单的作一些比如检查有没有粗心写错啥关键字了啊.有啥词法分析,语法分析之类的过程. 链接,是把编译生成的二进制文件,组合成为一个系统可以执行的可执行文件. 运行: 把编译出来的可执行文件代码在系统中执行的过程,此时被装载到内存中. (代码保存在磁盘上没装入内存之前是个死家伙.只有跑到内存中才变成活的). 运行时类型检查就…

JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发?     模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问 题进行系统性的分解以之处理.模块化是一种处理复杂系统分解为代码结构更合理,可维护性更高的可管理的模块的方式.可以想象一个巨大的系统代码,被整合优 化分割成逻辑性很强的模块时,对于软件是一种何等意义的存在.对于软件行业来说:解耦软件系统的复杂性,使得不管多么大的系统,也可以将管理,开发,维护 变得“有理可循”…

经典开场 // Layui ;! function (win) { var Lay = function () { this.v = '2.5.5'; }; win.layui = new Lay(); }(window); // Jquery (function (global, factory) { "use strict"; if (typeof module === "object" && typeof module.exports ===…

模块加载痛点 大家也或多或少的了解node模块的加载机制,最为粗浅的表述就是依次从当前目录向上级查询node_modules目录,若发现依赖则加载.但是随着应用规模的加大,目录层级越来越深,若是在某个模块中想要通过require方式以依赖名称或相对路径的方式引用其他模块就非常麻烦,影响开发效率和美观. 示例demo: // 当前目录: /usr/local/test/index.js // gulp模块所在路径为 /usr/lib/node_modules var gulp = require(…

两种加载方式 加载方式 规范 命令 特点 运行时加载 CommonJS/AMD require 社区方案,提供了服务器/浏览器的模块加载方案 非语言层面的标准 只能在运行时确定模块的依赖关系及输入/输出的变量,无法进行静态优化. 编译时加载 ESMAScript6+ import 语言规格层面支持模块功能 支持编译时静态分析,便于JS引入宏和类型检验 动态绑定 export命令 定义 export命令用于规定模块的对外接口 输出变量 1.       单个输出 // profile.js exp…

任何一门语言在大规模应用阶段,必然要经历拆分模块的过程.便于维护与团队协作,与java走的最近的dojo率先引入加载器,早期的加载器都是同步的,使用document.write与同步Ajax请求实现.后来dojo开始以JSONP的方法设计它的每个模块结构.以script节点为主体加载它的模块.这个就是目前主流的加载器方式. 不得不提的是,dojo的加载器与AMD规范的发明者都是james Burke,dojo加载器独立出来就是著名的require.本章将深入的理解加载器的原理. 1.AMD规范…

路人一: 原理一:id即路径 原则.通常我们的入口是这样的: require( [ 'a', 'b' ], callback ) .这里的 'a'.'b' 都是 ModuleId.通过 id 和路径的对应原则,加载器才能知道需要加载的 js 的路径.在这个例子里,就是 baseUrl + 'a.js' 和 baseUrl + 'b.js'. 但 id 和 path 的对应关系并不是永远那么简单,比如在 AMD 规范里就可以通过配置 Paths 来给特定的 id 指配 path. 原理二:crea…

javascript模块加载框架seajs详解 SeaJS是一个遵循commonJS规范的javascript模块加载框架,可以实现javascript的模块化开发和模块化加载(模块可按需加载或全部加载). SeaJS可以和jQuery完美集成,使用SeaJS可提高javascript的可读性和清晰度,解决javascript编程中繁杂的依赖关系(大项目中js的数量众多和依赖关系复杂比较明显) SeaJS的作者是淘宝前端工程师玉伯. SeaJS本身遵循KISS(Keep It Simple, S…