较大数据量数组,操作执行方法【玩转JavaScript】

举报
叶一一 发表于 2023/08/22 16:35:51 2023/08/22
【摘要】 前言对于数组类型的数据处理,对 Array 方法的时间复杂度的问题,没有深入研究。最近有时间正好研究了一把,看有没有比较好的替代方式 。前端关于性能问题,一直十分关注。提升性能的方式有很多,有时候一个简单的数据操作,前端开发者们也会“货比三家”,尤其是对数据的处理,总是在对比性能,时间复杂度是衡量标准之一。后来发现了一个第三方库yocto-queue 库或许可以解决我的困惑,开研究一下吧。y...

前言

对于数组类型的数据处理,对 Array 方法的时间复杂度的问题,没有深入研究。

最近有时间正好研究了一把,看有没有比较好的替代方式 。

前端关于性能问题,一直十分关注。

提升性能的方式有很多,有时候一个简单的数据操作,前端开发者们也会“货比三家”,尤其是对数据的处理,总是在对比性能,时间复杂度是衡量标准之一。

后来发现了一个第三方库yocto-queue 库或许可以解决我的困惑,开研究一下吧。

yocto-queue 库介绍

yocto-queue 库的主要用途是,当数量级较大的数组,需要频繁的进行添加和删除的时候,可以用 yocto-queue 替代数组。

之所以可以用它进行替代,是因为 yocto-queue 库进行操作的时间复杂度是 O (1)而数组则是线性时间复杂度 O (n)

O(1) :表示算法执行的时间大小固定,不随输入数据N的大小而变化

O(n) :表示算法执行的时间是与 n 呈线性关系的任意类型的集合,随着 n 值的增加,执行时间也会增加。

根据时间复杂度对比,不难发现前者的代码运行效率更高一些。

yocto-queue的使用

一般源码的Git仓库中都有使用说明,参考使用说明即可。

import Queue from 'yocto-queue';

const queue = new Queue();

queue.enqueue('🦄');
queue.enqueue('🌈');

console.log(queue.size);
//=> 2

console.log(...queue);
//=> '🦄 🌈'

console.log(queue.dequeue());
//=> '🦄'

console.log(queue.dequeue());

API介绍

queue = new Queue()

该实例是一个Iterable,这意味着您可以使用“for…of”循环前后迭代队列,或者使用扩展将队列转换为数组。除非你真的需要,否则不要这样做,因为这很慢。

  • .enqueue(value):向队列中添加一个值。
  • .dequeue():删除队列中的下一个值。如果队列为空,则返回已删除的值或未定义的值。
  • .clear():清空这个队列
  • .size:队列的长度。

yocto-queue 的实际应用

其实对于第三方库,除了学习之外,实际应用也同样重要。

如果我掌握了一种更佳的代码方案,我会联想到实际开发中的使用场景。

那么问题来了,实际开发中对大量级数据处理的场景,那么我怎么用 yocto-queue 处理这些数据?它并不支持现有数据的初始化。

它初始化了一个空队列,然后可以向里面插入数据,但是如果我本身就有一组数据,怎么进行操作呢?

现有数据的操作问题

这个问题,我来回想了几遍,都觉得对现有数组数据的处理才是这个库介绍中提供的最主要的功能。

仅按照说明文档中的使用,其实没有实际使用价值。

这是目前我对 yocto-queue 应用的最大的困惑

总结

本篇主要分享了yocto-queue 库的用途,知道了它的出现的契机:当数量级较大的数组,需要频繁的进行添加和删除的时候,可以使用它。

同时进一步探讨了如何在实际开发中使用它,虽然没有得到定论,但是问题不一定有答案,过程中定会有收获。(收获了思路和错误的实现方案)。


作者:非职业「传道授业解惑」的开发者叶一一
简介:「趣学前端」、「CSS畅想」系列作者,华夏美食、国漫、古风重度爱好者,刑侦、无限流小说初级玩家。
如果看完文章有所收获,欢迎点赞👍 | 收藏⭐️ | 留言📝。

【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。