ES6新增特性小结

桃扇骨 2022-12-19 08:56 97阅读 0赞

# ES6新增特性 #

1.  变量
    
     *  var :可重复声明；函数级作用域；
     *  const ：不可重复声明；块级作用域；常量
     *  let ：不可重复声明；块级作用域；变量
        
            var a = 10 
                    var a = 12
                    console.log(a);//12 ;可重复声明 
            
                    let b = 20 
                    b = 22 
                    console.log(b);// 22 ;let 变量，如果换成const会报错，因为const声明常量 
                    const c = 30
2.  箭头函数
    
     *  书写方便：只有一个参数，则可以省略小括号；只有一个return 语句，则函数的大括号｛｝y也可以省略
     *  this指向（父级作用域）
3.  参数扩展
    
        var arr = [ 1,2,3]
                var  arr2 = [...arr,...arr]
                console.log(arr2);//[1, 2, 3, 1, 2, 3]
4.  数组方法
    
     *  map 一对一
     *  reduce 多对一
     *  filter 过滤
     *  forEach 循环
    
        let arr = [44,55,66,77]
                let result = arr.map(item => item >60 ? "及格":"不及格")
                console.log(result);// [不及格,不及格,及格,及格]
        
                let arr1 = [ 11,24,47,987 ]
                let result1 = arr1.reduce((tmp,item,index)=>{ 
                    return tmp + item 
                })
                console.log(result1)// 1069
        
                let arr2 = [90,94,88,100]
                let result2 = arr2.filter(item => item >90 )
                console.log(result2)// [94, 100]
        
                let arr3 = [1,2,3]
                arr3.forEach(item =>{ 
                    let result3 = item*2
                    console.log(result3)// 2,4,6
                })
5.  字符串
    
     *  模板字符串
6.  Promise
    
     *  封装异步操作
     *  三种状态：pending ,resolved, rejected
     *  promise.all()
    
        Promise.all([$ajax('XXX'),$ajax('YYY')]).then(result=>{ 
                    // 成功了
                    // 利用解构赋值把两个请求的值分离出来
                    let [arr1,arr2] = result
                },err=>{ 
                    // 出错了
                })
7.  generator
8.  json
    
        javascript对象转换成 json 
        JSON.stringify({ a:12,b:5}) ==>  { "a":12,"b":5}
        json 转换成 javascript对象 
        JSON.parse({ "a":12,"b":5}) ==>  { { a:12,b:5}}
9.  面向对象
10. 解构赋值
    
     *  let \[a.b,c\] = \[12,5,8\]
     *  左右结构一样；右边内容合法；声明和赋值一次完成