es6 for循环_前端工程师进阶：2019年了，这些ES6语法知识点你了解了吗（上）

最新推荐文章于 2022-06-04 22:39:26 发布
最新推荐文章于 2022-06-04 22:39:26 发布
阅读量141 收藏
点赞数
文章标签： es6 for循环
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_34837971/article/details/113413796
版权

前言

ECMAScript 6.0(简称ES6)，作为下一代JavaScript的语言标准正式发布于2015 年 6 月，至今已经发布3年多了，但是因为蕴含的语法之广，完全消化需要一定的时间，这里我总结了部分ES6，以及ES6以后新语法的知识点，使用场景，希望对各位有所帮助

本文讲着重是对ES6语法特性的补充，不会讲解一些API层面的语法，更多的是发掘背后的原理，以及ES6到底解决了什么问题

如有错误,欢迎指出,将在第一时间修改,欢迎提出修改意见和建议

话不多说开始ES6之旅吧~~~

let/const(常用)

let,const用于声明变量，用来替代老语法的var关键字，与var不同的是，let/const会创建一个块级作用域(通俗讲就是一个花括号内是一个新的作用域)

这里外部的console.log(x)拿不到前面2个块级作用域声明的let:

349f9a8d7d72718cbd3f07fdf1bbc06e.png

在日常开发中多存在于使用if/for关键字结合let/const创建的块级作用域，值得注意的是使用let/const关键字声明变量的for循环和var声明的有些不同

017975ad06e9a76bde6884547a71ac2d.png

for循环分为3部分，第一部分包含一个变量声明，第二部分包含一个循环的退出条件，第三部分包含每次循环最后要执行的表达式，也就是说第一部分在这个for循环中只会执行一次var i = 0，而后面的两个部分在每次循环的时候都会执行一遍

c42dc6d92c72daa87332e9f839fc0611.png

而使用使用let/const关键字声明变量的for循环，除了会创建块级作用域，let/const还会将它绑定到每个循环中，确保对上个循环结束时候的值进行重新赋值

什么意思呢？简而言之就是每次循环都会声明一次(对比var声明的for循环只会声明一次)，可以这么理解let/const中的for循环

给每次循环创建一个块级作用域:

16f05a42f5320582ec1fb527b028fa2b.png

暂时性死区

使用let/const声明的变量，从一开始就形成了封闭作用域，在声明变量之前是无法使用这个变量的，这个特点也是为了弥补var的缺陷(var声明的变量有变量提升)

dbe08eb8c48c8a1741b636a045a28237.png

在预编译的阶段,JS编译器会先解析一遍判断是否有let/const声明的变量,如果在一个花括号中存在使用let/const声明的变量,则ES6规定这些变量在没声明前是无法使用的,随后再是进入执行阶段执行代码

这里当满足if的条件时,进入true的逻辑,这里因为使用了let声明了变量name,在一开始就"劫持了这个作用域

