ES6总结集合

目录

一、ES6声名变量、常量的var、let、const命令

1.1 变量声名Let与var命令

1.2 const命令`

1.3三者比较

二、ES6扩展运算符（...）

三、ES6的Set与Map

3.1 Set

3.2 Map

四、Set实现普通数组去重、交集、并集、差集

五、Set实现json数组去重、交集、并集、差集

---

---

一、ES6声名变量、常量的var、let、const命令

1.1 变量声名Let与var命令

（1）作用范围

补充：作用域一般包括全局作用域、函数内作用域、块级作用域（包在{}内的范围）

let是块级作用域，var不是。

块级作用域：

{
      let a = 10;
      var b = 10;
 }
    console.log(a); // ReferenceError: a is not defined.
    console.log(b); // 10

for (let i = 0; i < 3; i++) { 
        let i='abc' ; 
        console.log(i);     //打印三次i，因为{}里定义的i跟for里面的i没影响
    }

for (var  i = 0; i < 3; i++) { 
        let i='abc' ; 
        console.log(i);    //打印三次i
    }

for (var i = 0; i < 3; i++) { 
        var i='abc' ; 
        console.log(i);    //打印一次i
    }

（2）变量提升

console.log(i); // undefined
 var i = 0
//当使用var声明的话，是存在变量提升的。即变量在定义之前可以使用，只是没有定义罢了

console.log(i); // Uncaught ReferenceError: Cannot access 'i' before initialization
 let i = 0
//当使用let声明的时候，不存在变量提升

（3）变量重复声明

function a() {
    var i = 0;
    var i = 1;
}
//不报错


function a() {
    var i = 0;
    let i = 1;   // Uncaught SyntaxError: Identifier 'i' has already been declared
}

1.2 const命令`

const声明一个常量，一旦声明，常量的值就不能再改变，同一个闭环的调用中不能给其改变值。

1.3三者比较

特性	var	let	const
变量提升	true	false	false
全局变量	true	false	false
重复声明	true	false	false
重复赋值	true	true	false
暂时性死区	false	true	true
块级作用域	false	true	true
只声明不初始化	true	true	false

二、ES6扩展运算符（...）

作用：扩展运算符（spread），是三个点（...），他是将一个将一个数组转化为逗号分隔的参数序列，基本效果就是获取数组中每个值。该运算符主要用于函数调用。

基本案例：

console.log(...[1, 2, 3])
// 1 2 3
console.log(1, ...[2, 3, 4], 5)
// 1 2 3 4 5

三、ES6的Set与Map

3.1 Set

定义：ES6提供了新的数据结构Set，他类似于数组，但是他的成员都是唯一的，没有重复的值。

基本案例：

var set = new Set([1, 2, 3, 4, 4]);
[...set]
// [1, 2, 3, 4]

补充：在Set内部，两个NAN是相等的，两个对象都是不想等的。

Set操作方法:

• add(value)：添加，返回set结构本身
• delete(value)：删除，返回一个布尔值，表示是否删除成功
• has(value)：是否存在，返回一个布尔值，表示该值是否是set的成员
• clear()：清除所有成员，没有返回值

3.2 Map

定义：Map提供的是一种“值跟值”对应，是一种更完善的Hash结构实现。如果你需要“键值对”的数据结构，Map比Object更合适。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键。

基本用法：

var m = new Map();
var o = {p: "Hello World"};

m.set(o, "content")
m.get(o) // "content"

m.has(o) // true
m.delete(o) // true
m.has(o) // false

const map2 = new Map([
        ["a1","1"],
        ["a2","2"],
        ["a3","3"]
    ]);
    map2.set("a4","4");
    map2.delete("a2");
    console.log(map2.has("a2"));//false
    console.log(map2);

实例属性和方法：

• size
• set：添加一个值
• get：
• has
• delete：删除一个值
• clear

遍历方法：

• keys()：获取所有的key
• values()：获取所有的value
• entries()：获取所有的内容
• forEach()

四、Set实现普通数组去重、交集、并集、差集

set是ES6新的数据结构，功能上类似于数组，但是他的成员要求是唯一的，不能重复。

let {log} = console;
let arr = [1,2,3,3];
let arr1 = [1,2,3,3,5];
// 去重
let set1 = new Set([...arr]);  //得到一个set
let set1 = [new Set([...arr])];   //得到一个数组 
log([...set1]);// [1,2,3]
// 并集
let set2 = new Set([...arr, ...arr1]);
log([...set2]);// [1,2,3,5]
// 交集
let set3 = new Set([...set2].filter(x=>set1.has(x)));
log([...set3]);// [1,2,3]
// 差集
let set4 = new Set([...set2].filter(function (x) {
    return !set1.has(x)
}))
log([...set4]); // [5]

五、Set实现json数组去重、交集、并集、差集

1、求交集

let a=[{id:1,a:123,b:1234},{id:2,a:123,b:1234}];
let b=[{id:1,a:123,b:1234},{id:2,a:123,b:1234},{id:3,a:123,b:1234},{id:4,a:123,b:1234}];
let arr = [...b].filter(x => [...a].some(y => y.id === x.id));  //必须多的筛选少的
console.log('arr',arr)

2、取差集

let a=[{id:1,a:123,b:1234},{id:2,a:123,b:1234}];
let b=[{id:1,a:123,b:1234},{id:2,a:123,b:1234},{id:3,a:123,b:1234},{id:4,a:123,b:1234}];
let arr = [...b].filter(x => [...a].every(y => y.id !== x.id));  //必须长度长的筛选长度短的
console.log('arr',arr);