ES6基本语法

let

ES6中创建变量使用let
作用域只限制于当前代码块
使用let声明的变量作用域不会被提升
在相同的作用域下不能声明相同的变量
for循环体现let的父子作用域

1:作用域只限制于当前代码块
 {
        var str = '张三';
        console.log(str);  // 张三

        let str1 = '李四';
        console.log(str1); // 李四
}
console.log(str);     // 张三
console.log(str1);    // str1 is not defined

2:使用let声明的变量作用域不会被提升
{
    console.log(str); // undefined
    var str = '张三';

    console.log(str1); // str1 is not defined
    let str1 = '李四';
}

3:在相同的作用域下不能声明相同的变量
{
    var str = '张三';
    var str = '李四';
    console.log(str); // 李四

    let str1 = '张三';
    let str1 = '李四';
    console.log(str1);
 // Identifier 'str1' has already been declared（标识符'str1'已经被声明）
}

4. for循环体现let的父子作用域
{
    for (let i = 0; i < 5; i ++) {
        let i = 20;
        console.log(i);  // 会打印5次20
    }
}

const

ES6中创建常亮使用const
只在当前代码块中有效
作用域不会被提升
不能重复声明
声明的常亮必须赋值

解构赋值

ES6允许按照一定模式从数组和对象中提取值对变量进行赋值，这被称之为解构赋值

基本用法

let [name, age, height] = ['cwz', 8, 1.88];
console.log(name);
console.log(age);
console.log(height);

对象解构赋值

let {name, age, friends, animation} = {
        name : '张三',
        age : '18',
        friends : ['lulu', 'xixi', 'ququ'],
        animation : {
            up : 'shang',
            down : 'xia'
        }
 }
console.log(name);
console.log(age);
console.log(friends);
console.log(animation);

数组的解构赋值

let[arr1, [arr2, arr3,[arr4, arr5]]] = [1, [2, 3, [4, 5]]];
console.log(arr1);
console.log(arr2);
console.log(arr3);
console.log(arr4);
console.log(arr5);

基本类型的解构赋值

let [a,b,c,d,e] = '我是程序员';
console.log(a);
console.log(b);
console.log(c);
console.log(d);
console.log(e);

数据集合 - set

特点

类似于数组，没有重复的元素;
用于去除重复的数据;
key和value都是相等的;

    let set = new Set(['1', '2', '3']);
    console.log(set.size); // 3

    // 添加元素
    set.add('cwz').add('zy');
    console.log(set); // Set(5) {"1", "2", "3", "cwz", "zy"}

    // 删除指定元素元素
    set.delete('cwz');
    console.log(set); // Set(4) {"1", "2", "3", "zy"}
  
    // 判断是否存在某个元素
    console.log(set.has('zy')); // true
    console.log(set.keys()); // SetIterator {"1", "2", "3", "zy"}
    console.log(set.values()); // SetIterator {"1", "2", "3", "zy"}

    // 清除所有元素
    set.clear();
    console.log(set); //Set(0) {}

数据集合 - map

特点：

类似于对象，本质上是键值对的集合
‘键’不局限于字符串，各种类型的值，包括对象都可以当做键
是一种更加完善的Hash结构的实现

    let obj1 = {'name' : "cwz"}, obj2 = {'name' : 'zy'};
    const map = new Map([
        ['name', 'cwz'],
        ['age', 18],
        ['height', 1.88],
        [obj1, '110'],
        [obj2, '120'],
        [10, 1]
    ]);
    console.log(map);

   let obj1 = {'name' : "cwz"}, obj2 = {'name' : 'zy'};

    const map = new Map([
        ['name', 'cwz'],
        ['age', 18],
        ['height', 1.88],
        [obj1, '110'],
        [obj2, '120'],
        [10, 1]
    ]);
    console.log(map.keys());
    console.log(map.values());
    console.log(map.entries());

遍历

    let obj1 = {'name' : "cwz"}, obj2 = {'name' : 'zy'};

    const map = new Map([
        ['name', 'cwz'],
        ['age', 18],
        ['height', 1.88],
        [obj1, '110'],
        [obj2, '120'],
        [10, 1]
    ]);

    map.forEach(function (value, index) {
        console.log(index+ ':' +value);
    })

symbol

在ES5中对象的属性名都是字符串容易造成属性名冲突。
在ES6中引入了原始的数据类型symbol，表示独一无二的值。
对象的属性名可以有两种类型：
- 字符串类型
- symbol类型

    let str1 = Symbol('name');
    let str2 = Symbol('name');
    console.log(str1 === str2); // false

    const obj = {};
    obj[Symbol('name')] = '张三';
    obj[Symbol('name')] = '李四';
    console.log(obj);

class

    class Person {
        constructor (name, age) {
            this.name = name;
            this.age = age;
        }
        print(){
            console.log('我的名字是：'+ this.name +'今天'+ this.age + '岁');
        }
    }

    let person = new Person('张三', 18);
    console.log(person);
    person.print();

数组的拓展

    let liArr = document.querySelectorAll("li");

    // Array.isArray : 判断是否是数组
    console.log(Array.isArray(liArr)); // false

    // Array.from() : 转成数组
    let arr = Array.from(liArr);

    console.log(Array.isArray(arr)); // true

    // Array.of : 转成数组
    console.log(Array.of(1, 2, 3, 4, 5, '一', '二', '三'));// [1, 2, 3, 4, 5, "一", "二", "三"]

对象的拓展

    // Object.assign() : 可以合成一个对象
    let obj1 = {'name' : 'cwz'};
    let obj2 = {'age' : 18};
    let obj3 = {'gender' : 'man'};
    let obj4 = {'friend' : 'zy'};
    let obj = {};
    console.log(Object.assign(obj, obj1, obj2, obj3, obj4));;

    // 延展操作符...
    let str = '今天天气很好!';
    let strArr = [...str];
    console.log(strArr);

// 延展操作符... 去重功能
    let myArr = [1,2,10, '张三', 20, 2, 1];
    console.log([...new Set(myArr)]); // [1, 2, 10, "张三", 20]

箭头函数

    // 箭头函数 ()=>{}
    let sum = (sum1, sum2) => {return sum1 + sum2};
    console.log(sum(10, 20)); // 30