ES7-ES13新特性

ES7 - Array Includes

◼ 在ES7之前,如果我们想判断一个数组中是否包含某个元素,需要通过 indexOf获取结果,并且判断是否为 -1。
◼ 在ES7中,我们可以通过includes来判断一个数组中是否包含一个指定的元素,根据情况,如果包含则返回 true,否则返回false。

ES7 –指数exponentiation运算符

◼ 在ES7之前,计算数字的乘方需要通过 Math.pow方法来完成。
◼ 在ES7中,增加了 ** 运算符,可以对数字来计算乘方

ES8 Object values

◼ 之前我们可以通过 Object.keys 获取一个对象所有的key
◼ 在ES8中提供了 Object.values 来获取所有的value值:

ES8 Object entries(对象转化为entries类型)

◼ 通过 Object.entries 可以获取到一个数组,数组中会存放可枚举属性的键值对数组。
可以针对对象、数组、字符串进行操作;
案例:

ES8 - String Padding --字符串的填充

◼ 某些字符串我们需要对其进行前后的填充,来实现某种格式化效果,ES8中增加了 padStart和 padEnd方法,分别是对字符串的首尾进行填充的。
案例:


ES8 - Trailing Commas

◼ 在ES8中,我们允许在函数定义和调用时多加一个逗号:
function foo(a,b){
console.log(a,b)
}
foo(10,20,)

ES8 - Object Descriptors

◼ Object.getOwnPropertyDescriptors :获取属性描述符
这个在之前已经讲过了,这里不再重复。
◼ Async Function:async、await 异步操作
后续讲完Promise讲解

ES9新增知识点

◼ Async iterators:后续迭代器讲解
◼ Object spread operators:(对象的展开运算)前面讲过了
◼ Promise finally:后续讲Promise讲解

ES10 - flat flatMap(遍历数组返回新数组)

◼ flat() 方法会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。
◼ flatMap() 方法首先使用映射函数映射每个元素,然后将结果压缩成一个新数组。
注意一:flatMap是先进行map操作,再做flat的操作;
注意二:flatMap中的flat相当于深度为1;

// 案例

ES10 - Object fromEntries(entries转化成obj类型)

◼ 在前面,我们可以通过 Object.entries 将一个对象转换成 entries
◼ 那么如果我们有一个entries了,如何将其转换成对象呢?
ES10提供了 Object.formEntries来完成转换:
◼ 那么这个方法有什么应用场景呢?
案例:

ES10 - trimStart trimEnd(去除空白符)

◼ 去除一个字符串首尾的空格,我们可以通过trim方法,如果单独去除前面或者后面呢?
ES10中给我们提供了trimStart和trimEnd;
const message = " Hello World "

ES10 其他知识点

◼ Symbol description:已经讲过了
◼ Optional catch binding:后面讲解try cach讲解 捕获异常

ES11 - BigInt

◼ 在早期的JavaScript中,我们不能正确的表示过大的数字:
大于MAX_SAFE_INTEGER的数值,表示的可能是不正确的。
◼ 那么ES11中,引入了新的数据类型BigInt,用于表示大的整数:
BigInt的表示方法是在数值的后面加上n
案例:

ES11 - Nullish Coalescing Operator 空值合并运算符

◼ ES11,Nullish Coalescing Operator增加了空值合并操作符:

ES11 - Optional Chaining(可选链)

◼ 可选链也是ES11中新增一个特性,主要作用是让我们的代码在进行null和undefined判断时更加清晰和简洁:

ES11 - Global This(已学)

◼ 在之前我们希望获取JavaScript环境的全局对象,不同的环境获取的方式是不一样的
比如在浏览器中可以通过this、window来获取;
比如在Node中我们需要通过global来获取;
◼ 在ES11中对获取全局对象进行了统一的规范:globalThis

ES11 - for..in标准化

◼ 在ES11之前,虽然很多浏览器支持for...in来遍历对象类型,但是并没有被ECMA标准化。
◼ 在ES11中,对其进行了标准化,for...in是用于遍历对象的key的:

ES11 其他知识点

◼ Dynamic Import:后续ES Module模块化中讲解。
◼ Promise.allSettled:后续讲Promise的时候讲解。
◼ import meta:后续ES Module模块化中讲解。

ES12 - FinalizationRegistry 垃圾回收回调

◼ FinalizationRegistry 对象可以让你在对象被垃圾回收时请求一个回调。
FinalizationRegistry 提供了这样的一种方法:当一个在注册表中注册的对象被回收时,请求在某个时间点上调用一个清理回调。(清理回调有时被称为 finalizer );
你可以通过调用register方法,注册任何你想要清理回调的对象,传入该对象和所含的值;

ES12 - WeakRefs(转成弱引用)

◼ 如果我们默认将一个对象赋值给另外一个引用,那么这个引用是一个强引用:
如果我们希望是一个弱引用的话,可以使用WeakRef

ES12 - logical assignment operators(逻辑赋值运算符)

ES12其他知识点

◼ Numeric Separator(数字分割符):讲过了;
◼ String.replaceAll(字符串替换):字符串替换;

ES13 - method .at()

◼ 前面我们有学过字符串、数组的at方法,它们是作为ES13中的新特性加入的:
const names = ["abc","bbc","ccc"]
console.log(names.at(1))// abc
console.log(names.at(-1))// ccc
const message = "Hello Coder"
console.log(message.at(1)) // Hello
console.log(message.at(-1))// Coder

ES13 - Object.hasOwn(obj, propKey)

◼ Object中新增了一个静态方法(类方法):hasOwn(obj, propKey)
该方法用于判断一个对象中是否有某个自己的属性;
◼ 那么和之前学习的Object.prototype.hasOwnProperty有什么区别呢?
Object.prototype.hasOwnProperty是放在原型上的是实例方法,
区别一:防止对象内部有重写hasOwnProperty
区别二:对于隐式原型指向null的对象,hasOwnProperty无法进行判断

ES13 - New members of classes

◼ 在ES13中,新增了定义class类中成员字段(field)的其他方式:
Instance public fields 公共属性
Static public fields 私有属性
Instance private fields 静态公共属性
static private fields 静态私有属性
static block 静态代码块

posted @ 2024-10-20 01:45  韩德才  阅读(87)  评论(0)    收藏  举报