初级篇
1、三目运算符
const x = 20;
let answer;
if(x > 10) {
answer = 'greater than 10';
}else {
answer = 'less than 10';
}
简写为: const answer = x > 10 ? 'greater than 10' : 'less than 10';
2、循环语句
当使用纯JavaScript(不依赖外部库，如JQuery或lodash)时
for(let i = 0; i < array.length; i++) {
}
简写为
for(let index of array)
下面是遍历forEach的简写例子：
[2, 8, 9].forEach(function(element, index, array) {
console.log('a[' + index + '] = ' + element);
});
3、声明变量
在函数开始之前，对变量初始化赋值是一个很好的习惯，如果存在多个变量
let x;
lex y;
lex z = 3;
可以简写为 let x,y,z = 3;
4、在使用If进行基本判断时可以省略赋值运算符
if(a === true) 可以写成if(a)
5、多行字符串拼接可以用``代替''+
let a = 'adsa'
+ 'dasd';
可以写为 let a = `adsa
dasd`;
高级篇
1、变量赋值及默认值复制
当一个变量的值赋给另一变量时,首先需要确保原值不是null、未定义的或空值。
if(a != null || a != undefined || a != '') {
let b = a;
}
可以简写为以下的形式
const b = a || 'new'
2、 对象属性
ES6提供了一个很简单的办法，来分配属性的对象。如果属性名和key名相同，则可以使用简写。
const obj = {x:x, y:y};
可以简写为
const obj = {x, y};
3、箭头函数
经典函数很容易读写，但如果把它们嵌套在其他函数中进行调用时，整个函数就会变得有些冗余和混乱。 这时候可以使用箭头函数来简写：
function sayHello() {
console.log('hello');
}
setTimeout(function() {
console.log('setTimeout')
}, 2000);
上述可以简写为
sayHello = () => console.log('hello');
setTimeout(() => console.log('loaded'), 2000);
4、隐式返回值
返回值是我们通常用来返回函数的最终结果的关键字。只有一个语句的箭头函数，可以隐式返回结果（函数必须省略括号{}）
要返回多行语句（例如对象文本），需要使用（）而不是{}来包裹函数体，这样可以保证单个语句的形式进行求值。
function calcCircumference(diameter) {
return Math.PI * diameter;
}
简写为：
calcCircumference = dameter => (Math.Pi * diameter);
5、默认参数值
可以使用if语句来定义函数参数的默认值。es6中规定了可以在函数声明中定义默认值。
function volume(l, w, h) {
if(w === undefined) {
w =3;
}
if(h === undefined) {
h =3;
}
return h * w * l;
}
可以简写为
function volume(l, w = 3, h = 4) => l * w * h;
6、 模板字符串
在反引号和${*}这种写法可以将变量的值合成一个字符串。
const a = ' you have get' + first + '.';
可以简写为
const a = `you have get ${first}.`
7、解构赋值
const o = {a : 1, b :2};
const a = o.a;
const b = o.b;
可以简写成
const {a,b} = o;
8、展开运算符
// join arrays
const odd = [1, 3, 5];
const nums = [2, 4, 6].concat(odd);
可以简写为
nums = [2, 4, 6, ...odd];
也可以将展开运 算符合ES6解构符号结合使用 例如
const {a, b, ...z} = {a: 1, b: 2, c: 3, d: 4};
console.log(z); // {c:3, d: 4}
9、强制参数
默认情况下，如果不向函数参数传值，那么JavaScript将函数参数设置为未定义。其他一些语言会发出警告或错误。要执行参数分配，可以使用if语句抛出未定义的错误，或者可以利用‘强制参数’；
function foo(bar) {
if(bar === undefined) {
throw new Error('Missing parameter');
}
return bar;
}
简写为
mandatory = （） => {
throw new Error('Missing parameter');
}
foo = (bar = mandatory()) => {
return bar;
}
10、双位操作符
位操作符是JavaScript初级教程的基本知识点，但是我们却不尝试用为操作符。因为在不处理二进制的情况是，没人愿意使用1或0
但是双位操作符却有一个很实用的案例。 你可以使用双位操作符来替代Math.floor()。双否定位操作符的优势在于它执行相同的操作运行速度更快。
Math.floor(4.9) === 4； // true
简写为：
~~4.9 === 4；// true