let 和 const

為了解決var的作用域的問題，而且var 有變量提升，會出現全局污染的問題

1. let 塊狀作用域，并且不能重復聲明
2. const 一般用于聲明常量，一旦被聲明無法修改，但是const 可以聲明一個對象，對象內部的屬性是可以修改的
   建議： 在默認的情況下用const， 而只有你知道變量值需要被修改的情況下才使用let

模板字符串

解決字符串拼接問題，類似Java中的占位符號

函數之默認值、剩余參數

// 默認值
function add(a, b = 20) {return a + b
}// 默認的表達式也可以可以是一個函數
function add(a, b = getVal(5)) {return a + b
}// 剩余參數：由三個點... 和一個緊跟著的具名參數指定 ...keys
function foundData(obj, ...keys){}

函數擴展運算符、箭頭函數

// 擴展運算符： 將一個數組分割，并將各個項作為分離的參數傳給函數
// 獲取數組中的最大值
const arr = [10,20,90,30]
// ES5 
Math.max.apply(null, arr)// ES6 
Math.max(...arr)// 箭頭函數
const add = (a, b) =>{return a + b
}const add val => {return a + 5
}const add val => (a + 5)

解構賦值

// 解構賦值時對賦值運算符的一種擴展
let node = {name: '張三',age: 45
}
const name = node.name
const age = node.age// 等價寫法
const {name, age } = node// 對數組解構
let arr = [1,2,3]
let[a,b] = arr// 可嵌套解構
let [a,[b],c] = [1,[2],3]

擴展對象的功能

// 對象的方法
// is() ==== 比較倆個值是否嚴格相等
Object.is(NaN, NaN)// assign() 對象合并
let newObj = Object.assign({},{a:1},{b:2})
// 重復的屬性，只會保留一個，會被覆蓋掉
Object.assign({},{a:1},{b:2},{b:2})
{a: 1, b: 2}
// 屬性名稱一樣，但是值不一樣，會回去最后的值
Object.assign({},{a:1},{b:2},{b:3})
{a: 1, b: 3}

Symbol類型

// 原始的數據類型Symbol，它表示獨一無二的值
// 最大的用途：用來定義對象的私有變量

set集合數據類型

// 可以用于去除重復元素
let set2 = new Set([1,2,3,3,3,3,4])// 也可以將set集合中的元素在轉換為數組
let arr = [...]// set中對象的引用無法被釋放，雖然可以使用WeakSet, 但是WeakSet比Set少了很多方法

Map數據類型

數組的擴展方法

數組的方法 from() of()
// from() 將偽數組轉換成真正的數組
function add(){let arr = Array.from(arguments)// 這時候的數組就具備數組的所有方法
}let lis = document.querySelectorAll('li')
console.log(Array.from(list))
// 或者可以通過擴展運算符轉換為真正的數組
console.log([...lis])// from() 還可以接受第二個參數，用來對每個元素的處理
let liContents = Array.from(lis, ele => ele.textContent)// of() 將任意的數據類型，轉換成數組
Array.of(3,11,20,[1,2,3])// find() findIndex()
// find() 找出第一個符合條件的數組成員
let num = [1,2,-10,-20,9].find(n => n<0)// findIndex() 找出第一個符合條件的數組成員的索引
let num = [1,2,-10,-20,9].findIndex(n => n<0)// entries() keys() values()
for(let index of ['a', 'b'].keys()){console.log(index)
}for(let ele of ['a', 'b'].values()){console.log(ele)
}// incluedes() 返回一個boolean 值，表示某個數組中是否包含某個元素

迭代器Interrator 的用法

// Iterator 一種遍歷機制
const items = ['one', 'two', 'three']
const ite = items[Symbol.iterator]();
// {value: "one", done: false} done 如果為false表示還有元素，如果為true 表示遍歷完成結束了
ite.next() 

Generator的應用

// 生成器一般都和迭代器一起使用
// generator函數， 可以通過yield關鍵字，將函數掛起，為了改變執行流提供了可能性
// 同時為了做異步編程提供了方案
// 它跟普通函數的區別
// 1.function 后面函數名之前有*號
// 2.只能在函數內部使用yield表達式，讓函數掛起function* func(){console.log('one')yield 2;console.log('two')yield 3;console.log('end')
}
// 返回一個遍歷器對象 可以調用next()
let fn = func();
console.log(fn.next())
console.log(fn.next())
console.log(fn.next())

Promise的基本使用

// 相當于一個容器，保存這未來才會結束的事件（異步操作）的一個結果
// 各種異步的操作都可以用同樣的方法進行處理// 對象的狀態不受外界的影響 處理異步操作三個狀態 Pending Resolved Rejected
// 一旦狀態改變，就不會在變，任何時候都可以得到這個結果// then() 第一個參數是resolve 回調函數，第二個參數是可選的 是reject 狀態的回調函數
// then() 返回的是一個新的Promise示例，所以可采用鏈式編程// catch() 用于捕獲異常信息// 1.resolve() 可以直接將一個對象轉換為Promise對象
// 2.all() 同時執行多個promise 對象
// 3.race() 某個異步請求設置超時時間，并且在超時后執行響應的操作 

async 的用法

// 異步操作更加方便
// 基本操作 async 它會返回一個Promise對象
async function f(){let s = await 'hello'let data = s.split('')return data;
}
// 如果async 函數中有多個await 那么 then 函數會等待所有的await指令，運行完成，知道遇到return
f().then(v => {console.log(v)})