ES6的新特性,前端必看知识点

最新推荐文章于 2026-05-12 08:05:59 发布

原创最新推荐文章于 2026-05-12 08:05:59 发布 · 285 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#es6

前端专栏收录该内容

12 篇文章

订阅专栏

本文详细介绍了ES6新增的各种特性，包括let与const声明的区别、解构赋值、模板字符串、箭头函数、Symbol、迭代器与生成器、Promise、Set与Map、class的使用方法及数值与对象的扩展等内容。

ES6新特性

let声明与新特性
	1. 不能被重复定义
	2.块级作用域
	3. 不存在变量提升
	4. 不影响作用域链
const声明与新特性
	1. 定义一定要赋初值
	2. const是常量，一般用大写字母， 也不可被重复定义
	3.常量值不可被修改
	4. 块级作用域
	5. 对于数组或者对象，可以修改其元素，不算是对常量值的改变
解构赋值
	1. 数组的解构
	2. 对象的解构
模板字符串
	1.  声明字符串
	2. 模板字符串内可以出现换行
	3. 变量的拼接  通过 ${}在模板字符串内进行拼接
对象的简化写法
箭头函数
	1.  this是静态的  this始终指向函数声明时所在的作用域下的this
	2. 不能用作构造实例化对象
	3. 不能使用arguments变量
	4. 可以省略小括号或者函数体
箭头函数中的this
	1. 箭头函数中的this指向的是外层函数的作用域
	2. 箭头函数适合于 与 this 无关的回调， 例如定时器，数组方法的回调
	3.箭头函数不适合于与this有关的回调，事件回调，对象方法的回调
rest参数  （...args）
	1. 必须放在所有参数的后面
	2. 传进来的数据为数组
Symbol 基本使用
	1. 表示独一无二的值
	2. 第七种数据类型，类似于字符串
	3. 特点
		1. 值唯一性， 用来解决命名冲突问题
		2. Symbol的值不能与其他数据进行运算
		3. Symbol 定义的对象属性不能使用for in 遍历循环， 但是可以使用Reflect.ownKeys来获取对象的所有键名
	4.创建 
		let s = Symbol()
		创建 带描述的   let s1  = Symbol('琦琦')   let s2  = Symbol('琦琦')， 此时s1与s2不相等
		创建 带描述的   let s1  = Symbol.for('琦琦')   let s2  = Symbol.for('琦琦')， 此时s1与s2相等
迭代器
	1.迭代器是一种接口，为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署Iterator接口，就可以完成遍历
	2.ES6的遍历命令
		for  ...   of  遍历值
		for  ...  in   遍历键
	3.原生具备iterator接口的数据（可使用 for   of）
		a)  ARRay
		b)  Arguments
		c)  Set
		d)  Map
		e)  String
		f)  TypedArray
		g)  NodeList
	4.  工作原理
		a) 创建一个指针对象，指向当前数据结构的起始位置
		b) 第一次调用对象的next方法， 指针自动指向数据结构的第一个成员
		c)  接下来不停的调用next方法，指针一直后移，直到指向最后一个成员
		d)  每次调用next方法返回一个包含value和done属性的对象  
			value为值，done为是否继续向下运行
	5.迭代对象的建立
		a)  创建 [Symbol.iterator](){}
		b)  return 一个对象{}其中包含next方法
		c) next方法中写返回的逻辑，return一个有value与done的对象
生成器
	1. 生成器函数是ES6提供的一种异步编程解决方案，语法行为与传统函数完全不同  ： function * add(){}
	2. 使用方法，创建对象,调用next
		let iterator = add()        iterator.next()
	3. 生成器传值
		假如  function * add(n)传入的值使用，需要在使用next()后输出对应yeild以前的输出
		yield接收值，是next（7）传入的值，第二个next传入的值，第一个yield接收
Promise
	1. 介绍
		Promise是ES6引入的异步编程的新解决方案。语法上Promise是一个构造函数，用来封装异步操作并可以获取其成功或者失败的结果
	2. 格式
		通调用resolve与reject判断状态
			resolve为成功，可以调用p.then()的第一个函数
			reject为失败， 可以调用P.then()的第二个函数
	3.可以链式调用
		then方法的返回可以是一个新的Promise对象，此对象可以继续被then或者catch
Set
	1. set的基础操作
		1. 元素的个属 set.size
		2. 添加元素   set.add('新元素')
		3. 删除元素   set.delete('存在的元素')
		4. 检测元素是否存在  set.has('元素')
		5. 清除所有的元素  set.clear()
	2.数组的便利操作
		1. 数组去重
		2.交集
		3.并集
		4.差集
Map
	1. Map的基本操作
		1. 添加元素  map.set('键'，也可以是对象，‘值，可以是方法字符串数值’)
		2. 获取元素 map.get('键‘)
		3. 删除元素 map.delete('键名')
		4. 清空元素 map.clear()
class
	构造方法的格式constructor(形参){...}
	构造方法的继承
		设置子级构造函数的原型  子类.prototype = new 父类
	类的继承
		在继承方法里使用super
	get  与 set
		get  当使用某个属性的时候，get方法会执行，并且返回一个数值
		set属性在为某个属性赋值的时候，会调用对应的set，set修饰的方法必须有一个形参，用来接收修改的值
数值的扩展
	1. Number.EPSILON
		Number.EPSILON是接近于 2.220446049250313e-16的一个数，常用于精度的判断
	2. Number.isFinite(100)
		检测一个数是否为有限数
	3.  Number.isNaN(555)
		检测一个数是否为nan
	4.  Number.parseInt('7777777贾真琦')
		字符转整形
	5. Number.isInteger(5.5)
		判读一个数是否为整形
	6.  Math.sign(55)
		判断一个数是否为正数（返回1） 负数（返回-1） 还是 0 （返回0）
对象的扩展
	1. Object.is(a,b)
		a与b是否相等，  主要可用于判断NaN与NaN是否相同
	2. Object.assign(dx1,dx2)
		合并两个对象，后面的覆盖前面的对象
	3. Object.setPrototypeOf(dx, sz)
		设置 dx的原型为 sz
	4.Object.getPrototypeOf(sz)
		获取sz的原型
模块化
	优势
		1. 防止命名冲突
		2. 代码复用
		3. 高维护度
	模块的使用
		export  （暴露）
			逐个暴露，每个需要暴露的属性前面加export
			统一暴露， export {属性名，方法名}
			默认暴露， export default{bianliang:'值',fangfa:function(){}}
		import （导入）
			通用导入， import * as 别名 from '路径'
			解构赋值的形式， import  {暴露的变量} from '路径'。这种形式的变量名字和暴露的文件里一样，并且数量一致，变量直接引用就可以
			简单形式（只适用于默认暴露） import 别名 from '路径'

在这里插入图片描述