es6 入坑笔记(一)---let,const,解构,字符串模板

let 

全面取代var

大概相似于C++的定义,一个变量必须得先定义后使用,没有预编译

注意let的作用域,一个{}就是一个作用域,上述规则须在一个作用于内

坑:for(let i =0;i < 10; i++){

    let i=20;

  }

这个例子存在父子作用域,即(){}各为一个作用域,所以i可以重复let

const

即静态变量值不允许改变,常用于声明为一个常量

坑:let arr=new array(1,2,3);

  arr.push(4);//arr:1,2,3,4

因为数组为引用,引用的地址不能改变,但地址映射的数组内的值可以改变

要想完全不变则使用:object.freeze();

解构

es6最强大的功能之一,简而言之即左边的结构与右边的结构进行匹配,如果匹配成功则赋值给z左边

eg:

let a = 10,b = 20;

let [c,d] = [b,a];//c = 20,d = 10

//当做左边的与右边的不匹配则为undifine

let [e,f,g] =[b,a]//e=20,f=10,g:undefine

//左边可设默认值,当左边与右边的不匹配时使用默认值

let [h, i,j=100] = [b,a]//h=20,i=10,j=100

//对象赋值,同上,但可取别名,注意对象进行模式匹配时是按照键名进行匹配,不是循序匹配

let json = {

  name:"zjj",

  age:"20",

  sex:"man"

};

let [name,aaaaa,age:Age]=json;//name="zjj" ,aaaaa = undifune, Age = "20"

坑:

1.解构时null视为一个正常值,当右边为null时左边匹配的默认值不会生效,只有当右边完全等于(===)undifine时默认值才会生效

2.解构时的默认值为惰性的,只有使用的才会求值 

function f() { console.log('aaa'); }

let [x = f()] = [1];//不会打印出aaa

3.解构时右边的值必须为可以遍历的结构,例如数组,对象,set,map等,let [demo] = 10;//ERROR

4.

let x;

{x} = {x: 1};

上面代码的写法会报错,因为 JavaScript 引擎会将{x}理解成一个代码块,从而发生语法错误。只有不将大括号写在行首,避免 JavaScript 将其解释为代码块,才能解决这个问题。改为

let x;

({x} = {x: 1});

上面代码将整个解构赋值语句,放在一个圆括号里面,就可以正确执行

字符串模板

let name = "zjj",age = 15;
let str=`名字为:${name},年龄:${age}`;//str="名字为:zjj,年龄:15"

字符串使用`,拼接的内容使用${...}的形式

猜你喜欢

转载自blog.csdn.net/qq_38052995/article/details/83833976