JS规范
语言规范
const foo = 1 let bar = foo bar = 9 console.log(foo, bar) // 1, 9const foo = [1, 2, 3] const bar = foo bar[0] = 9 console.log(foo[0], bar[0]) // 9, 9
// 对所有引用都使用 const,不要使用 var const a = 1 const b = 2 // 如果引用是可变动的,则使用 let let count = 1 if (count < 10) { count += 1 }// 请使用字面量值创建对象 const a = {} // 别使用保留字作为对象的键值,这样在 IE8 下不会运行 const a = { defaults: {}, common: {} } // 请使用对象方法的简写方式 const job = 'FrontEnd' const item = { job } // 对象属性值的简写方式要和声明式的方式分组 const job = 'FrontEnd' const department = 'JDC' const item = { job, department, sex: 'male', age: 25 }// 请使用字面量值创建数组 const items = [] // 向数组中添加元素时,请使用 push 方法 items.push('test') // 使用拓展运算符 ... 复制数组 itemsCopy = [...items] // 使用数组的 map 等方法时,请使用 return 声明,如果是单一声明语句的情况,可省略 return [1, 2, 3].map(x => { const y = x + 1 return x * y }) [1, 2, 3].map(x => x + 1) const flat = {} [[0, 1], [2, 3], [4, 5]].reduce((memo, item, index) => { const flatten = memo.concat(item) flat[index] = flatten return flatten }) inbox.filter((msg) => { const { subject, author } = msg if (subject === 'Mockingbird') { return author === 'Harper Lee' } return false })// 当需要使用对象的多个属性时,请使用解构赋值 function getFullName (user) { const { firstName, lastName } = user return `${firstName} ${lastName}` } function getFullName ({ firstName, lastName }) { return `${firstName} ${lastName}` } // 当需要使用数组的多个值时,请同样使用解构赋值 const arr = [1, 2, 3, 4] const [first, second] = arr // 函数需要回传多个值时,请使用对象的解构,而不是数组的解构 // 如果是数组解构,那么在调用时就需要考虑数据的顺序 const [top, xx, xxx, left] = doSomething() function doSomething () { return { top, right, bottom, left } } // 此时不需要考虑数据的顺序 const { top, left } = doSomething()// 字符串统一使用单引号的形式 '' const department = 'JDC' // 字符串太长的时候,请不要使用字符串连接符换行 \,而是使用 + const str = '凹凸实验室 凹凸实验室 凹凸实验室' + '凹凸实验室 凹凸实验室 凹凸实验室' + '凹凸实验室 凹凸实验室' // 程序化生成字符串时,请使用模板字符串 const test = 'test' const str = `ab${test}`// 请使用函数声明,而不是函数表达式 '' function foo () { // do something } // 不要在非函数代码块中声明函数 let test if (isUse) { test = () => { // do something } } // 不要使用 arguments,可以选择使用 ... // arguments 只是一个类数组,而 ... 是一个真正的数组 function test (...args) { return args.join('') } // 不要更改函数参数的值 function test (opts = {}) { // ... }// 使用 class,避免直接操作 prototype class Queue { constructor (contents = []) { this._queue = [...contents] } pop () { const value = this._queue[0] this._queue.splice(0, 1) return value } }// 使用标准的 ES6 模块语法 import 和 export import Util from './util' export default Util // 更优 import { Util } from './util' export default Util // 不要使用 import 的通配符 *,这样可以确保你只有一个默认的 export import Util from './util'// 不要使用 iterators const numbers = [1, 2, 3, 4, 5] let sum = 0 numbers.forEach(num => sum += num) // 更优 const sum = numbers.reduce((total, num) => total + num, 0)// 使用 . 来访问对象属性 const joke = { name: 'haha', age: 28 } const name = joke.name// 请使用 const、let 关键字,避免全局命名空间的污染 const demo = new Demo() // 将所有的 const 和 let 分组 const b const d let a let c let e// var 存在变量提升的情况,即 var 声明会被提升至该作用域的顶部,但是他们的赋值并不会 // 匿名函数的变量名会提升,但函数内容不会 function example () { console.log(anonymous) // => undefined anonymous() var anonymous = function () { console.log('test') } } // 命名的函数表达式的变量名会被提升,但函数名和函数函数内容并不会 function example() { console.log(named) // => undefined named() // => TypeError named is not a function superPower() // => ReferenceError superPower is not defined var named = function superPower () { console.log('Flying') } } function example() { console.log(named) // => undefined named() // => TypeError named is not a function var named = function named () { console.log('named') } }// 我们遵循 Standard 的规范,不使用分号 const test = 'good' (() => { const str = 'hahaha' })()
代码规范
参考
Last updated
Was this helpful?