vue---ES6语法

超、凢脫俗 2022-12-02 12:20 129阅读 0赞

1：变量声明：  
**var 声明的变量不存在的时候返回notdefind,let声明的变量如果不存在则报错，也就是let没有预编译的功能。const声明的变量，不但不允许提前访问，而且也不允许修改。**

// 1:var let connst 的区别
            console.log(iNum1);
            var iNum1  = 10
            结果是notdefind
            console.log(iNum2);
            let iNum2 = 10;
            结果报错
            console.log(iNum3);
            const iNum3 = 10;
            结果也会报错
            const iNum4 = 10;
            iNum4 = 30;
            结果也会报错

2：ES6的对象的写法：  
**支持使用之前的变量。**

var name = '小明';
            var age = 20;
    
            var oObj = {
        
                name,
                age,
                fnGetName:function(){
        
                    alert(this.name);
                }
            }
            oObj.fnGetName();

3：ES6的箭头函数：

//3:ES6的箭头函数：
            var fnTest= ()=>{
        
                alert("哈哈哈");
            }
            //一个参数的写法：
            var fnTest2 = a =>{
        
                alert(a);
            }
            //多参数的写法
            var fnTest3 = (a,b)=>{
        
                return a + b;
            }

4：改变this的指向  
如果层级比较深的时候, this的指向就变成了window, 这时候就可以通过箭头函数解决这个指向的问题。

此时oObj2的结果是name= 小芳，因为this.name指向变了。

var oObj = {
        
                name:'小明',
                fnAlert:function(){
        
                    setTimeout(()=>{
        
                        alert(this.name);
                    },1000);
                }
            }

这样写就会正常输出。