ES6一些常用的基本语法

以下笔记来源于新视觉实训视频，可以在b站搜索 新视觉实训。

const定义常量

     const str="小甲鱼";
     str="小甲鱼111";
      console.log(str) //x

常量不可以被改变。

let定义块级元素

if(true){
            let num=3;
        }
        console.log(num) //x

num只能在if括号中被使用。console.log(num)放入if花括号中就可以正常打印。

 let num=3;
 let num=4;
        
 console.log(num) //x

无法覆盖重复变量。

模板字面量

用于字符串拼接和写模板，使用 `(反引号，左上角波浪线），变量使用 ${ }

        var name="jack";
        var age=18;
        var sex="man";
        // var obj="我的名字是"+name+",我的年龄是"+age+"，我是"+sex

           var obj=`我的名字是${name}，我的年龄是${age}，我是${sex}`;
        document.write(obj)

        打印结果：我的名字是jack，我的年龄是18，我是man

var ele=`
        <h1>
        新视觉
        <em>实训</em>
        基地
        </h1>
        `

//报错 不能存在空格 使用 ` `便于写标签
var ele=“
        <h1>
        新视觉
        <em>实训</em>
        基地
        </h1> 
        ”             

解构赋值

交换值

        var a=1;
        var b=2;
        [a,b]=[b,a];
        console.log(a,b) // 2 1

数组的解构

        var arr=[1,2,3,4];
        [a,b, ,d]=arr
        console.log(a,b,d) // 1 2 4 相当于直接把数组中元素赋值

对象的解构

  var data={
            name:"丁丁",
            age:90,
            sex:"女",
            job:"学生"
        }
        var {name,job}=data
        console.log(name,job) //丁丁,学生

返回值解构

 function arr(){
            var a=1,b=2,c=3,d=4;
            return {a,b,c,d}
        }
        var {a,c,d}=arr();
        console.log(a,c,d) // 1 3 4

箭头函数

箭头函数相当于匿名函数，并且简化了函数定义。（）中放参数，没有参数就省略，箭头后面是函数体。

var obj={
            name:"张三",
            fun:function(){
                return this.name
            },
            fun2(){
                console.log("第二种定义函数的方式")
            },
            fun3(){ 
                var that=this   //只有用that=this 才能定位到当前对象obj，才能拿到当前对象的name
                setTimeout(function(){
                    console.log(that.name+"---fun3")
                },1000)
            },
            fun4(){
                //用箭头函数和fun3作用相同
                setTimeout(()=>{
                    console.log(this.name+"---fun4")
                },1000)
            }
        }

     ()=>{}  

ES6之前访问函数外面的this比较麻烦，箭头函数可以直接访问到最外面的this，不需要转换。

for循环遍历

   for-of循环遍历

var arr=["aaa","bbb","ccc","ddd"];
        for(var i of arr){
            console.log(i)
        }
        //aaa
        //bbb
        //ccc
        //ddd 

//追加数据到数组
var newArr=[]
        arr.forEach((item,idx)=>{
            //idx是索引值

                item=item+"小程序"
                newArr.push(item)
        })
        console.log(newArr)

    用map效果与forEach相同

展开运算符...

        var arr=["aaa","bbb","ccc","ddd"];
        var arr2=[111,222,333,444]
        arr[4]=arr2
        console.log(arr)

如果想要将arr2中的元素拼接到arr中，这样的做法是不正确的。只会把整个arr2数组加入arr[4]位置。

              

arr=arr.concat(arr2)  //老方法

var newArr=[...arr,...arr2]  //展开数组 新方法

默认参数

function fun(x=0,y=2,z=true){
            console.log(x,y,z);
        }

        fun(); //0 2 true
        fun(4,0,false); //4 0 false