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 = {}) {
}
相关推荐
一 乐19 分钟前
婚纱摄影网站|基于ssm + vue婚纱摄影网站系统(源码+数据库+文档)
前端·javascript·数据库·vue.js·spring boot·后端
C_心欲无痕1 小时前
ts - tsconfig.json配置讲解
linux·前端·ubuntu·typescript·json
清沫1 小时前
Claude Skills:Agent 能力扩展的新范式
前端·ai编程
yinuo2 小时前
前端跨页面通信终极指南:方案拆解、对比分析
前端
yinuo2 小时前
前端跨页面通讯终极指南⑨:IndexedDB 用法全解析
前端
xkxnq3 小时前
第二阶段:Vue 组件化开发(第 16天)
前端·javascript·vue.js
烛阴3 小时前
拒绝配置地狱!5 分钟搭建 Three.js + Parcel 完美开发环境
前端·webgl·three.js
Van_Moonlight3 小时前
RN for OpenHarmony 实战 TodoList 项目:空状态占位图
javascript·开源·harmonyos
xkxnq3 小时前
第一阶段:Vue 基础入门(第 15天)
前端·javascript·vue.js
anyup4 小时前
2026第一站:分享我在高德大赛现场学到的技术、产品与心得
前端·架构·harmonyos