ES6中的新变量 let 、const和解构赋值

前言

为什么学习es6

每一次标准的诞生都意味着语言的完善,功能的加强。JavaScript语言本身也有一些令人不满意的地方。

- 变量提升特性增加了程序运行时的不可预测性

- 语法过于松散,实现相同的功能,不同的人可能会写出不同的代码

一、let变量

1.块级作用域

如果在外面选择输出,就会出现未定义的报错提示。

for(let i=1;i<10;i++){ console.log(i);
 } // console.log(i);//未定义

2.不存在变量提升

let必须写在输出的前面,不然会直接报错,需要格外的注意,也是先定义变量才能使用。

//console.log(i);//报错 let i=1; console.log(i);

3.使用let变量需要先声明后使用

需要先声明变量,不声明变量直接使用,会出现没有声明的提示,要牢记先声明后使用的流程。



  let i=1;
if(true){
i=2;
//let i=3;//报错
 }
console.log(i);




4.不能重复声明

let a=1; // let a=3; //重复了 报错

5.总结

-- let 关键字用来声明块级变量。

-- 特点就是在{}声明具有块级作用域,var变量无此特点。

-- 防止循环变量编程全局变量。

-- let 关键词无变量提升。

-- let 关键词有暂时性死区的特点。{先声明后使用}

二、const变量

1.块级作用域

与let用法相同

var a=1; if(true){ const a=2; console.log(a);//输出为2 }

2.声明常量必须赋值

if(true){ const a;//报错 console.log(a);
}

3.常量赋值不能修改

对象可以进行添加,但是不能修改整体的地址。

对象的本身是可变的,所以可以添加属性,但是地址不可改变。

if(true){
	const a=2;
    a=3;
	console.log(a);// 报错
}


const person = {};
person.name ="张三";
person.age=18; 
person = {};//报错

三、let、const和var的区别

- 使用 var 声明的变量,其作用域为该语句所在的函数内,且存在变量提升现象。

- 使用 let 声明的变量,其作用域为该语句所在的代码块内,不存在变量提升。

- 使用 const 声明的是常量,在后面出现的代码中不能再修改该常量的值。

- 使用let,const的声明的变量不属性顶层对象,返回undefined。

四、结构赋值

数组

1.数组的结构赋值

let arr =[1,2,3]; let [a,b,c] = arr; console.log(a,b,c);//1,2,3

2.二维数组

let [a,[b,c],d] = [1,[2,3],4]; console.log(a,b,c,d);//1,2,3,4

3.省略变量

let [a,,c] = [1,2,3]; console.log(a,c);//1,3

4.合并数组

let [a,...b] = [1,'a','b','c']; console.log(a,...b);//1,a,b,c

5.默认值

如果是undefined 默认值生效

let [a,b='2'] = [1,undefined]; console.log(b);//2

对象

 let Person = {realname:"张三",age:19};
 let {realname,age} = Person;
 console.log(realname,age);//张三,19


 let Person = {realname:"张三",age:19};
 let {realname:myrealname,age} = Person;//重命名
 console.log(myrealname,age);//张三,19


 let Person = {realname:"张三",age:19};
 let {realname:myrealname,age height=183} = Person;//默认值
 console.log(height);//183

#刷题#
全部评论
学到了,感谢分享
1 回复 分享
发布于 2022-08-15 20:23

相关推荐

点赞 评论 收藏
分享
点赞 评论 收藏
分享
ESLint&nbsp;是一个&nbsp;JavaScript&nbsp;代码静态分析工具,主要用于检查和规范代码风格,并发现潜在的问题和错误。它可以帮助开发团队建立一致的代码风格,提高代码质量,减少潜在的&nbsp;bug。ESLint&nbsp;的工作原理如下:https://www.nowcoder.com/issue/tutorial?zhuanlanId=Mg58Em&amp;uuid=07d53be4cd034a4ab270d500feebcc8d⭕配置:&nbsp;ESLint&nbsp;首先需要一个配置文件,通常是一个&nbsp;.eslintrc&nbsp;文件,用于指定代码规则和插件。配置文件可以是&nbsp;JSON&nbsp;格式或&nbsp;JavaScript&nbsp;模块,具体配置规则可以根据项目需求进行定义。⭕解析器:&nbsp;ESLint&nbsp;使用解析器(Parser)将&nbsp;JavaScript&nbsp;代码转换成抽象语法树(AST)。常见的解析器有&nbsp;Espree、Babel&nbsp;Parser&nbsp;等,用于支持&nbsp;ES6+&nbsp;语法和&nbsp;JSX&nbsp;语法的解析。⭕规则:&nbsp;ESLint&nbsp;根据配置文件中指定的规则,对&nbsp;AST&nbsp;进行遍历和检查。规则可以是内置的,也可以是通过插件扩展的。每个规则都定义了一条或多条代码规范,例如变量命名规范、缩进规范、禁用未使用的变量等。⭕报告问题:&nbsp;当&nbsp;ESLint&nbsp;在代码中发现与规则不符的问题时,它会生成相应的警告或错误信息。开发者可以根据这些提示来进行代码修复或优化。⭕插件和扩展:&nbsp;ESLint&nbsp;可以通过插件进行功能扩展。插件提供了额外的规则和检查器,用于检测特定类型的问题或优化代码。开发者可以根据项目需求选择合适的插件。总结起来,ESLint&nbsp;的作用是帮助开发团队统一代码风格,减少错误和潜在问题,从而提高代码质量。它通过静态分析&nbsp;JavaScript&nbsp;代码,根据预先定义的规则对代码进行检查,并提供相应的报告和提示。通过合理的配置和规则选择,可以将&nbsp;ESLint&nbsp;集成到开发工作流程中,确保代码的一致性和可维护性。
点赞 评论 收藏
分享
1 1 评论
分享
牛客网
牛客企业服务