小弯指
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ES6 中 数组新增的循环
ikEason_的博客
11-23 1240
ES6 数组循环 先说一下ES5循环： 1. for for(let i=0; i<arr.length; i++){ //循环体语句 } 2. while while(条件为真){ //循环体语句 } 然后来说ES6数组中新增的一些循环： forEach | map | filter | some() | every() | reduce() | reduceRight() | for…of… 语法一致 arr.forEach | map | filter |
ES6常用的简写技巧
weixin_50367873的博客
11-08 1517
ES6简写技巧 初级篇 1、三目运算符 const x = 20; let answer; if(x > 10) { answer = ‘greater than 10’; }else { answer = ‘less than 10’; } 简写为: const answer = x > 10 ? ‘greater than 10’ : ‘less than 10’; 2、循环语句 当使用纯JavaScript(不依赖外部库，如JQuery或lodash)时 for(let i = 0;
ES6的三种for循环写法
yuguang的博客
12-02 5874
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script.
ES6中for循环中设置循环变量的部分的作用域范围
qq_42760049的博客
08-07 589
for (let i = 0; i < 3; i++) { } console.log(i) // output: ReferenceError: i is not defined 以上代码报错，说明设置循环变量的部分与外部作用域不是同一个块作用域 for (let i = 0; i < 3; i++) { let i = 'x' conso...
ES6新增块级作用域（函数大括号{}、if与for循环）
weixin_45427936的博客
06-04 301
**块级作用域注意 ** 在es6中新增了块级作用域 ：被 { } 包裹住的代码就是块级作用域( 包括函数中的{ }、if、for循环 ）。 **函数中的{}，if语句，for循环，也是属于块级作用域，let与const定义的变量只能在其中有效** .........
ES6_by_Examples:偏远地区核心商务团队讲座中使用的示例
05-22
下面我们将逐一探讨ES6的关键知识点。 1. **let和const声明** 在ES6之前，我们使用`var`来声明变量，但`let`和`const`的引入解决了作用域和重新声明的问题。`let`允许你在同一作用域内多次声明，但不会覆盖之前的...
ES6_es6_
09-30
以上是ES6中的核心特性，学习和掌握这些知识点能够帮助开发者编写更现代、更健壮的JavaScript代码。在实际开发中，理解并熟练运用这些特性，可以提高代码质量和开发效率。同时，不断关注和学习新的JavaScript特性和...
es6 for循环中let和var区别详解
10-15
标题和描述中提到的知识点是关于ES6标准中的JavaScript编程语言中for循环使用let和var声明变量的差异。我们知道，let和var都是JavaScript中用于声明变量的关键字，但是在ES6中，let引入了块级作用域的概念，而var则...
react_training_project:了解reactjs和es6
04-10
- `.babelrc`：Babel的配置文件，用于转换JSX和ES6语法为浏览器兼容的JavaScript。 - `package.json`：项目的元数据和依赖管理，包括npm脚本。 4. 开发工具和流程： - Babel：将JSX和ES6转换为浏览器支持的...
前端javaScript es6语法学习 demo
12-25
以上就是JavaScript ES6中的关键知识点，掌握这些特性将有助于提升前端开发的效率和代码质量。在实际项目中，结合使用这些特性，可以使代码更加简洁、高效。通过深入理解和实践，开发者能够更好地驾驭现代JavaScript...
es6 map遍历_前端开发必备 - ES6 新特性之 Iterator和 for...of循环
weixin_39879881的博客
11-23 273
往期回顾：前端开发必备 - ES6 新特性之 let 和 const 命令前端开发必备 - ES6 新特性之 变量的解构赋值前端开发必备 - ES6 新特性之 字符串的拓展前端开发必备 - ES6 新特性之 正则的拓展前端开发必备 - ES6 新特性之 数值的拓展前端开发必备 - ES6 新特性之 对象的拓展前端开发必备 - ES6 新特性之 Symbol前端开发必备 - ES6 新特性之 Set...
es6 for...of循环
歪脖先生的博客
01-29 446
for...of循环 for...of循环可以自动遍历 Generator函数时生成的Iterator对象，且此时不再需要调用next()方法。 function *foo() { yield 1; yield 2; yield 3; yield 4; yield 5; return 6;}for (let v of foo()) { console.log(v);}// 1
ES6 JavaScript 条件循环等控制语句
weixin_44983653的博客
07-22 544
ES6 JavaScript 控制语句1、if 条件分支语句1.1 语法1.2 示例2、switch...case 分支语句2.1 语法2.2 示例3、for 循环语句3.1 语法3.2 示例4、while 循环4.1 语法4.2 示例5、do...while 循环5.1 语法5.2 示例6、for...in 循环6.1 语法6.2 数组 --- 示例6.3 C风格 --- 示例6.3 对象 --- 示例7、for...of 循环7.1 语法7.2 示例8、break/continue 说明9、for 迭代
Vue 方法、计算属性、v-if、v-for、es6
多哥仁慈的骆驼
12-08 617
代码： <html> <head> <script type="text/javascript" src="../js/vue.js"></script> </head> <body> <!-- 计算属性 --> <div id="app"> <ul> <li v-...
es6之数组循环
08-09 5137
一、回顾es5数组循环 1.arr.forEach()循环 可以接受两个参数： arr.forEach(循环回调函数，this指向谁） arr.forEach(function(){ },arr) 使用箭头函数(不能改变this指向了） arr.forEach((val,index,arr)=>{ //回调函数中可以接受3个参数， 1.value值 2.索引 3.整个数组 }) 2...
中国石油大学(北京)克拉玛依校区在广东2021-2024各专业最低录取分数及位次表.pdf
09-08
全国各大学在广东省2021~2024年各专业最低录取分数及位次
浙江越秀外国语学院在广东2021-2024各专业最低录取分数及位次表.pdf
09-08
全国各大学在广东省2021~2024年各专业最低录取分数及位次
网站模板源代码（组件划分规范，二改省力）
最新发布
09-08
组件划分规范，二改省力！！！
华中科技大学 Java课程设计实验.zip
09-08
华中科技大学 Java课程设计实验.zip
Node.js与前端进阶：ES6，数据库操作与模块管理
"前端进阶学习笔记，涵盖Node.js、ES6、npm、webpack和babel等关键知识点，适合已经掌握HTML、CSS、JavaScript和jQuery基础的学习者。" 在前端开发中，进阶学习通常涉及更高级的技术和工具。本笔记主要探讨了以下几...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值