1. 使用let替換var
2. 建議優(yōu)先使用const
尤其是在全局環(huán)境，不應(yīng)該設(shè)置變量递雀，只應(yīng)設(shè)置常量乡括。
const優(yōu)于let有幾個原因:
- const可以提醒閱讀程序的人，這個變量不應(yīng)該改變翻屈；
- const比較符合函數(shù)式編程思想陈哑，運(yùn)算不改變值，只是新建值伸眶，而且這樣也有利于將來的分布式運(yùn)算惊窖；
- JavaScript 編譯器會對const進(jìn)行優(yōu)化，所以多使用const厘贼，有利于提高程序的運(yùn)行效率界酒，也就是說let和const的本質(zhì)區(qū)別，其實(shí)是編譯器內(nèi)部的處理不同
3.對象盡量靜態(tài)化
一旦定義嘴秸，就不得隨意添加新的屬性毁欣。如果添加屬性不可避免，要使用Object.assign方法岳掐。
4.箭頭函數(shù)取代Function.prototype.bind凭疮，不應(yīng)再用 self/_this/that 綁定 this。(?)
// bad
const self = this;
const boundMethod = function(...params) {
return method.apply(self, params);
}
// acceptable
const boundMethod = method.bind(this);
// best
const boundMethod = (...params) => method.apply(this, params);
4.使用export取代module.exports串述。
// commonJS的寫法
var React = require('react');
var Breadcrumbs = React.createClass({
render() {
return <nav />;
}
});
module.exports = Breadcrumbs;
// ES6的寫法
import React from 'react';
class Breadcrumbs extends React.Component {
render() {
return <nav />;
}
};
export default Breadcrumbs;
不要在模塊輸入中使用通配符执解。因?yàn)檫@樣可以確保你的模塊之中，有一個默認(rèn)輸出（export default）纲酗。
// bad
import * as myObject from './importModule';
// good
import myObject from './importModule';
如果模塊默認(rèn)輸出一個對象衰腌，對象名的首字母應(yīng)該大寫。
const StyleGuide = {
es6: {
}
};
export default StyleGuide;
5.其他部分從下面代碼中學(xué)習(xí)
//靜態(tài)字符串使用單引號觅赊，動態(tài)使用反引號
const ad = 'foo';
const bd= `qwe${ad}`;
console.log(bd);//qwefoo
//數(shù)組解構(gòu)賦值
const arr = [1,2,3];
const [first,second] = arr;
console.log(first);//1
console.log(second);//2
//對象解構(gòu)賦值右蕊，必須變量名和屬性名一致，沒有次序
const obj = {
firstName:"zhang",
secondName:'san'
}
getNameVal(obj)//zhangsan
gets(obj)//zhangsan
function getNameVal({firstName,secondName}){
console.log(firstName + secondName);
}
function gets(obj){
const {secondName,firstName} = obj;
console.log(firstName + secondName);
}
//函數(shù)返回多個值茉兰，優(yōu)先考慮對象解構(gòu)
function sets(input){
let a = input == 1 ? 'a1':'';
let b = input == 1 ? 'b1':'';
let c = input == 1 ? 'c1':'';
return {a,b,c};
}
const {a,b,c} = sets(1);
console.log(a + b + c);//a1b1c1
//創(chuàng)建對象時屬性名使用屬性表達(dá)式定義尤泽。方法使用簡寫
const obgj = {
m:1,
n:2,
[sets(1)['a']]:true,
add(j,k) {
return obgj.m +j +k;
}
}
console.log(obgj);//{m:1,n:2,a1:true,add:f}
console.log(obgj.add(3,1));//5
//擴(kuò)展運(yùn)算符復(fù)制數(shù)組，不影響原數(shù)組
const arr1 = [...arr];
console.log(arr1);//[1,2,3]
arr1.push(9);
console.log(arr);//[1,2,3]
console.log(arr1);//[1,2,3,9]
// 使用 Array.from 方法，將類似數(shù)組的對象轉(zhuǎn)為數(shù)組坯约。
const foo = document.querySelectorAll('.foo');
const nodes = Array.from(foo);
console.log(Array.isArray(nodes));//true
//配置項(xiàng)以對象形式放在最后一位熊咽，false不能直接作為參數(shù)
function render(a,b,{p = false } = {}){
console.log(a);//1
console.log(b);//2
console.log(p);//{age:1,height:23}
}
render(1,2,{p:{age:1,height:23}});//{age:1,height:23}
//使用rest運(yùn)算符(...)代替arguments,提供一個真正的數(shù)組
function add(...arg){
return arg.reduce((val,k) => {
return val = val + k;
})
}
console.log(add(1,2,3,4));//10
//對象到Map需要進(jìn)行轉(zhuǎn)換，Map只是對于值到值好用闹丐，需要set給里面加横殴，然后再遍歷
let o = sets(1);
function objToMap(obj){
let map = new Map();
for (let k of Object.keys(obj)){
map.set(k,obj[k])
}
return map
}
let map = new Map(objToMap(o)) ;
for(let value of map.values()){
console.log(value);//a1 /n a2 /n a3
}
