ES6的一些冷门实用操作

这篇具有很好参考价值的文章主要介绍了ES6的一些冷门实用操作。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

ES6(ECMAScript 2015)引入了许多新的功能和语法,其中一些功能可能相对较冷门,但非常实用。本文将介绍一些这样的高级技巧,包括

  • Object.entries()

  • Object.fromEntries()

  • Array.of

  • Array.from

  • .at和flat

  • WeakMap和WeakSet

  • BigInt

1、Object.entries()和Object.fromEntries()

  • Object.entries()方法返回一个给定对象自身可枚举属性的键值对数组。

  • Object.fromEntries()方法将键值对列表转换为一个对象。

当使用Object.entries()时,可以传入一个对象作为参数。这个对象可以是任何具有可枚举属性的对象。例如:

const obj = { a: 1, b: 2, c: 3 };

const entries = Object.entries(obj);
console.log(entries); // [["a", 1], ["b", 2], ["c", 3]]

在这个例子中,我们将一个包含三个属性的对象传递给Object.entries()方法,并将返回的结果存储在entries变量中。entries变量现在是一个包含键值对数组的数组。

同样地,当使用Object.fromEntries()时,可以传入一个键值对数组作为参数。这个数组中的每个元素都是一个包含键和值的数组。例如:

const entries = [["a", 1], ["b", 2], ["c", 3]];

const obj = Object.fromEntries(entries);
console.log(obj); // { a: 1, b: 2, c: 3 }

在这个例子中,我们将一个包含三个键值对的数组传递给Object.fromEntries()方法,并将返回的结果存储在obj变量中。obj变量现在是一个由键值对组成的对象。

2、Array.of、Array.from

  • Array.of()方法创建一个具有可变数量参数的新数组实例。

  • Array.of方法用于创建一个由参数组成的新数组。它与Array构造函数不同之处在于,当参数只有一个且为数字时,Array.of会创建一个只包含该数字的数组,而不是创建指定长度的空数组。

  • Array.from()方法从类似数组或可迭代对象创建一个新的数组实例。

  • Array.from方法将类似数组或可迭代对象转换为真正的数组。它可以接收第二个参数来进行映射或筛选操作。

const arr1 = Array.of(1, 2, 3);
console.log(arr1); // [1, 2, 3]

const str = 'Hello';
const arr = Array.from(str);
console.log(arr); // 输出: ['H', 'e', 'l', 'l', 'o']

const nums = [1, 2, 3, 4, 5];
const doubled = Array.from(nums, num => num * 2);
console.log(doubled); // 输出: [2, 4, 6, 8, 10]

3、.at和flat

  • .at()方法返回指定索引处的元素。

  • .at方法用于获取数组指定索引位置的元素,支持负数索引。

  • flat()方法将嵌套的数组扁平化为一个新的数组。

  • flat方法用于将多维数组扁平化为一维数组,可以指定扁平化的层数。

 const arr3 = [1, 2, 3, 4, 5];
 console.log(arr3.at(2)); // 3

 const arr4 = [1, [2, [3]]];
 console.log(arr4.flat()); // [1, 2, [3]]

4、WeakMap和WeakSet

  • WeakMap是一种集合类型,其中键必须是对象,并且在没有其他引用时会被垃圾回收。

  • WeakSet是一种集合类型,其中元素必须是对象,并且在没有其他引用时会被垃圾回收。

const wm = new WeakMap();

const obj = {};

wm.set(obj, 'value');

console.log(wm.get(obj)); // value

const ws = new WeakSet();

ws.add(obj);

console.log(ws.has(obj)); // true

在这个例子中,我们创建了一个WeakMap和一个WeakSet实例。我们使用set()方法将obj对象添加到WeakMap中,并将值设置为'value'。然后,我们使用get()方法从WeakMap中获取值。类似地,我们使用add()方法将obj对象添加到WeakSet中,并使用has()方法检查集合中是否存在该对象。

5、BigInt

  • BigInt是一种新的原始数据类型,用于表示任意精度的整数。文章来源地址https://www.toymoban.com/news/detail-805433.html

const bigIntValue = BigInt(Number.MAX_SAFE_INTEGER) + BigInt(1);

 console.log(bigIntValue); // 9007199254740992n

到了这里,关于ES6的一些冷门实用操作的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包赞助服务器费用

