【ES6】ES6编程规范 编程风格

简介: 【ES6】ES6编程规范 编程风格

引言:这是ES6系列教学的最后一篇。我们讲解一下ES6编程的规范。

一、定义变量的规范


 let、const取代var

 let关键字可以完全取代var,因为两者语义相同,而且let完全没有副作用。   全局常量

 优先使用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];

二、字符串


 静态字符串一律使用单引号或反引号,不使用双引号。动态字符串使用反引号。

// bad
const a = "haha";
const b = 'ha' + a + 'kk';
//good
const c = `hahaha`;
//best
const a = 'hahaha';
const b = `kk${a}kk`;

三、对象


 单行定义对象时,最后一个成员不以逗号结尾。多行定义时,最后一个成员以逗号结尾。

// bad
const a = {k1 : v1, k2: v2}
const b = {
  k1:v1,
  k2:v2
};
// good
const a = {k1 : v1, k2: v2}
const b = {
  k1:v1,
  k2:v2,
};

 对象尽量静态化,一旦定义,就不得随意添加新的属性。如果添加,要使用Object.assign()方法。

四、数组


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

// bad
const len = items.length;
const itemCopy = [];
let i;
for(i=0;i<len;i++)
{
  itemCopy[i] = items[i];
}
//good
const itemCopy = [...items];

五、函数


 立即执行函数尽量写成箭头函数的形式。

(() => {
  console.log('Welcome to the ES6');
})();

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

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

查看更多ES6教学文章:


1. 【ES6】let与const 详解

2. 【ES6】变量的解构赋值

3. 【ES6】字符串的拓展

4. 【ES6】正则表达式的拓展

5. 【ES6】数值的拓展

6. 【ES6】数组的拓展

7. 【ES6】函数的拓展

8. 【ES6】对象的拓展

9. 【ES6】JS第7种数据类型:Symbol

10. 【ES6】Proxy对象

11. 【ES6】JS的Set和Map数据结构

12. 【ES6】Generator函数详解

13. 【ES6】Promise对象详解

14. 【ES6】异步操作和async函数

15. 【ES6】JS类的用法class

16. 【ES6】Module模块详解

17. 【ES6】ES6编程规范 编程风格

参考文献


阮一峰 《ES6标准入门(第2版)》

相关文章
|
6月前
|
JSON 自然语言处理 JavaScript
JavaScript代码优化利器:从ES5到ES6(一)
JavaScript代码优化利器:从ES5到ES6
|
6月前
|
XML 前端开发 JavaScript
JavaScript代码优化利器:从ES5到ES6(二)
JavaScript代码优化利器:从ES5到ES6
|
6月前
|
JavaScript 前端开发 安全
ES6的类 vs TypeScript的类:解密两种语言中的面向对象之争
ES6的类 vs TypeScript的类:解密两种语言中的面向对象之争
|
6月前
|
前端开发 JavaScript 数据处理
深入学习JavaScript ES8函数式编程:特性与实践指南
深入学习JavaScript ES8函数式编程:特性与实践指南
114 0
|
6月前
|
存储 JSON 前端开发
JavaScript代码优化利器:从ES5到ES6(三)
JavaScript代码优化利器:从ES5到ES6
|
12月前
|
编解码 JavaScript 前端开发
ES6 模块化编程 详解
ES6新特性 模块化编程详解。
107 0
|
JavaScript
TypeScript 支持模块化编程,具体应用案例解析
TypeScript 支持模块化编程,具体应用案例解析
63 0
|
JavaScript 编译器
TypeScript深度剖析:TypeScript 中命名空间与模块的理解?区别?
TypeScript深度剖析:TypeScript 中命名空间与模块的理解?区别?
119 0
|
JavaScript 前端开发 IDE
Typescript基础:如何更好的生成Typescript声明文件.d.ts
Typescript已经被前端广泛使用,如果你的项目还没有使用,建议赶紧使用起来,真的会对你的项目有足够的提升
740 0