在TypeScript中从数组中移除重复项

Question

我对typescript很陌生，使用我的javascript技能时遇到了一些问题。例如，有人可以帮我用typescript编写下面完全相同的javascript代码吗？

如果完全不可能，请提供任何一个typescript函数，以产生预期的输出（去除重复值的数组）。

这只是从数组中删除重复项的简单方法，但似乎typescript不允许我定义一个空对象... 我不确定...

以下代码的输出为：['John'、'Paul'、'George'、'Ringo']

谢谢！

const names = ['John', 'Paul', 'George', 'Ringo', 'John'];

function removeDups(names) {
  let unique = {};
  names.forEach(function(i) {
    if(!unique[i]) {
      unique[i] = true;
    }
  });
  return Object.keys(unique);
}

removeDups(names)

- Nando

---

所有的JavaScript都是合适的TypeScript。 - frozen

еҗҜз”Ёstrictзј–иҜ‘ж Үеҝ—ж—¶пјҢ@frozenдёҚдјҡеҸ‘з”ҹдҪңз”ЁгҖӮиҝҷжҳҜдҪҝз”Ёtsc --initе‘Ҫд»Өж—¶зҡ„й»ҳи®Өи®ҫзҪ®... - Patrick Roberts

Answer 1

names = ['John', 'Paul', 'George', 'Ringo', 'John']; 

removeDups(names) {
 let unique = {};
  this.names.forEach((i) => {
    if(!unique[i]) {
      unique[i] = true;
    }
  });
  return Object.keys(unique);
}

然后从您想要的地方调用removeDups

这里是另一种方法:

names = ['John', 'Paul', 'George', 'Ringo', 'John']; 

removeDups(names) {

  return this.names.filter((elem, index, self)=> {
    return index === self.indexOf(elem);
})
}

- M Fuat

Answer 2

实际上，有一种非常简单且高效的方法可以利用内置的Set行为从数组中删除重复元素。

/**
 * Construct a copy of an array with duplicate items removed.
 * Where duplicate items exist, only the first instance will be kept.
 */
function removeDups<T>(array: T[]): T[] {
    return [...new Set(array)];
}

const names = ['John', 'Paul', 'George', 'Ringo', 'John'];
console.log(removeDups(names)); // ["John", "Paul", "George", "Ringo"]

TypeScript Playground

该函数将您的数组转换为Set，比通过数组进行本地循环更快地去除重复项，然后使用展开语法将该Set转换回一个新数组。

通过使removeDups函数使用通用类型，它可以与任何类型的数组一起使用，而不仅仅是像您的示例中的字符串数组。

---

将您编写的函数转换为TypeScript，您可以使用以下代码：

const names = ['John', 'Paul', 'George', 'Ringo', 'John'];

function removeDups(names: string[]): string[] {
  let unique: Record<string, boolean> = {};
  names.forEach(function(i) {
    if(!unique[i]) {
      unique[i] = true;
    }
  });
  return Object.keys(unique);
}

removeDups(names)

TypeScript Playground

这个使用实用类型Record来处理你的unique对象类型。然而，由于Object.keys的工作方式，这个函数只能处理字符串数组。如果你想要在所有类型的数组上使用这种方法，可以考虑使用Map，这样你就可以按其他类型进行索引。

大致如下所示：

const names = ['John', 'Paul', 'George', 'Ringo', 'John'];

function removeDups<T>(names: T[]): T[] {
  let unique: Map<T, boolean> = new Map();
  names.forEach(function(i) {
    if(!unique.has(i)) {
      unique.set(i, true);
    }
  });
  return Array.from(unique.keys());
}

console.log(removeDups(names)); // ["John", "Paul", "George", "Ringo"]

TypeScript Playground

- Mark Hanna

Answer 3

在这种情况下，你只需要添加类型。

const names = ['John', 'Paul', 'George', 'Ringo', 'John'];

function removeDups(names: string[]) {
  let unique: any = {};
  names.forEach(function(i: string) {
    if(!unique[i]) {
      unique[i] = true;
    }
  });
  return Object.keys(unique);
}

removeDups(names)

typescript playground

的英译中文为：

{{链接1：TypeScript Playground}}

。

- hgb123

---

使用any是不好的做法，应该避免使用。将any视为基本上表示“不要在这部分使用TypeScript”。 - Mark Hanna

Answer 4

这里有一种简单通用的方法来去除任何数组中的重复元素。

Js:
deDup = (arr) => arr.reduce((acc, current) => {
  if(!acc.includes(current)) acc.push(current)
  return acc
}, [])

Ts:
deDup = (arr: any[]) => arr.reduce((acc, current) => {
  if(!acc.includes(current)) acc.push(current)
  return acc
}, [] as any[])

由于这是通过删除重复值来减少数组的定义，所以调用reduce函数时，确保传入一个新的空数组（累加器）作为初始值。在每个索引（当前值）上，如果它不在累加器数组中，则将其添加到数组中，然后返回累加器数组。这将快速地将一个没有重复项的新数组返回给调用者。

- Celeste Belden

---

嗨，欢迎来到StackOverflow :) 值得知道的是，在这种方式中使用Array.prototype.reduce将为初始数组的每个元素构建一个新数组，因此这种方法相对较慢且占用内存。与循环相比，reduce也被认为对人类来说更难解析。它能工作，但肯定有更好的方法来达到相同的结果。最好避免使用any类型，因为它基本上是在说“不要在这一部分使用TypeScript” - 使用any类型会失去所有类型安全性。 - Mark Hanna