es6加深理解

set的使用場景
以下是本人對ng-zorro-antd 的table選中狀態代碼註釋

setOfCheckedId = new Set<string>(); // checkbox 選擇ids
// 每次點擊更新Set集合
 updateCheckedSet(id: string, checked: boolean): void {
    if (checked) {
      this.setOfCheckedId.add(id);
    } else {
      this.setOfCheckedId.delete(id);
    }
  }
//  改變checkbox的時候改變該值，等同於checked的值
  onItemChecked(id: string, checked: boolean): void {
    this.updateCheckedSet(id, checked);
    this.refreshCheckedStatus();
  }
// 全選和反選
  onAllChecked(value: boolean): void {
    this.listOfCurrentPageData.forEach(item => this.updateCheckedSet(item.id, value));
    this.refreshCheckedStatus();
  }
// 獲取表單checkbo的值
  onCurrentPageDataChange($event: any[]): void {
    this.listOfCurrentPageData = $event;
    this.refreshCheckedStatus();
  }
// 每次選擇後都會刷新這裏的值，重新渲染一遍
  refreshCheckedStatus(): void {
  // 過濾所有值的選擇狀態
    this.checked = this.listOfCurrentPageData.every(item => this.setOfCheckedId.has(item.id));
    // 沒選中的值
    this.indeterminate = this.listOfCurrentPageData.some(item => this.setOfCheckedId.has(item.id)) && !this.checked;
  }

---

1. 解構默認值

需要注意的是undefined和null的區別。

let [a,b="張三"]=['李四',undefined];
console.log(a+b); //控制檯顯示“技術胖張三”

undefined相當於什麼都沒有，b是默認值。

let [a,b="張三"]=['王五',null];
console.log(a+b); //控制檯顯示“王五null”

null相當於有值，但值爲null。所以b並沒有取默認值，而是解構成了null。

2. 圓括號的使用

如果在解構之前就定義了變量，這時候你再解構會出現問題。下面是錯誤的代碼，編譯會報錯。

let foo;
{foo} ={foo:'張三'};
console.log(foo);

要解決報錯，使程序正常，我們這時候只要在解構的語句外邊加一個圓括號就可以了。

let foo;
({foo} ={foo:'張三'});
console.log(foo); //控制檯輸出張三

3. 查找是否存在:

先來看一下ES5的寫法，其實這種方法並不實用，給我們的索引位置，我們自己還要確定位置。

let name='張三';
let blog = 'hello world';
document.write(blog.indexOf(name));

這是網頁中輸出了20，我們還要自己判斷。

ES6直接用includes就可以判斷，不再返回索引值，這樣的結果我們更喜歡，更直接。

let name='張三';
let blog = 'hello world';
document.write(blog.includes(name));

Array.of() 代替eval()：

它負責把一堆文本或者變量轉換成數組。在開發中我們經常拿到了一個類似數組的字符串，需要使用eval來進行轉換，如果你一個老手程序員都知道eval的效率是很低的，它會拖慢我們的程序。這時候我們就可以使用Array.of方法。我們看下邊的代碼把一堆數字轉換成數組並打印在控制檯上：

let arr =Array.of(3,4,5,6);
console.log(arr);

當然它不僅可以轉換數字，字符串也是可以轉換的，看下邊的代碼：

let arr =Array.of('大帝','張飛','表妹');
console.log(arr);

嚴格模式的問題

有默認處理，會導致衝突，將b的默認值去除即可

function add(a,b=1){
    'use strict'
    if(a == 0){
        throw new Error('This is error');
    }
     return a+b;
}

console.log(add(1));

獲得需要傳遞的參數個數

function add(a,b){
    'use strict'
    if(a == 0){
        throw new Error('This is error');
    }
     return a+b;
}

console.log(add.length);

嚴格模式下是2，普通模式下是1

Object.is

區分=== 和 is方法的區別是什麼，看下面的代碼輸出結果。

console.log(+0 === -0);  //true
console.log(NaN === NaN ); //false
console.log(Object.is(+0,-0)); //false
console.log(Object.is(NaN,NaN)); //true

===爲同值相等，is()爲嚴格相等。

Symbol對象元素的保護作用

現在我不想別人知道我的年齡，這時候我就可以使用Symbol來進行循環保護。

let obj={name:'張三',skill:'web'};
let age=Symbol();
obj[age]=18;
for (let item in obj){
    console.log(obj[item]);
} 
console.log(obj);

Set 和 WeakSet 數據結構

Set 不是數據類型，而是數據結構

Set

傳入的是數組

Set和Array 的區別是Set不允許內部有重複的值，如果有隻顯示一個，相當於去重。雖然Set很像數組，但是他不是數組。

add, delete, has, clear, for…of, size
集合的並集，交集，差集和php裏面對數組的操作差不多，漸漸向其他語言或者說語言的共性靠近，從語言本身而不是外部工具包去增強其實用性。

WeakSet

傳入的是對象

Map

Json和map格式的對比，個人覺得類似redis的操作

map的效率和靈活性更好

鍵可以是對象，數組等

set, get, delete, size, has, clear