es6 箭头函数 模板字符串 点点点运算符

一、ES6 官方名称ES2015

• 在语法层面做了一些更新,有一些工具可以将es6的代码转换为es5
• 新增了两个定义变量的关键字

let const 和 var 的区别

var 可以进行预解析，必须要先定义再使用

• var 可以重复声明，let const 不能重复声明
• var没有块级作用域，let和const有块级作用域

• 块级作用域 被代码块限制变量的使用
• var 只用函数私有作用域可以限制它的使用范围，let和const只要是书写代码断的{}都可以限制它的使用范围
• es5 中 全局作用域 函数作用域

let 声明变量的

• 不会进行预解析
• 不能重复声明
• 块级作用域
• 不存在变量提升
• 不影响作用域链

const 声明常量的

• 不会进行预解析
• 常量在声明的时候一定要赋初始值，否则就会报错
• 常量是不可改变的（不能修改）
• 块级作用域
• 常量命名的时候要大写
• 当给常量赋值为一个复杂数据类型的时候，对复杂数据类型里的成员进行修改时，不算是对常量的修改

二、箭头函数

含义：

官方解释：箭头函数里面的this是上下文（content），外部作用域的this就是箭头函数的this

个人理解：箭头函数this就是，看一下箭头函数写下哪一行，上一行的this就是箭头函数的this

一个新的定义函数的方式，其实就对函数表达式的简写方式（匿名函数）

箭头函数的语法格式： ()=>{}

() : 设置形参的地方
=> : 箭头函数的标志
{} : 代码断

箭头函数的特征

• 当只有一个形参时，小括号可以省略
• 一句代码执行语句的时候可以省略大括号（花括号），并且自动return返回那一句语句的结果
• 箭头函数里面没有arguments（arguments：用来接收用户传入的实参，他是一个伪数组）
• 箭头函数里面没有this
• 箭头函数内的this，任何方法都改变不了，因为箭头函数内没有自己的this，它使用的是外部作用域的this

• call apply bind 不能改变箭头函数内的this指向

三、函数参数的默认值

作用：给函数的形参设置一个默认值

当我传入了实参的时候，就是用实参，如果没有传递实参，就使用形参的默认值
如果形参没有设置默认值，就返回undefined

• 箭头函数可以给形参设置默认值

如果箭头的形参设置了默认值，不管有多少个形参，箭头函数的小括号都是不能省略的

四、模板字符串

• js中字符串是使用引号包围的：单引号 双引号 反引号 （内单外双，外双内单）

模板字符串就是使用反引号包围的字符串

• 模板字符串可以直接书写换行

• 使用innerText是换行，使用innerHTML却是空格

• 模板字符串可以使用变量拼接字符串
• 模板字符串可以调用函数
  例：

        let div=document.querySelector('div')
        let b="666"
        let a=`撒过得${b}好
        减肥大赛`
        // div.innerHTML=a;
        div.innerText=a;

        let newFn=function(a,b,c){
            console.log('-------',a,b,c)
        }
        newFn`hello${a}word${b}你好`
     /*  模版字符串的内容就是函数的参数 
         newFn`hello${a}word${b}你好`
         执行步骤：
         1.使用用${}将字符串切开，得到的子字符串放到一数组里['hello','word','你好'],
           这个数组作为函数的第一个实参传入函数
         2.${a} 里变量a作为函数的第2个实参传入函数
         3.${b} 里变量b作为函数的第3个实参传入函数  */

总结：使用${}将字符串切开，得到的子字符串放到一数组里，作为函数的第一个参数，从左到右依次将每一个${}里的变量作为函数后的参数
作用：将字符串的各部分都给你，你在函数可以自由组合

五、… 点点点运算符

• 展开运算符

• 当在函数的实参的位置或数组对象的前面使用时候是执行展开
  作用：将包裹的内容全部打开

• 合并运算符

• 在函数的形参位置使用...运算符的时候，是执行和合并的操作
• 箭头函数没有arguments，我们可以自己整一个，接收用户传入的实参

---

六、其他

call apply bind的作用和区别

• call：绑定this 直接调用函数
• apply: 绑定this指向，直接调用函数，第二个参数必须是数组，以数组的形式给给调用的函数传参
• bind：绑定this指向 ,不会立即调用函数，而是返回一个绑定了this指向的新的函数

• 函数的内部都有this
• 函数以普通函数的形式调用的时候，this指向window
• 以对象的放法的形式调用的时候，this指向调用它的对象
• 多层this嵌套的时候，内层的this指向window
• 定时器 setTimeout(function(){},ms) setInterval(function(){},ms)
• 定时器里的this指向window
• 事件处理函数里的this指向 事件源，谁绑定了该事件，就指向谁