ES6篇(23)--编程风格


(1)块级作用域
①let取代var
var命令在顶层声明会导致声明了全局变量,还存在变量提升,而let没有副作用

②全局常量和线程安全
在let和const之间,建议优先使用const,尤其是在全局环境,不应该设置变量,只应设置常量。
const优于let的几个原因:一个是const可以提醒阅读程序的人,这个变量不应该改变;
另一个是const比较符合函数式编程思想,运算不改变值,只是新建值,而且这样也有利于将来的分布式运算;
最后一个原因是 JavaScript 编译器会对const进行优化,所以多使用const,有利于提高程序的运行效率,
也就是说let和const的本质区别,其实是编译器内部的处理不同。
const声明常量还有两个好处,一是阅读代码的人立刻会意识到不应该修改这个值,
二是防止了无意间修改变量值所导致的错误。
所有的函数都应该设置为常量。

(2)字符串
静态字符串一律使用单引号或反引号,不使用双引号。动态字符串使用反引号。
const a = 'foobar';
const b = `foo${a}bar`;

(3)解构赋值
使用数组成员对变量赋值,优先使用解构赋值。
const [first, second] = arr;
函数的参数如果是对象的成员,优先使用解构赋值。
// good
function getFullName(obj) {
  const { firstName, lastName } = obj;
}

// best
function getFullName({ firstName, lastName }) {
}
如果函数返回多个值,优先使用对象的解构赋值,而不是数组的解构赋值。
这样便于易购添加返回值,以及更改返回值的顺序。

// good
function processInput(input) {
  return { left, right, top, bottom };
}

const { left, right } = processInput(input);


(4)对象
单行定义的对象,最后一个成员不以逗号结尾。多行定义的对象,最后一个成员以逗号结尾。
对象尽量静态化,一旦定义,就不得随意添加新的属性。如果添加属性不可避免,要使用Object.assign方法。
如果对象的属性名是动态的,可以在创造对象的时候,使用属性表达式定义。
另外,对象的属性和方法,尽量采用简洁表达法,这样易于描述和书写。

(5)数组
使用扩展运算符(...)拷贝数组
// good
const itemsCopy = [...items];
使用 Array.from 方法,将类似数组的对象转为数组。
const foo = document.querySelectorAll('.foo');
const nodes = Array.from(foo);

(6)函数
立即执行函数可以写成箭头函数的形式。
那些使用匿名函数当作参数的场合,尽量用箭头函数代替。因为这样更简洁,而且绑定了 this。
箭头函数取代Function.prototype.bind,不应再用 self/_this/that 绑定 this。
简单的、单行的、不会复用的函数,建议采用箭头函数。
如果函数体较为复杂,行数较多,还是应该采用传统的函数写法。

所有配置项都应该集中在一个对象,放在最后一个参数,布尔值不可以直接作为参数。
不要在函数体内使用 arguments 变量,使用 rest 运算符(...)代替。
arguments 是一个类似数组的对象,而 rest 运算符可以提供一个真正的数组。
使用默认值语法设置函数参数的默认值。
// bad
function handleThings(opts) {
  opts = opts || {};
}

// good
function handleThings(opts = {}) {
  // ...
}

(7)Map结构
注意区分 Object 和 Map,只有模拟现实世界的实体对象时,才使用 Object。
如果只是需要key: value的数据结构,使用 Map 结构。因为 Map 有内建的遍历机制。
let map = new Map(arr);

for (let key of map.keys()) {
  console.log(key);
}

for (let value of map.values()) {
  console.log(value);
}

for (let item of map.entries()) {
  console.log(item[0], item[1]);
}

(8)Class
总是用 Class,取代需要 prototype 的操作。因为 Class 的写法更简洁,更易于理解。
使用extends实现继承,因为这样更简单,不会有破坏instanceof运算的危险。

(9)模块
首先,Module 语法是 JavaScript 模块的标准写法,坚持使用这种写法。
使用import取代require。使用export取代module.exports。
如果模块只有一个输出值,就使用export default,如果模块有多个输出值,
就不使用export default,export default与普通的export不要同时使用。
不要在模块输入中使用通配符。因为这样可以确保你的模块之中,有一个默认输出(export default)。
如果模块默认输出一个函数,函数名的首字母应该小写。
如果模块默认输出一个对象,对象名的首字母应该大写。

(10)ESLint的使用
ESLint是一个语法规则和代码风格的检查工具,可以用来保证写出语法正确、风格统一的代码。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值