# 1.三元操作符

``````const x = 20;
if (x > 10) {
} else {
}复制代码``````

``const answer = x > 10 ? 'is greater' : 'is lesser';复制代码``

``const big = x > 10 ? " greater 10" : x复制代码``

# 2.短路求值简写方式

``````if (variable1 !== null || variable1 !== undefined || variable1 !== '') {
let variable2 = variable1;
}复制代码``````

``const variable2 = variable1  || 'new';复制代码``

# 3.声明变量简写方法

``````let x;
let y;
let z = 3;复制代码``````

``let x, y, z=3;复制代码``

# 4.if存在条件简写方法

``if (likeJavaScript === true)复制代码``

``if (likeJavaScript)复制代码``

``````let a;
if ( a !== true ) {
// do something...
}复制代码``````

``````let a;
if ( !a ) {
// do something...
}复制代码``````

# 5.JavaScript循环简写方法

``for (let i = 0; i < allImgs.length; i++)复制代码``

``for (let index in allImgs)复制代码``

``````function logArrayElements(element, index, array) {
console.log("a[" + index + "] = " + element);
}
[2, 5, 9].forEach(logArrayElements);
// logs:
// a[0] = 2
// a[1] = 5
// a[2] = 9复制代码``````

# 6.短路评价

``````let dbHost;
if (process.env.DB_HOST) {
dbHost = process.env.DB_HOST;
} else {
dbHost = 'localhost';
}复制代码``````

``const dbHost = process.env.DB_HOST || 'localhost';复制代码``

# 7.十进制指数

``for (let i = 0; i < 10000; i++) {}复制代码``

``````for (let i = 0; i < 1e7; i++) {}

// 下面都是返回true
1e0 === 1;
1e1 === 10;
1e2 === 100;
1e3 === 1000;
1e4 === 10000;
1e5 === 100000;复制代码``````

# 8.对象属性简写

``const obj = { x:x, y:y };复制代码``

``const obj = { x, y };复制代码``

# 9.箭头函数简写

``````function sayHello(name) {
console.log('Hello', name);
}

setTimeout(function() {
}, 2000);

list.forEach(function(item) {
console.log(item);
});复制代码``````

``````sayHello = name => console.log('Hello', name);

list.forEach(item => console.log(item));复制代码``````

# 10.隐式返回值简写

``````function calcCircumference(diameter) {
return Math.PI * diameter
}

var func = function func() {
return { foo: 1 };
};复制代码``````

``````calcCircumference = diameter => (
Math.PI * diameter;
)

var func = () => ({ foo: 1 });复制代码``````

# 11.默认参数值

``````function volume(l, w, h) {
if (w === undefined)
w = 3;
if (h === undefined)
h = 4;
return l * w * h;
}复制代码``````

``````volume = (l, w = 3, h = 4 ) => (l * w * h);

volume(2) //output: 24复制代码``````

# 12.模板字符串

``````const welcome = 'You have logged in as ' + first + ' ' + last + '.'

const db = 'http://' + host + ':' + port + '/' + database;复制代码``````

ES6可以使用反引号和`\${}`简写：

``````const welcome = `You have logged in as \${first} \${last}`;

const db = `http://\${host}:\${port}/\${database}`;复制代码``````

# 13.解构赋值简写方法

``````const observable = require('mobx/observable');
const action = require('mobx/action');
const runInAction = require('mobx/runInAction');

const store = this.props.store;
const form = this.props.form;
const errors = this.props.errors;
const entity = this.props.entity;复制代码``````

``````import { observable, action, runInAction } from 'mobx';

``````const { store, form, loading, errors, entity:contact } = this.props;
//最后一个变量名为contact复制代码``````

# 14.多行字符串简写

``````const lorem = 'Lorem ipsum dolor sit amet, consectetur\n\t'
+ 'adipisicing elit, sed do eiusmod tempor incididunt\n\t'
+ 'ut labore et dolore magna aliqua. Ut enim ad minim\n\t'
+ 'veniam, quis nostrud exercitation ullamco laboris\n\t'
+ 'nisi ut aliquip ex ea commodo consequat. Duis aute\n\t'
+ 'irure dolor in reprehenderit in voluptate velit esse.\n\t'复制代码``````

``````const lorem = `Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt
ut labore et dolore magna aliqua. Ut enim ad minim
veniam, quis nostrud exercitation ullamco laboris
nisi ut aliquip ex ea commodo consequat. Duis aute
irure dolor in reprehenderit in voluptate velit esse.`复制代码``````

# 15.扩展运算符简写

``````// joining arrays
const odd = [1, 3, 5];
const nums = [2 ,4 , 6].concat(odd);

// cloning arrays
const arr = [1, 2, 3, 4];
const arr2 = arr.slice()复制代码``````

``````// joining arrays
const odd = [1, 3, 5 ];
const nums = [2 ,4 , 6, ...odd];
console.log(nums); // [ 2, 4, 6, 1, 3, 5 ]

// cloning arrays
const arr = [1, 2, 3, 4];
const arr2 = [...arr];复制代码``````

``````const odd = [1, 3, 5 ];
const nums = [2, ...odd, 4 , 6];复制代码``````

``````const { a, b, ...z } = { a: 1, b: 2, c: 3, d: 4 };
console.log(a) // 1
console.log(b) // 2
console.log(z) // { c: 3, d: 4 }复制代码``````

# 16.强制参数简写

JavaScript中如果没有向函数参数传递值，则参数为`undefined`。为了增强参数赋值，可以使用`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;
}复制代码``````

# 17.Array.find简写

``````const pets = [
{ type: 'Dog', name: 'Max'},
{ type: 'Cat', name: 'Karl'},
{ type: 'Dog', name: 'Tommy'},
]

function findDog(name) {
for(let i = 0; i<pets.length; ++i) {
if(pets[i].type === 'Dog' && pets[i].name === name) {
return pets[i];
}
}
}复制代码``````

``````pet = pets.find(pet => pet.type ==='Dog' && pet.name === 'Tommy');
console.log(pet); // { type: 'Dog', name: 'Tommy' }复制代码``````

# 18.Object[key]简写

``````function validate(values) {
if(!values.first)
return false;
if(!values.last)
return false;
return true;
}

console.log(validate({first:'Bruce',last:'Wayne'})); // true复制代码``````

``````// 对象验证规则
const schema = {
first: {
required:true
},
last: {
required:true
}
}

// 通用验证函数
const validate = (schema, values) => {
for(field in schema) {
if(schema[field].required) {
if(!values[field]) {
return false;
}
}
}
return true;
}

console.log(validate(schema, {first:'Bruce'})); // false
console.log(validate(schema, {first:'Bruce',last:'Wayne'})); // true复制代码``````

# 19.双重非位运算简写

``Math.floor(4.9) === 4  //true复制代码``

``~~4.9 === 4  //true复制代码``