JS小技巧

Chrome console

首先，先介紹一個很是強大且好用的開發工具，那就是Chrome的console。你能夠在這裏寫代碼來驗證你的想法，支持自動縮進，以及幾乎全部ES6+的新語法。以後的小技巧都將用Chrome console來演示。

得到時間戳

比較常規獲取時間戳的方式

const d = new Date;
d.getTime();

介紹個更爲簡潔的方式

const timestamp = +new Date;

UTC時間轉換

還在用getUTCXxxx方法獲取對應的UTC時間，再拼成完整的時間？那你就out了。試試JSON.string方法吧！

const d = new Date;
const utc = JSON.stringify(d); //完整的UTC時間串

轉回local呢？

const localTime = new Date(utc);

！注意這種轉換方式中，utc時間串的末尾是一個z,若是沒有，則按照local的時間來處理。

克隆

克隆是咱們比較經常使用的功能之一，很多人喜歡引用jq或者lodash庫，其實徹底沒有必要，一樣用JSON提供的方法就能夠實現。

const objectA = {a: 1, b: 2};
const clonedA = JSON.parse(JSON.stringify(objectA));
clonedA.b = 3;
console.log(objectA); // {a: 1, b: 2}
console.log(clonedA); // {a: 1, b: 2}

咱們能夠看到，clone以後的對象b屬性被改變，可是原對象的a屬性並無發生變化。
！這種克隆方式雖然簡便，可是想必已經發現了問題，若是被克隆對象的屬性中存在時間對象，那克隆過程當中時間對象會被轉成UTC字符串，這是咱們要注意的。解決方法很簡單，用上文提到的方法吧日期轉成時間戳就能夠了，在須要的地方再轉換回來。

字符串轉數字

用Number.parseXxxx方法把字符串轉數字，看起來是否是比較麻煩。又到了+大顯身手的時候了。不管是正數仍是小數，都能兼容。

let numberStr = "123";
+numberStr; // 123
numberStr = '123.12';
+numberStr; // 123.12

你必定猜到了，-是否是也能作一樣的事？沒錯，-也能夠轉換！可是，-只能夠轉正數，負數的狀況下會丟失符號。-慎用！

數字轉換字符串

直接在須要轉換的數字後加上空字符串，最快捷的轉換，比調用toString快不少吧。

123 + ""; // "123"

解構賦值

解構賦值分兩種，解構對象和數組。

//對象
const {a, b} = {a: 1, b: 2, c: 3};
console.log(a, b); // 可直接獲取到對象屬性的值，不需點調用

//數組
const [m, n] = [1, 2, 3];//數組能夠更長，變量會按照位置匹配
console.log(m, n);

舉個實用栗子，獲取cookie中的值

雙數組匹配查詢

實際項目常會碰到須要在兩個數組匹配取值的狀況，若是嵌套循環，效率低，而且代碼看着不美觀。利用對象的特性，能夠簡化複雜度。例如根據id匹配員工工資：

const employees = [
    {id: 1, name: 'Tom'},
    {id: 2, name: 'Jerry'},
    {id: 3, name: 'Jim'},
    {id: 4, name: 'Kate'}
];
const salary = [
    {id: 1, salary: 10000},
    {id: 2, salary: 20000},
    {id: 3, salary: 30000},
    {id: 4, salary: 40000}
];
const salaryObj = {};
salary.map(({id, salary}) => salaryObj[id] = salary);
employees.map(e => e.salary = salaryObj[e.id]);

set去重

數組去重很常見，用set實現，輕鬆加愉快！

const numbers = [1,2,3,4,1,2,3,4];
const result = [... new Set(numbers)];

更多技巧等待你們去發現！分享改變生活！