        //1. 预解析
        console.log(num)  //undefined
        var num = 100
        console.log(num)  //100

        //定义之前使用 let 声明的变量会报错
        console.log(num2)  //报错
        let num2 = 200
        console.log(num2)  //

        //定义之前使用 const 声明的变量会报错
        console.log(num3)  //报错
        var num3 = 300
        console.log(num3)  //100

var 可以声明两个重名的变量，let 和 const 不能定义重名变量

        //2.重复变量名
        var n1 = 100
        var n1 = 200
        console.log(n1)  //200

        let n2 = 100  //报错
        let n2 = 200

        const n3 = 100  //报错
        const n3 = 200

var 没有块级作用域， let 和 const 有块级作用域

        //3. 块级作用域
        //任何一个可以执行代码段的{} 都会限制该变量的使用范围
        if(true) {
            var num = 100
            console.log(num)  //100
        }
        console.log(num)  //100

        if(true) {
            let num = 100
            console.log(num)  //100
        }
        console.log(num)  //报错

        if(true) {
            const num = 100
            console.log(num)  //100
        }
        console.log(num)  //报错

2. let 和 const 的区别

let 可以定义变量的时候不进行赋值，const 在定义时必须赋值。

        //1. 定义时不赋值
        let num
        console.log(num)  //undefined
        num = 100
        console.log(num)  //100

        const num   //报错：const variable without initializer is not allowed
        console.log(num)
        num = 100
        console.log(num)

let 定义的变量可以被修改，const 定义的常量一经赋值不能被修改。

        //5. 修改
        let num = 100
        console.log(num)  //100
        num = 200
        console.log(num)  //200

        const num = 100
        console.log(num)  //100
        num = 200  //报错：Attempt to assign to const or readonly variable
        console.log(num)

二、箭头函数

箭头函数，就是在 ES6 的语法中对函数表达式的简写，但是对声明式函数不能使用，在某些规则上又和以前的函数有一些不一样。

什么是函数表达式：函数表达式，又叫做匿名函数，也就是我们不需要单独定义函数，直接使用的位置

箭头函数的写法：在书写函数时，省略 function 不写，在小括号和大括号之间书写箭头

比如：

        xxx.onclick = () => {}
        var obj = {fn : () => {} }
        xxx.forEach(() => {} )
        setTimeout(() => {})
        var fn = () => {}

        var fn1 = function () { console.log('我是 fn1 函数') }
        fn1()

        var fn2 = () => { console.log('我是 fn2 函数') }
        fn2()

箭头函数的特殊之处

1. 箭头函数某些时候可以省略 ()：当你的形参只有一个的时候，可以不写 ()

        //1.不加()
        var fn1 =  => { console.log('我没有形参')}  //报错
        fn1()

        var fn2 = a => { console.log('一个形参：', a) }
        fn2(100)  //一个形参： 100

        var fn3 = a, b => { console.log('两个形参：', a, b) }  //报错
        fn3(100, 200)

2. 箭头函数某些时候可以省略 {}：当你的代码只有一句话的时候，可以不写 {}，并且会自动把这一句话的结果当做函数的返回值。

        //2.
        var fn1 = (a, b) => a + b  //也可以省略 return
        console.log(fn1(10, 20))  //30

3. 箭头函数内没有 arguments

        //3.
        var fn1 = () => { console.log(arguments) }  //报错:arguments is not defined
        fn1(100, 200, 300)

        var fn1 = function()  { console.log(arguments) }
        fn1(100, 200, 300)  //输出arguments[100, 200, 300]

4. 箭头函数内没有 this：箭头函数内的 this 就是外部作用域的 this

        //4.
        var obj = {
            fn: function () { console.log(this) },
            fn2: () => { console.log(this) }
        }

        obj.fn() //this 因为 fn 函数被 obj 调用，所以 this 是 obj
        obj.fn2() //因为是箭头函数，内部没有 this，所以就是外部作用域的 this，即Windows的

三、函数参数默认值

函数在定义的时候，可以直接给形参设置一个默认值；没有传递参数的时候，就使用默认值。

当传递了实参，就使用传递的实参，普通函数可以使用，箭头函数也可以使用。

    <script>
        function fn(a = 100, b = 200) {
            //表示声明了两个形参，a 的默认值为100，b 的默认值为200
            console.log('a: ', a)
            console.log('b: ', b)
            console.log('----------------')
        }
        //没有实参，使用默认值
        fn()  //100, 200
        
        //a有实参，b 使用默认值
        fn(10)  //10, 200
        
        //有实参，使用实参值
        fn(10, 20)  //10, 20
    </script>

