ECMAScript6编程风格.pdfVIP

ECMAScript 6 编程风格 1. 块级作⽤域 2. 字符串 3. 解构赋值 4 . 对象 5. 数组 6. 函数 7 . Map结构 8. Class 9. 模块 10 . ESLint的使⽤ 本章探讨如何将ES6的新语法 运⽤到编码实践之中 与传统的JavaScript语法结合在 ⼀起 写出合理的、易于阅读和维护的代码。 多家公司和组织已经公开了它们的风格规范 具体可参阅j 下⾯的内容主要参 考了 irbnb 的JavaScript风格规范。 块级作⽤域 （1）let取代var ES6提出了两个新的声明变量的命令：let和const。其中 let完全可以取代var 因为两者语义相同 ⽽且let没有副作⽤。 use strict; if (true) { let x = hello; } for (let i = 0; i 10; i++) { console.log(i); } 上⾯代码如果⽤var替代let 实际上就声明了两个全局变量 这显然不是本意。变 量应该只在其声明的代码块内有效 var命令做不到这⼀点。 var命令存在变量提升效⽤ let命令没有这个问题。 use strict; if(true) { console.log(x); // Reference rror let x = hello; } 上⾯代码如果使⽤var替代let console.log那⼀⾏就不会报错 ⽽是会输出 undefined 因为变量声明提升到代码块的头部。这违反了变量先声明后使⽤的原 则。 所以 建议不再使⽤var命令 ⽽是使⽤let命令取代。 （2 ）全局常量和线程安全 在let和const之间 建议优先使⽤const 尤其是在全局环境 不应该设置变量 只应设置常量。这符合函数式编程思想 有利于将来的分布式运算。 // bad var a = 1, b = 2, c = 3; // good const a = 1; const b = 2; const c = 3; // best const [a, b, c] = [1, 2, 3]; const声明常量还有两个好处 ⼀是阅读代码的⼈⽴刻会意识到不应该修改这个值 ⼆是防⽌了⽆意间修改变量值所导致的错误。 所有的函数都应该设置为常量。 长远来看 JavaScript可能会有多线程的实现 （⽐如Intel的River Trail那⼀类的项 ⽬） 这时let表⽰的变量 只应出现在单线程运⾏的代码中 不能是多线程共享 的 这样有利于保证线程安全。 字符串 静态字符串⼀律使⽤单引号或反引号 不使⽤双引号。动态字符串使⽤反引号。 // bad const a = foobar; const b = foo + a + bar; // acceptable const c = `foobar`; // good const a = foobar; const b = `foo${a}bar`; const c = foobar; 解构赋值 使⽤数组成员对变量赋值时 优先使⽤解构赋值。 const arr = [1, 2, 3, 4]; // bad const first = arr[0]; const second = arr[1]; // good const [first, second] = arr; 函数的参数如果是对象的成员 优先使⽤解构赋值。 // bad function getFullName(user) { const firstName = user.firstName; const lastName = user.lastName; } // good function getFullName(obj) { const { firstName, lastName } = obj; } // best function getFullName({ firstName, lastName }) { } 如果函数返回多个值 优先使⽤对象的解构赋值 ⽽不是数组的解构赋值。这样便于 以后添加返回值 以及更改返回值的顺序。 // bad function processInput(input) { return [left, right, top,