ES6笔记_.prototype.isprototypeof es6-CSDN博客

本文链接：https://blog.csdn.net/Vera_Gao/article/details/121088199

ES6更新的内容主要分为以下几点

表达式：声明、解构赋值
内置对象：字符串扩展、数值扩展、对象扩展、数组扩展、函数扩展、正则扩展、Symbol、Set、Map、Proxy、Reflect
语句与运算：Class、Module、Iterator
异步编程：Promise、Generator、Async

变量声明

const声明常量、 let声明变量
- 作用范围
  - var命令在全局代码中执行
  - const命令和let命令只能在代码块中执行
- 赋值使用
  - const命令声明常量后必须立马赋值
  - let命令声明变量后可立马赋值或使用时赋值

不存在变量提升：未定义就使用会报错，
存在暂时性死区：在代码块内使用const命令和let命令声明变量之前，该变量都不可用
不允许重复声明

解构赋值

字符串解构：const [a, b, c, d, e] = “hello”
数值解构：const { toString: s } =123
布尔解构：const { toString: b } = true
对象解构
形式：const { x, y } = { x: 1, y: 2 }
默认：const { x, y = 2 } = { x: 1 }
改名：const { x, y: z } = { x: 1, y: 2 }
数组解构
规则：数据结构具有Iterator接口可采用数组形式的解构赋值
形式：const [x, y] = [1, 2]
默认：const [x,y = 2] = [1]
函数参数解构
数组解构：function Func([x = 0, y = 1]) {}
对象解构：function Func({ x = 0, y =1 } = {}) {}

字符串扩展

字符串模板：可单行可多行可插入变量的增强版字符串标签模板：函数参数的特殊调用
Unicode表示法：大括号包含表示Unicode字符(\u{0xXX}或\u{0XXX})
字符串遍历：可通过for-of遍历字符串
String.raw()：返回把字符串所有变量替换且对斜杠进行转义的结果
String.fromCodePoint()：返回码点对应字符
codePointAt()：返回字符对应码点(String.fromCodePoint()的逆操作)
normalize()：把字符的不同表示方法统一为同样形式，返回新字符串(Unicode正规化)
repeat()：把字符串重复n次，返回新字符串
matchAll()：返回正则表达式在字符串的所有匹配
includes()：是否存在指定字符串
startsWith()：是否存在字符串头部指定字符串
endsWith()：是否存在字符串尾部指定字符串

对象扩展

简洁表示法：直接写入变量和函数作为对象的属性和方法({ prop, method() {} })
属性名表达式：字面量定义对象时使用[]定义键([prop]，不能与上同时使用)
方法的name属性：返回方法函数名
取值函数(getter)和存值函数(setter)：get/set 函数名(属性的描述对象在get和set上)
bind返回的函数：bound 函数名
Function构造函数返回的函数实例：anonymous
属性的可枚举性和遍历：描述对象的enumerable
super关键字：指向当前对象的原型对象(只能用在对象的简写方法中method() {})
Object.is()：对比两值是否相等
Object.assign()：合并对象(浅拷贝)，返回原对象
Object.getPrototypeOf()：返回对象的原型对象
Object.setPrototypeOf()：设置对象的原型对象
proto：返回或设置对象的原型对象

遍历

for-in：遍历对象自身可继承可枚举属性(hasOwnProperty()确定某属性是否是对象本身的属性)
Object.keys()：返回对象自身可枚举属性键组成的数组
Object.getOwnPropertyNames()：返回对象自身非Symbol属性键组成的数组
Object.getOwnPropertySymbols()：返回对象自身Symbol属性键组成的数组
Reflect.ownKeys()：返回对象自身全部属性键组成的数组

数组扩展

扩展运算符(…)：转换数组为用逗号分隔的参数序列([…arr]，相当于rest/spread参数的逆运算)
Array.from()：转换具有Iterator接口的数据结构为真正数组，返回新数组
类数组对象：包含length的对象、Arguments对象、NodeList对象
可遍历对象：String、Set结构、Map结构、Generator函数
Array.of()：转换一组值为真正数组，返回新数组
copyWithin()：把指定位置的成员复制到其他位置，返回原数组
find()：返回第一个符合条件的成员
findIndex()：返回第一个符合条件的成员索引值
fill()：根据指定值填充整个数组，返回原数组
keys()：返回以索引值为遍历器的对象
values()：返回以属性值为遍历器的对象
entries()：返回以索引值和属性值为遍历器的对象
数组空位：ES6明确将数组空位转为undefined(空位处理规不一，建议避免出现)

函数扩展

参数默认值：为函数参数指定默认值
rest参数(…)：
代替了arguments，是一个数组对象
arguments对象不是数组，而是一个类似数组的对象。所以为了使用数组的方法，必须使用Array.from先将其转为数组
严格模式：在严格条件下运行JS
应用：只要函数参数使用默认值、解构赋值、扩展运算符，那么函数内部就不能显式设定为严格模式
name属性：返回函数的函数名
箭头函数(=>)：函数简写
this指向固定化
并非因为内部有绑定this的机制，而是根本没有自己的this，导致内部的this就是外层代码块的this
因为没有this，因此不能用作构造函数

箭头函数误区

函数体内的this是定义时所在的对象而不是使用时所在的对象
可让this指向固定化，这种特性很有利于封装回调函数
不可当作构造函数，因此箭头函数不可使用new命令
不可使用yield命令，因此箭头函数不能用作Generator函数
不可使用Arguments对象，此对象在函数体内不存在(可用rest/spread参数代替)
返回对象时必须在对象外面加上括号

Symbol

定义：独一无二的值
声明：const set = Symbol(str)
入参：字符串(可选)

