个性化阅读
专注于IT技术分析

ES6块级作用域let及解构数组和解构对象的基本语法

ES6块级作用域、解构函数和对象

一、ES6 块的作用域-let

我们知道在JS5中是没有块级作用域的,只有全局作用域和布局作用域,所谓的局部作用域就是函数作用域,所以才会出现我们在if,for中定义的变量在大括号{ }的外面也能访问。现在ES6中可以用let来定义变量,定义的变量可以在指定的区域内使用,也就是在{ }外是不能访问到的。

例如:

if(true){
let i = 5;
}
console.log(i) // 不能被访问到

二、解构数组-Array

结构数组就是分解一组数组,分解的数组会对应赋值给另外一个数组。好处是我们不用再通过索引来访问数组的值,而是直接使用新数组上的变量名称来标识数组的元素,更加直接的标识了数组元素。

let arr = ['color1','color2','color3'];
let [red, blue, green] = arr;
console.log(red); // color1

三、ES6 解构对象

和解构数组类似,解构对象就是把对象的属性值赋值给自己定义的一个新对象的属性名上,这样我们没必要在访问这个对象的属性来得出结果,而是可以直接访问我们自己定义的那个新变量对象来访问旧对象的属性,因为旧对象的属性值在赋值过程中已经一一把值对应赋值给了新的变量对象。

例如:

let obj = {
name:"Luara",
age:25,
}
let {name:name,age:age} = obj;
console.log(name) // Luara

【这里要注意的是,无论是解构数组还是解构对象,我们自己新定义的变量数组或者变量对象都没必要和数组的元素相等,数组会从索引为0开始填满定义的新数组变量,而对象则可以自由复制,把要使用的对象属性复制给定义的新变量对象就可以了】

四、使用模版字符串

模版字符串就是把变量嵌入到字符串的时候,去掉了那些复杂的符号,直接使用${ 变量 }的格式嵌入到字符串中,字符串在用一对反引号来表达字符串。使用反引号表达的字符串我们知道在字符串中使用回车换行的话,即使不使用任何符号,该字符串也是换行的。在模版字符串的前面可以使用一个标签,这个标签其实就是一个函数,该函数可以带两个参数,分别表示该字符串的字符数组和变量数组。

例如:

let name = 'Luara', age = 15;
let man = `我是 
${name},我今年 ${age}岁了`;
console.log(man) // 我是 Luara,我今年 15岁了
let person = fun`我是 ${name},我今年 ${age}岁了`;
function fun(string, ...value){
console.log(string); // ["我是 ", ",我今年 ", "岁了", raw: Array(3)] 把用变量分割开的字符串组成一个数组 
console.log(value); // ["Luara", 15] 把变量组成一个数组
}

五、判断字符串是否包含某字符

在以前我们要是判断一个字符串里面是否包含某字符串我们可以使用indexOf()函数和search()函数,如果没有找到则放回-1。这两种方法却不能判断该字符以什么字符开头什么字符结尾。这样我们就能很轻易的判断字符串中是否包含某字符了。

例如:

let name = 'Luara', age = 15;
let man = `我是 ${name},我今年 ${age}岁了`;
console.log(man.includes("岁")) // true
console.log(man.startsWith("我是")) // true
console.log(man.endsWith("了")) // true
赞(0) 打赏
未经允许不得转载:srcmini » ES6块级作用域let及解构数组和解构对象的基本语法
分享到: 更多 (0)

评论 抢沙发

评论前必须登录!

 

觉得文章有用就打赏一下文章作者

微信扫一扫打赏