let 、const 、var 的区别 、结构赋值 ES6 箭头函数、Array 的扩展方法、模板字符串、repeat方法、Set 数据结构

let 、const 、var 的区别

• 使用 var 声明的变量 其作用域 为该语句所在的函数内 且存在变量提升现象
• 使用let 声明的变量 其作用域为 该语句所在的代码块内不存在变量提升
• 使用 const 声明的是常量 在后面出现的代码中 不能修改改成改该常量的值
  

结构赋值

ES6中允许从数组中提取值 按照对应位置 对变量赋值 对象也可以实现解构

let[a,b,c ，d] = [1,2,3]
console.log(a) //1
console.log(b) //2
console.log(c) //3
console.log(d) //undefined

如果结构不成功 变量的值为undefined

对象结构

按照一定模式从数组或对象中 提取值 将提取出来的值赋值给另外的变量

let person = { name :'zbj',age : '500' }
let {name ,age} = person;
console.log( name ) // zbj
console.log(age) // 500

箭头函数

• ES6中新增的定义函数的方式 （）=>{ }
• 是用来简化函数定义语法的
• 箭头函数表达式的语法比函数表达式更简洁，并且没有自己的this，arguments，super或new.target
• 箭头函数表达式更适用于那些本来需要匿名函数的地方，并且它不能用作构造函数。
• 箭头函数 this 是静态的 始终 指向函数声明所在作用域下的this的值

 <script>
        let fn = (a, b) => {
   
            return a + b
        }
        let aa = fn(1, 2)
        console.log(aa);

        // 箭头函数 this 是静态的 始终 指向函数声明所在作用域下的this的值
        function getName() {
   
            console.log(this.name);
        }
        let getName2 = () => {
   
            console.log(this.name);
        }
        window.name = '箭头函数'

        const hanshu = {
   
            name: "J箭tou"
        }
        // 直接调用
        getName()
        getName2()
        // call 方法调用
        getName.call(hanshu)  // J箭tou
        getName2.call(hanshu) //箭头函数

        // 不能作为构造函数实例化对象
        // 不能使用 arguments 变量
        // let fn = () => {
   
        //     console.log(arguments);
        // }
        // fun(1, 2)  // 报错
        // 箭头函数的简写
        // 省略小括号 当形参有且只有一个的时候
        let add = n => {
      // n 省略小括号
            return n + n
        }
        console.log(add(9));

        // 省略花括号
        // 当代码体 只有一条语句的时候  return 必须省略 
        // 语句执行结果就是函数返回值
        let p = n => n * n
        console.log(p(9));
    </script>
</body>

箭头函数 实践

 <style>
        .ad {
   
            width: 100px;
            height: 100px;
            background-color