Set

定义：类似于数组的数据结构，成员值都是唯一且没有重复的值
声明：const set = new Set(arr)
入参：具有Iterator接口的数据结构
属性
constructor：构造函数，返回Set
size：返回实例成员总数
方法

add()：添加值，返回实例
delete()：删除值，返回布尔
has()：检查值，返回布尔
clear()：清除所有成员
keys()：返回以属性值为遍历器的对象
values()：返回以属性值为遍历器的对象
entries()：返回以属性值和属性值为遍历器的对象
forEach()：使用回调函数遍历每个成员

Map

定义：类似于对象的数据结构，成员键是任何类型的值
声明：const set = new Map(arr)
入参：具有Iterator接口且每个成员都是一个双元素数组的数据结构
属性
constructor：构造函数，返回Map
size：返回实例成员总数
方法
get()：返回键值对
set()：添加键值对，返回实例
delete()：删除键值对，返回布尔
has()：检查键值对，返回布尔
clear()：清除所有成员
keys()：返回以键为遍历器的对象
values()：返回以值为遍历器的对象
entries()：返回以键和值为遍历器的对象
forEach()：使用回调函数遍历每个成员

Proxy

定义：修改某些操作的默认行为
声明：const proxy = new Proxy(target, handler)
入参
target：拦截的目标对象
handler：定制拦截行为
方法
Proxy.revocable()：返回可取消的Proxy实例(返回{ proxy, revoke }，通过revoke()取消代理)
拦截方式
get()：拦截对象属性读取
set()：拦截对象属性设置，返回布尔
has()：拦截对象属性检查k in obj，返回布尔
deleteProperty()：拦截对象属性删除delete obj[k]，返回布尔
defineProperty()：拦截对象属性定义Object.defineProperty()、Object.defineProperties()，返回布尔
ownKeys()：拦截对象属性遍历for-in、Object.keys()、Object.getOwnPropertyNames()、Object.getOwnPropertySymbols()，返回数组
getOwnPropertyDescriptor()：拦截对象属性描述读取Object.getOwnPropertyDescriptor()，返回对象
getPrototypeOf()：拦截对象原型读取instanceof、Object.getPrototypeOf()、Object.prototype.proto、Object.prototype.isPrototypeOf()、Reflect.getPrototypeOf()，返回对象
setPrototypeOf()：拦截对象原型设置Object.setPrototypeOf()，返回布尔
isExtensible()：拦截对象是否可扩展读取Object.isExtensible()，返回布尔
preventExtensions()：拦截对象不可扩展设置Object.preventExtensions()，返回布尔
apply()：拦截Proxy实例作为函数调用proxy()、proxy.apply()、proxy.call()
construct()：拦截Proxy实例作为构造函数调用new proxy()

Class

定义：对一类具有共同特征的事物的抽象(构造函数语法糖)
原理：类本身指向构造函数，所有方法定义在prototype上，可看作构造函数的另一种写法(Class === Class.prototype.constructor)
方法和关键字
constructor()：构造函数，new命令生成实例时自动调用
extends：继承父类
super：新建父类的this
static：定义静态属性方法
get：取值函数，拦截属性的取值行为
set：存值函数，拦截属性的存值行为
属性
proto：构造函数的继承(总是指向父类)
proto.proto：子类的原型的原型，即父类的原型(总是指向父类的__proto__)
prototype.proto：属性方法的继承(总是指向父类的prototype)
静态属性：定义类完成后赋值属性，该属性不会被实例继承，只能通过类来调用
静态方法：使用static定义方法，该方法不会被实例继承，只能通过类来调用(方法中的this指向类，而不是实例)
继承
实质
ES5实质：先创造子类实例的this，再将父类的属性方法添加到this上(Parent.apply(this))
ES6实质：先将父类实例的属性方法加到this上(调用super())，再用子类构造函数修改this

super
作为函数调用：只能在构造函数中调用super()，内部this指向继承的当前子类(super()调用后才可在构造函数中使用this)
作为对象调用：在普通方法中指向父类的原型对象，在静态方法中指向父类

显示定义：使用constructor() { super(); }定义继承父类，没有书写则显示定义

子类继承父类：子类使用父类的属性方法时，必须在构造函数中调用super()，否则得不到父类的this
父类静态属性方法可被子类继承
子类继承父类后，可从super上调用父类静态属性方法

作者：JowayYoung
链接：https://juejin.cn/post/6844903959283367950
来源：稀土掘金
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

显示定义：使用constructor() { super(); }定义继承父类，没有书写则显示定义
子类继承父类：子类使用父类的属性方法时，必须在构造函数中调用super()，否则得不到父类的this

父类静态属性方法可被子类继承
子类继承父类后，可从super上调用父类静态属性方法

Module

export：规定模块对外接口
默认导出：export default Person(导入时可指定模块任意名称，无需知晓内部真实名称)
单独导出：export const name = “Bruce”
按需导出：export { age, name, sex }(推荐)
改名导出：export { name as newName }
import：导入模块内部功能
默认导入：import Person from “person”
整体导入：import * as Person from “person”
按需导入：import { age, name, sex } from “person”
改名导入：import { name as newName } from “person”
自执导入：import “person”
复合导入：import Person, { name } from “person”
复合模式：export命令和import命令结合在一起写成一行，变量实质没有被导入当前模块，相当于对外转发接口，导致当前模块无法直接使用其导入变量
默认导入导出：export { default } from “person”
整体导入导出：export * from “person”
按需导入导出：export { age, name, sex } from “person”
改名导入导出：export { name as newName } from “person”
具名改默认导入导出：export { name as default } from “person”
默认改具名导入导出：export { default as name } from “person”