ES6学习笔记、async、promise、ES6箭头函数、ES6扩展运算符、原始数据类型Symbol、模板字符串

noahsark747

已于 2022-05-30 14:03:36 修改

阅读量390

点赞数 2

文章标签： javascript 学习前端 es6 typescript

于 2022-05-29 17:29:41 首次发布

本文链接：https://blog.csdn.net/No1banana/article/details/125033649

版权

本文是关于ES6的学习笔记，重点介绍了let和const的使用，模板字符串的便利性，更强大的函数特性如默认参数、剩余参数和箭头函数，特别是箭头函数的this指向。此外，还讲解了解构赋值、扩展运算符、原始数据类型Symbol、Map和Set，以及Promise和async异步操作的基础知识。

摘要由CSDN通过智能技术生成

ES6学习笔记

ES6: ECMAScript 6.0,泛指2015年6月后发布的JavaScript标准，目前已经到es12

一、let

let用于解决es5中var声明变量时变量提升的问题

1、使用let声明的变量没有变量提升

2、let声明的变量是一个块作用域

3、使用var声明的变量同名会被覆盖，而使用let声明的变量名不可重复，具有不可重复性。

二、const

1、const特性和let类似，但是const仅用于声明常量。常量一旦被声明则无法被修改，不可被被再次赋值。

2、const可以声明对象，如果使用const声明对象，常量对象内部的属性是可以被修改。但是const声明的对象名也不能被修改。

// 案例一、定义一个数组循环10次，每一次循环的时候往数组中添加一个函数。
const arr =[]
			for(let i = 0; i<10; i++){
   
				arr[i] = function(){
   
					return i
				}
			}
			console.log(arr[5]())
			// 输出的结果为5
var arr =[]
			for(var i = 0; i<10; i++){
   
				arr[i] = function(){
   
					return i
				}
			}
			console.log(arr[5]())
			// 输出的结果为10

3、不会污染全局变量

建议：在开发中，默认情况下用const，只有在我明确变量值需要被修改的时候才使用let

ES6模板字符串

利用``反引号来对会html进行包裹对页面结构进行追加。利用**${变量}**对内容进行插入，提高便利

	<body>
		<div class="box"> </div>
		<script>
			const box = document.querySelector(".box")
			let id = 1,name = 'hello赵欣'
			let htmlStr = `
				<ul>
				<li>
				<p id=${
       id}>${
       name}</p>
				</li>
				</ul>
				`
				box.innerHTML = htmlStr
		</script>
	</body>

更强大的函数

一、带参数默认值的函数

function add(a = 10, b = 20){
   
				return a + b
			}
			console.log(add(30))
			// 输出结果50

二、默认的表达式也可以是一个函数

<script>
			function add(a, b = getVal(5)){
   
				return a + b
			}
			function getVal(val){

最低0.47元/天解锁文章

noahsark747

关注

2
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
ES6学习笔记、async、promise、ES6箭头函数、ES6扩展运算符、原始数据类型Symbol、模板字符串

ES6: ECMAScript 6.0,泛指2015年6月后发布的JavaScript标准，目前已经到es12
复制链接

扫一扫