ES7-ES12常用知识点

118 阅读3分钟

ES7

  • Object.keys(obj) ->获取对象所有key
  • Object.values(obj) ->获取对象所有的value
  • Object.entries(obj) ->获取一个数组 数组中会放可以枚举的元素
const obj = {
  name:'xsh',
  age:'12'
}

Es7
// 获取对象所有key
Object.keys(obj)
//获取所有对象的value
Object.values(obj)

// 可以传入数组 和字符串(他会把字符串拆分成一个一个   新数组)
Object.values(['11','22'])
Object.values('abc')


Object.entries
//获取一个数组 数组中会放可以枚举的元素
// 数组里面放数组 
const objEntries= Object.entries(obj)
// [['name','why']['age',18]]
objEntries.forEach(item=>{
  ietm[0] //name
  item[1] //why
})

Es8

  • padStart
  • padEnd
  • Object.getOwnPropertyDescriptor() ->获取对象所有的属性描述符
String Padding

const message='Hello World'
// padStart (字符串变成多长 二填充内容)
const newMessage=message.padStart(15).padEnd(20,'--')
// 用处:身份证隐藏位数
const cardNumber='317283791827461238'
const lastFourCard=cardNumber.slice(-4)
const finalCard=lastFourCard.padStart(cardNumber.length,'*')

// 获取对象所有的属性描述符
Object.getOwnPropertyDescriptor()


ES9 **- 迭代器

  • 展开运算符
  • Promise

ES10 - flat() 会按照可指定的深度递归遍历数组 并且所有元素与可遍历到的字数组中元素合并成一个新数组并且返回 数组降维 **- flatMap() 对每个元素进行映射 在对结果进行压缩降维 **** - Object.fromEntries(entries1) 将entries转换成对象 **

// flat() 会按照可制定的深度递归遍历数组,并且将所有元素与遍历到的字数组中元素合并成一个新数组并且返回   数组降维
const nums=[12,22,44,11,[22],[[223,[123]]]]
const newNums=nums.flat(2) // 默认为1

// flatMap 首先对每个元素进行映射 在对结果进行压缩降维
const nums2=[22,33,44]
const newNums2= nums2.flatMap(item=>ietm*2,绑定新的this)
// 场景
const messag1=['你好 啊','我很 好']
// 他自行会对数组进行降维的
const words=messag1.flatMap(item=>item.split(" "))

// Object.fromEntries 将entries转换成对象
const entries1= Object.entries(obj)
Object.fromEntries(entries1)
const queryString='name=xsh&age=18&herght=1.88'
// 专门解析url路径后的参数 它是一个entries
const queryParams=new URLSearchParams(queryString)
const paramObj=Object.fromEntries(queryParams)

trimStart()
trimEnd()

ES11 **- bigInt 最大数字 **- Nulish-Coalescing-operator 空值合并操作 运算符 **- globalThis 各个环境的全局对象 ****- 对 for in 操作的标准化 **

// ES11 BigInt
// es11之前使用max_safe_integer 最大的安全数字 
const maxInt=Number.MAX_Safe_INTEGER
// es11之后最大数字   加上个n
const BigInt=123128378723912387n
// 10+'abc' 这是进行了隐式转换了把10变成字符串'10' +‘abc’

// Nullish-Coalescing-operator 空值合并操作 运算符
// || 逻辑或  foo||'abc' 如果前面没有值 则返回后面的值 0和'' 都会返回后面的值
// ?? 空值合并 foo??'abc' 只有前面是undefind 或者null
// optional Chaining 可选链 ?.

// 在node 里面全局变量时global Object  
// 在浏览器里面 window  在node执行会报错
// 在es11 里面有个globalThis  在各种环境下都有全局对象

// 对for in 操作的标准化 大部分浏览器 都是对象的key 有些是value
// 现在所有浏览器都是对象的key

ES12 **- finalizationRegistry ->当对象 销毁的时候触发类 **- fianlRegistry.register ->注册到fianlRegistry - weakref ->创建对象赋值 但是是一个弱引用 需要通过deref()来获取对象的 -logucal->assign->operator 逻辑赋值运算

// finalizationRegistry 当对象 销毁的时候触发类
const fianlRegistry= new FinalizationRegustry((val)=>{
  console.log('有对象被销毁了',val+"这个就是注册时候绑定的值")
})

let obj111 ={name1:'xsh'}
// 把这个对象注册到fianlRegistry
fianlRegistry.register(obj111,'绑定的值')
obj111 =null

// weakref 创建对象赋值 但是是一个弱引用 需要通过deref()来获取对象的

let info = new WeakRef(obj111)
console.log(info.deref().name)

// logucal-assign-operator 逻辑赋值运算
// ||= 逻辑或赋值运算
let message='abc'
message = message||'abc'
message ||='abc'
// &&= 逻辑与赋值运算
const obj ={
  name:'abc',
  foo:()=>{

  }
}
obj.foo&&obj.foo()
// ??= 逻辑空赋值运算