js模块化

JavaScript模块化的历史 CommonJS:同步加载,最初为服务器端JavaScript(Node.js)设计,后来也被用于浏览器环境(通过工具如Browserify)。 // 导入 require("module"); require("../app.js"); // 导出 exports.getStoreInfo = function() {}; module.exports = someValue; AMD(Asynchronous Module Definition):异步加载、依赖前置,为浏览器环境设计的异步模块加载方案,主要通过RequireJS实现。所有依赖模块的语句,都定义在一个回调函数中,等到加载完成之后,回调函数才执行; // 定义 define(['./a', './b'], function(a, b) { // 依赖必须一开始就写好 a.doSomething() // ... b.doSomething() ... }); // 加载模块 require(["module", "../app"], function(module, app) {...}); CMD(Common Module Definition):异步加载、依赖就近,为浏览器环境设计的模块加载方案,主要通过Sea.js实现。 define(function(require, exports, module) { var a = require('./a'); a.doSomething(); // 依赖就近书写,什么时候用到什么时候引入 var b = require('./b'); b.doSomething(); }); UMD(Universal Module Definition):UMD是AMD和CommonJS的糅合:提供了一种方式,使得一个模块可以工作在各种环境中,包括浏览器和Node.js。UMD先判断是否支持Node.js(即CommonJS)的模块(就是判断exports是否存在),存在则使用CommonJS模块模式;再判断是否支持AMD(就是判断define是否存在),存在则使用AMD方式加载模块。 (function (window, factory) { if (typeof exports === 'object') { module.exports = factory(); } else if (typeof define === 'function' && define.amd) { define(factory); } else { window.eventUtil = factory(); } })(this, function () { //module ... }); 这些模块化规范的出现,主要是为了解决JavaScript在不同环境中的模块加载和管理问题。随着JavaScript语言的发展,ES6(ECMAScript 2015)引入了官方的模块化解决方案,即ES Module。 ES6 在语言标准的层面上,实现了模块功能,而且实现得相当简单,完全可以取代 CommonJS 和 AMD 规范,成为浏览器和服务器通用的模块解决方案。 ES6 模块设计思想:尽量的静态化、使得编译时就能确定模块的依赖关系,以及输入和输出的变量(CommonJS和AMD模块,都只能在运行时确定这些东西)。 使用export命令定义了模块的对外接口以后,其他 JS 文件就可以通过import命令加载这个模块。 ES6Module import 静态import函数 ...

November 12, 2024

在 JavaScript 中使用(trailing commas)尾逗号的最佳实践

trailing commas,我这里直接翻译成 尾逗号 了,是在元素列表的最后一项之后插入的逗号。JavaScript 一开始就支持数组字面量中的尾后逗号,随后向对象字面量(ECMAScript 5)中添加了尾后逗号。最近(ECMAScript 2017 也称为ES8),又将其添加到函数参数中。 这似乎是一个小小的变化,但有一些难以察觉的后果。虽然大多数新的语言特性接受这样的形式,但如果你不小心,这个功能可能会给你带来麻烦。 在本指南中,我们将详细介绍尾逗号:从常见的数据类型开始,像数组和对象你可以在其中安全地将尾逗号添加到项目列表的末尾。然后,我们将继续讨论语言结构,例如参数列表、函数调用和解构赋值,在本文的最后,我们将讨论使用尾逗号的注意事项。 在数组中使用尾逗号 你可以安全地在数组中的最后一个表达式后面包含一个尾逗号,如下所示: const arr = [ "one", "two", "three", ]; 请注意不要在末尾添加多个逗号,否则你将创建一个 undefined 的元素。例如,以下数组是完全合法的,但包含四个元素: const arr = [ "one", "two", "three",, ]; console.log(arr.length); // => 4 数组不一定有从 0 开始连续的索引。你可以创建一个包含多个“间隙”的数组——这样的数组称为稀疏数组。例如,以下数组包含六个元素,其中三个是 undefined : const sparseArray = [1,,,4,5,,]; 因此,请务必记住, length 属性的值并不总是指示数组中的元素数,你甚至可能有一个没有元素但长度为 1 的数组: const arr = [,]; console.log(arr.length); // => 1 然而,在实践中,很少需要使用稀疏数组,如果你这样做了,你现有的代码很可能会像处理包含 undefined 元素的普通数组一样处理它。 在对象中使用尾逗号 与数组类似,你可以在对象的最后一个属性后面加上逗号: const person = { firstName: "John", lastName: "Davis", age: 30, } 从 ECMAScript 5 开始,对象文本中的尾逗号是合法的。一些 JavaScript 风格指南,例如由 Airbnb 和 Google 创建的指南,甚至鼓励你养成始终包含尾逗号的习惯,这样以后在对象末尾添加新属性时,就不太可能遇到语法错误。 请注意,与数组不同,你不能创建稀疏对象,尝试这样做会导致语法错误: const person = { firstName: "John", , age: 30, } // logs: // => Uncaught SyntaxError: Unexpected token ',' 在参数列表和函数调用中使用尾逗号 有时,将函数的参数放在单独的行上很有用,特别是当有一长串参数或你想要容纳描述每个参数的注释时。例如: ...

October 14, 2024

Windows PowerShell禁用历史记录

当前 PowerShell 主机应用程序中使用以下命令为当前用户创建配置文件 使用“以管理员身份运行”选项启动 PowerShell,创建所有用户配置文件 if (!(Test-Path -Path $PROFILE)) { New-Item -ItemType File -Path $PROFILE -Force } 执行完成会给出配置文件地址:C:\Users\chen\Documents\WindowsPowerShell,找到文件并记事本打开填入以下内容: Set-PSReadLineOption -HistorySaveStyle SaveNothing 然后执行这个命令为计算机设置执行策略: Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope LocalMachine 如果不需要了可以使用这个命令删除执行策略: Set-ExecutionPolicy -ExecutionPolicy Undefined -Scope LocalMachine

September 12, 2024