了解 JavaScript 中的集合

集合是 ES6 中 JavaScript 的一个新附加组件。 让我们了解一下。

什么是套装?

如何在 JavaScript 中使用它们?

提供了哪些方法来解决问题?

让我们找出本教程中所有问题的答案。

顾名思义,集合是唯一元素的集合。 它不存储重复的值。

JavaScript 中的集合将按插入顺序存储元素。 因此,它们在 JavaScript 中是有序的。 它将存储原始数据类型或对象。

让我们看看 JavaScript 中集合的语法。

我希望你有IDE来练习下面的内容。

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
console.log(names);

const randomWord = new Set("Hiiiiiii");
console.log(randomWord);

const numbers = new Set([5, 5, 5, 2, 1, 1, 2, 3]);
console.log(numbers);

属性和方法

集合具有不同的属性和方法,可以帮助我们使用它们来解决不同的问题。 属性和方法就像创建它们一样简单。 您可以轻松地使用它们的名称本身来获得方法的功能。 让我们一一看看。

尺寸

属性大小返回集合中存在的元素数。

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
console.log(`Size: ${names.size}`);

添加

add 方法用于向集合中添加新元素。 如果新元素已经存在于集合中,则不会添加它。

// empty set
const names = new Set();

names.add("John");
names.add("Harry");
names.add("Wick");
names.add("Jack");
names.add("Harry");

console.log(names);

该方法接受一个参数,如果该元素存在于集合中则返回 true,否则返回 false。

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

console.log(names.has("Harry"));
console.log(names.has("Alley"));

删除

如您所料,方法 delete 接受一个参数并将其从集合中删除。 即使给定的参数不在集合中,它也不会抛出任何错误。

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

names.delete("John");

console.log(names);

条目

方法条目返回一个迭代器,其中包含按插入顺序排列的键值对数组。 在这里,键和值是相同的。

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

const entries = names.entries();

console.log(entries.next().value);
console.log(entries.next().value);
console.log(entries.next().value);
console.log(entries.next().value);
console.log(entries.next().value);

钥匙

方法键按插入顺序返回集合元素的迭代器。

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

const keys = names.keys();

console.log(keys.next().value);
console.log(keys.next().value);
console.log(keys.next().value);
console.log(keys.next().value);
console.log(keys.next().value);

价值观

方法值以类似于方法键的插入顺序返回集合元素的迭代器。

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

const values = names.values();

console.log(values.next().value);
console.log(values.next().value);
console.log(values.next().value);
console.log(values.next().value);
console.log(values.next().value);

清除

方法 clear 从集合中删除所有元素。

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

names.clear();

console.log(names);

为每个

forEach 方法用于遍历集合并从中一一获取所有元素。

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

names.forEach((element) => {
   console.log(element);
});

各种各样的

让我们通过一个程序来看一个集合的简单应用。 给定一个数组,从中删除所有重复值。 为了解决这个问题,我们可以利用 set 属性。

  如何删除在另一个程序中打开的文件

让我们看看解决它的步骤。

  • 用虚拟数据初始化一个数组。
  • 初始化一个空集。
  • 遍历元素数组。
    • 将每个元素添加到集合中。
    • 它会自动删除重复的元素。
  • 初始化一个空数组。
  • 迭代集合并将每个元素添加到新数组。
  • 打印新数组。

我希望你能自己解决。 如果您发现编码有困难,请查看下面的解决方案。

const arr = ["John", "Harry", "Wick", "Jack", "Harry"];

const temp = new Set();

arr.forEach((element) => {
   temp.add(element);
});

const newArr = [];

temp.forEach((element) => {
   newArr.push(element);
});

console.log(newArr);

结论

现在,您已经掌握了在 JavaScript 中使用集合所需的所有知识。 您可以在下一个项目中使用它们。 继续并充分利用它。

快乐编码👨‍💻