JS问题整理与思考--es6的其他常用功能

  • let/const

    定义常量,定义之后不能修改

  • 多行字符串
                const name = 'zhangsan'
                const html = `<\div>
                    <\p>${name}<\/p>
                <\/div>`
            
  • 解构赋值
                const obj = {a:10,b:20,c:30}
                const {a,c} = obj
                console.log(a)
                console.log(c)
    
                const arr = ['xxx','yyy','zzz']
                const[x,y] = arr
                console.log(x)
                console.log(y)
            
  • 块级作用与
                var obj = {a:100,b:200}
                for(var item in obj){
                    console.log(item)
                }
                console.log(item)     // 'b'
    
                // ES6
                const obj = {a:100,b:200}
                for(let item in obj){
                    console.log(item)
                }
                console.log(item) // undifined
    
    
            
  • 函数默认参数
                function (a,b){
                    if (b == null){
                        b = 0
                    }
                }
    
                function (a, b=0){
                }
            
  • 箭头函数

    一个参数跟两个参数写法不同

                var arr = [1,2,3]
                arr.map(function(item){
                    return item+1
                })
    
                const arr = [1,2,3]
                arr.map(item=>item + 1)
                arr.map((item,index)=>{
                    return item+1
                })
    
            

    解决了函数内this指向window的坑,将函数中this指向最近一层的函数体

                function fn(){
                    console.log('real', this)   // {a"100}
                    var arr = [1,2,3]
                    arr.map(function(item){
                        console.log(this)   // window
                    })
    
                    arr.map(item =>{
                        console.log(this) // {a:100}
                    })
                }
                fn.call({a:100})
            

随机浏览