四、解构赋值

解构赋值：快速从对象或者数组中获取成员

解构赋值分成两种：数组的解构赋值，对象的解构赋值

1. 数组的解构赋值

数组的解构赋值 —— 快速的从数组中获取数据

        //之前
        let arr = ['hello', 'world']
        let a = arr[0]
        let b = arr[1]

        //解构赋值
        var arr = ['hello', 'world']
        //开始解构
        //注意：解构数组使用[]
        var [a, b] = arr
        console.log(a)  // => hello
        console.log(b)  // => world

2. 对象的解构赋值

对象的解构赋值 —— 快速从对象中获取数据

        //之前
        let obj = {
            name: 'Jack',
            age: 18
        }
        let name = obj.name
        let age = obj.age


        //解构对象
        var obj = {name: 'Jack', age: 18}

        //开始解构，注意：解构对象使用{}
        //表示定义一个叫做 name 的变量，获取的是 obj 内一个叫做 name 的成员的值
        var {name, age} = obj
        console.log(name)  //Jack
        console.log(age)  //18

        //可以取别名
        //相当于定一个a 变量，从 obj 内获取一个叫做 age 的值
        var {age: a} = obj  // === var a = obj.age
        console.log(a)  //18

五、模板字符串

就是 ES6 内新增的定义字符串的方式

之前：var str = '内容' 或 var str = "内容"

现在：var str = `内容`

那么以前与现在有哪些区别呢？

1.可以换行书写

    <script>
        //1.
        var s1 = 'hello world'
        var s2 = "hello world"

        var s3 = `
        hello
        world`  //可以随便换行并且在控制台输出时保留格式

        console.log(s1)
        console.log(s2)
        console.log(s3)
    </script>

2. 可以直接在字符串内解析变量

当你需要解析变量的时候，直接书写 ${ 变量 }

        //2.
        var age = 18
        var s1 = `我叫小张小张啊，今年 ${age}岁`
        console.log(s1)  //我叫小张小张啊，今年 18岁

        var s2 = "我叫小张小张啊，今年 ${age}岁"
        console.log(s2)  //我叫小张小张啊，今年 ${age}岁

        var s3 = '我叫小张小张啊，今年 ${age}岁'
        console.log(s3)  //我叫小张小张啊，今年 ${age}岁

六、展开运算符

写法：...

作用：合并数组的[] 或者展开对象的 {}

        console.log(100, 200, 300, 400)   //100 200 300 400
        var arr = [100, 200, 300, 400]
        console.log(arr)   //[100, 200, 300, 400]
        console.log(...arr)   //100 200 300 400

        //作用1：合并数组
        var arr1 = [10, 20]
        var arr2 = [30, 40]
        var arr3 = [50, 60, 70]
        var arr4 = [...arr1, ...arr2, ...arr3]
        console.log(arr4)   //[10, 20, 30, 40, 50, 60, 70]

        //作用2：给函数传递参数
        var arr5 = [10, 20, 19, 69, 34, 45]
        var max = Math.max(...arr5)
        console.log(max)

        //展开对象
        var obj = {name: 'Jack', age: 18}
        //作用：用来复制对象
        //注意：展开书写的顺序问题，在有相同成员的时候，注意顺序
        var obj2 = {
            gender: '男',
            ...obj,
            name: 'Rose'  //覆盖 obj 的 name 属性
        }
        console.log(obj2)  //{gender: '男', name: 'Rose', age: 18}

七、类语法

语法：（将函数，方法等全部包括在大括号里）

class 类名{
    //原先 ES5 内的构造函数体
    constructor () {}

    //直接书写原型上的方法即可（注意：必须和 new 关键字连用）

    //书写静态属性和方法，需要加上一个 static 关键字
}

        //类的书写
        class Person {
            constructor(name, age) {
                //这里按照ES5 的构造函数书写
                this.name = name
                this.age = age
            }

            //直接书写原型上的方法即可
            sayHi () { console.log('hello world') }

            //静态属性
            static a = 100

            //静态方法
            static go () { console.log('running') }
        }

        //用法和之前一样
        var p1 = new Person('张三', 18)
        console.log(p1)
        p1.sayHi()

        // var p2 = Person('lisi', 20)  //报错，不能 不和 new 连用

        //使用静态属性和方法
        Person.go()
        console.log(Person.a)