ES6-代码编程风格(数组、函数)

1 数组

使用扩展运算符(...)复制数组。

const itemsCopy = ...items;

使用Array.from 方法将类似数组的对象转为数组。

const foo = document.querySelectorAll('.foo');

const nodes = Array.from(foo);

2 函数

立即执行函数可以写成箭头函数的形式。

复制代码
(() => {
  console.log('Welcome to the Internet.');
})();

那些需要使用函数表达式的场合,尽量用箭头函数提代。因为这员工更简洁,而且绑定了this.

复制代码
//bad
[1, 2, 3].map(function (x) {
  return x*x;
});
//good
[1, 2, 3].map((x) => {
  return x*x;
});
//best
[1, 2, 3].map(x => x*x);

简单的、单行的、不会复用的函数,建议采用箭头函数。 如果函数体较为复杂,行数较多,韩式应该采用传统的函数写法。

所有的配置项都应该集中在一个对象,放在最后一个参数, 布尔值不可以直接作为参数。

复制代码
// bad
function divide(a, b, {option = false}) {}
// good
function divide(a, b, { option = false } = {}) {}

不要在函数体内使用arguments变量, 使用rest运算符(...)代替。

复制代码
//bad
function concatenateAll () {
  const args = Array.prototype.slice.call(arguments); 
  return args.join('');
}
//good
function concatenateAll(...args) {
  return args.join('')
}

使用默认值语法设置函数参数的默认值。

复制代码
//bad
function handleThings(opts) {
  opts = opts || {};
}
//good 
function handleThings(opts = {}) {
}
相关推荐
先吃饱再说13 分钟前
React 组件通信:从 Props 单向传递到自定义事件
前端·react.js·前端框架
swipe18 分钟前
05|(前端转后全栈)不手写一堆 SQL,后端怎么操作数据库?MyBatis-Plus 入门
前端·后端·全栈
Allshadow18 分钟前
Nest.js - 连接数据库
javascript·nestjs
冰暮流星23 分钟前
javascript之date对象
开发语言·javascript·ecmascript
swipe23 分钟前
04|(前端转后全栈)前端状态为什么不够用?从页面数据到 MySQL 持久化
前端·后端·全栈
橘子星24 分钟前
别光看教程!手把手拆解 React Todo 项目,一文吃透 5 个核心概念
前端·javascript
大白要努力!30 分钟前
纯前端实现 PDF 加水印工具 —— 零后端、支持中文、实时预览
前端·pdf·html
石小石Orz32 分钟前
TRAE SOLO实战:实现一个桌面3D助手
前端·人工智能
蜡台37 分钟前
使用 uni-popup 实现数据选择器Data-Picker
前端·javascript·html·uniapp·uni-popup·data-picker
拆房老料38 分钟前
BaseMetas FileView 1.2.0 发布:Office/WPS 大文件预览与内存安全优化实测
前端·产品运营·开源软件