墨少亲够了吗 ES6这些就够了.docx

墨少亲够了吗 ES6这些就够了

　　刚开始用vue或react，很多时候我们全部会把ES6这个大弟兄加入我们的技术栈中。不过ES6那么多那么多特征，我们需要全部全部掌握吗？秉着二八标准，掌握好常见的，有用的这个能够让我们快速起飞。
　　接下来我们就聊聊ES6那些可爱的新特征吧。
　　我们全部是知道在ES6以前，var关键字申明变量。不论申明在何处，全部会被视为申明在函数的最顶部。这就是函数变量提升比如:
　　function aa {
　　if {
　　   var test = 'hello man'
　　} else {
　　  
　　}
　　}
　　以上的代码实际上是：
　　function aa {
　　var test // 变量提升
　　if {
　　   test = 'hello man'
　　} else {
　　   //此处访问test 值为undefined
　　  
　　}
　　//此处访问test 值为undefined
　　}
　　因此不用关心bool是否为true or false。实际上，不论怎样test全部会被创立申明。
　　接下来ES6主角登场：
　　我们通常见let和const来申明，let表示变量、const表示常量。let和const全部是块级作用域。怎么了解这个块级作用域？
　　在一个函数内部
　　在一个代码块内部
　　说白了 {}大括号内的代码块即为let 和 const的作用域。
　　看以下代码：
　　function aa {
　　if {
　　  let test = 'hello man'
　　} else {
　　   //test 在此处访问不到
　　  
　　}
　　}
　　let的作用域是在它所在目前代码块，但不会被提升到目前函数的最顶部。
　　再来说说const。
　　const name = 'lux'
　　name = 'joe' //再次赋值此时会报错
　　说一道面试题
　　var funcs =
　　for ="">
　　   { })
　　}
　　{
　　   func
　　})
　　这么的面试题是大家常见，很多同学一看就知道输出 10 十次
　　不过假如我们想依次输出0到9呢？两种处理方法。直接上代码。
　　// ES5告诉我们能够利用闭包处理这个问题
　　var funcs =
　　for ="">
　　   {
　　       return function {
　　          
　　       }
　　   }))
　　}
　　// es6
　　for ="">
　　   {
　　      
　　   })
　　}
　　达成相同的效果，es6简练的处理方案是不是更让你心动！！！
　　es6模板字符简直是开发者的福音啊，处理了ES5在字符串功效上的痛点。
　　第一个用途，基础的字符串格式化。将表示式嵌入字符串中进行拼接。用${}来界定。
　　//es5 
　　var name = 'lux'
　　//es6
　　const name = 'lux'
　　//hello lux
　　第二个用途，在ES5时我们经过反斜杠来做多行字符串或字符串一行行拼接。ES6反引号直接搞定。
　　// es5
　　var msg = "Hi \
　　man!
　　"
　　// es6
　　const template = `
　　   hello world
　　`
　　对于字符串es6当然也提供了很多厉害的方法。说多个常见的。
　　// ：判定是否包含然后直接返回布尔值
　　let str = 'hahay'
　　) // true
　　// : 获取字符串反复n次
　　let s = 'he'
　　) // 'hehehe'
　　//假如你带入小数, 来处理
　　函数默认参数
　　在ES5我们给函数定义参数默认值是怎么样？
　　function action {
　　   num = num || 200
　　   //当传入num时，num为传入的值
　　   //当没传入参数时，num即有了默认值200
　　   return num
　　}
　　但细心观察的同学们肯定会发觉，num传入为0的时候就是false， 此时num = 200 和我们的实际要的效果显著不一样
　　ES6为参数提供了默认值。在定义函数时便初始化了这个参数，方便在参数没有被传输进去时使用。
　　function act