返回

Array 与 Set 的异同及使用场景

前端

Array 与 Set 是 JavaScript 中内置的数据结构,它们都有很多共同点,但也有明显的区别。在这篇文章中,我们将讨论它们之间的异同,并介绍它们的典型使用场景。

异同

  • 相似之处

    • 都是有序的数据结构,元素可以按顺序排列。
    • 都有 length 属性,表示数组或集合的长度。
    • 都可以使用索引值来访问元素。
  • 区别

    • 存储元素类型 :Array 可以存储任何类型的数据,而 Set 只能存储唯一的值,即不能有重复的值。
    • 元素顺序 :Array 中的元素顺序是有序的,可以根据索引值来访问元素,而 Set 中的元素顺序是无序的,无法通过索引值来访问元素。
    • 查找元素 :Array 中可以通过索引值来查找元素,而 Set 中只能通过值来查找元素。
    • 添加和删除元素 :Array 中可以通过索引值来添加和删除元素,而 Set 中只能通过值来添加和删除元素。

使用场景

  • Array

    • 当需要存储有序的数据时,可以使用 Array。例如,存储一个学生成绩列表、一个购物清单或一个待办事项列表。
    • 当需要快速访问数据时,可以使用 Array。例如,需要快速查找一个学生在考试中的成绩或一个产品在商店中的价格。
  • Set

    • 当需要存储唯一的值时,可以使用 Set。例如,存储一个网站的访客列表、一个游戏的关卡列表或一个应用的权限列表。
    • 当需要快速查找一个值是否存在时,可以使用 Set。例如,需要快速检查一个用户是否已经登录或一个文件是否已经存在。

总结

Array 和 Set 都是 JavaScript 中非常有用的数据结构,它们都有各自的优缺点和使用场景。在选择使用哪种数据结构时,需要根据具体的需求来选择。

Array 和 Set 的 API

方法
add(value) 向 Set 中添加一个值
clear() 清空 Set 中的所有值
delete(value) 从 Set 中删除一个值
entries() 返回 Set 中所有键值对的迭代器
forEach(callback) 对 Set 中的每个值执行指定的回调函数
has(value) 检查 Set 中是否包含指定的值
keys() 返回 Set 中所有键的迭代器
size 返回 Set 中的值的数量
values() 返回 Set 中所有值的迭代器
方法
concat() 合并两个或多个数组
copyWithin(target, start, end) 将数组的一部分复制到数组的另一个部分
entries() 返回数组中所有键值对的迭代器
every(callback) 检查数组中的每个元素是否都满足指定的条件
filter(callback) 返回数组中满足指定条件的所有元素
find(callback) 返回数组中第一个满足指定条件的元素
findIndex(callback) 返回数组中第一个满足指定条件的元素的索引
forEach(callback) 对数组中的每个元素执行指定的回调函数
includes(value) 检查数组中是否包含指定的值
indexOf(value) 返回数组中指定值第一次出现的位置
join(separator) 将数组中的元素连接成一个字符串
keys() 返回数组中所有键的迭代器
lastIndexOf(value) 返回数组中指定值最后一次出现的位置
length 返回数组中的元素数量
map(callback) 返回数组中每个元素的映射结果
pop() 从数组的末尾删除最后一个元素
push() 向数组的末尾添加一个或多个元素
reduce(callback) 将数组中的元素减少为一个值
reduceRight(callback) 将数组中的元素从右到左减少为一个值
reverse() 反转数组中的元素
shift() 从数组的开头删除第一个元素
slice(start, end) 返回数组中从指定位置到指定位置的部分元素
sort() 根据指定的比较函数对数组中的元素进行排序
splice(start, deleteCount, ...items) 从数组的指定位置删除指定数量的元素,并可选地插入新的元素
unshift() 向数组的开头添加一个或多个元素
values() 返回数组中所有值的迭代器