相关文章

  • 【JavaScript】数组方法 (ES6)

    arr.find(callback) 用于获取第 1 个符合要求的元素: callback : (item, index, arr) = boolean item -当前值、 index -当前索引、 arr -当前数组 返回值: callback 第一次返回 true 的对应 item ;如果没有符合的元素,则返回 undefined arr.findIndex(callback) 用于获取第 1 个符合要求的元素的下标: cal

    2024年02月14日
    浏览(11)
  • JavaScript Es6_3笔记

    了解构造函数原型对象的语法特征,掌握 JavaScript 中面向对象编程的实现方式,基于面向对象编程思想实现 DOM 操作的封装。 了解面向对象编程的一般特征 掌握基于构造函数原型对象的逻辑封装 掌握基于原型对象实现的继承 理解什么原型链及其作用 能够处理程序异常提升程

    2024年02月11日
    浏览(12)
  • 【ES6】JavaScript中的Symbol

    【ES6】JavaScript中的Symbol

    Symbol是JavaScript中的一种特殊的、不可变的、不可枚举的数据类型。它通常用于表示一个唯一的标识符,可以作为对象的属性键,确保对象的属性键的唯一性和不可变性。 Symbol.for()是Symbol的一个方法,它用于创建一个已经注册的Symbol对象。当使用Symbol.for()创建Symbol对象时,会

    2024年02月10日
    浏览(12)
  • JavaScript 之 ES6 新特性

    在ES6中,模块化成为了JavaScript的标准特性。ES6模块化提供了一种更加优雅和可维护的方式来组织和管理JavaScript代码,可以有效地避免全局变量的污染和命名冲突的问题。以下是ES6模块化的一些主要特性: 导出(export): 可以通过 export 将一个变量、函数或类导出为一

    2024年02月07日
    浏览(8)
  • JavaScript版本ES5/ES6及后续版本

    JavaScript版本ES5/ES6及后续版本

    Brendan Eich在短短10天内创建了JavaScript的第一个版本。它被称为摩卡,但已经具备了现代JavaScript的许多基本特性! 为了吸引Java开发人员,Mocha先是更改为LiveScript,然后又更改为JavaScript然而,JavaScript与Java几乎没有任何关系; 微软推出了IE,从网景复制JavaScript,并称之为JScript; 由

    2024年02月13日
    浏览(8)
  • JavaScript之ES6高级语法(一)

    JavaScript之ES6高级语法(一)

    本文是我在学习过程中记录学习的点点滴滴,目的是为了学完之后巩固一下顺便也和大家分享一下,日后忘记了也可以方便快速的复习。 今天学习的主要是关于ES6新语法知识的理解和应用 栈负责存放简单数据类型,堆负责存放复杂数据类型,但是复杂数据类型会把内容存在

    2024年02月09日
    浏览(12)
  • 【Javascript】ES6新增之类的认识

    在现代编程语言中,类是面向对象编程范式中的核心概念之一。 与函数类似,类本质上是一种特殊的函数,它允许我们将数据和操作封装在一起,以创建具有共同行为和状态的对象。 在类的世界里,我们有类表达式和类声明,它们各自具有自己的特性和用途。 ✨ 类本质上是

    2024年02月13日
    浏览(12)
  • JavaScript:ES6中类与继承

    在JavaScript编程中,ES6引入了一种更现代、更清晰的方式来定义对象和实现继承,那就是通过类和继承机制。本文将以通俗易懂的方式解释ES6中类与继承的概念,帮助你更好地理解和应用这些特性。 1. 类的创建与使用 类是一种模板,用于创建对象。在ES6中,我们可以使用 cl

    2024年02月13日
    浏览(13)
  • 前端-ES6

    let 和 const 为了解决var的作用域的问题,而且var 有变量提升,会出现全局污染的问题 let 块状作用域,并且不能重复声明 const 一般用于声明常量,一旦被声明无法修改,但是const 可以声明一个对象,对象内部的属性是可以修改的 建议: 在默认的情况下用const, 而只有你知道

    2024年02月12日
    浏览(9)
  • 【ES6】 JavaScript 中的Object.assign

    Object.assign() 是 JavaScript 中的一个方法,它用于复制源对象的所有可枚举属性到目标对象。该方法会返回目标对象。 这是其基本用法: 在这个例子中,source 对象的所有可枚举属性都被复制到了 target 对象。 需要注意的是,Object.assign() 是浅复制(shallow copy),意味着如果源对

    2024年02月10日
    浏览(10)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包