Usando la sintaxis de propagación y el nuevo Set () con mecanografiado

Estoy usando el siguiente código para obtener números únicos:

let uniques = [ ...new Set([1, 2, 3, 1, 1]) ]; // [1, 2, 3]

Sin embargo, error de seguimiento de informe mecanografiado: El tipo 'Set' no es un tipo de matriz. No soy un ninja mecanografiado, ¿alguien podría decirme qué pasa aquí?

Esta es una característica que falta. TypeScript solo admite iterables en Arrays en este momento.

Actualización : con Typescript 2.3, ahora puede agregar "downlevelIteration": truea su tsconfig, y esto funcionará mientras apunta a ES5.

La desventaja downlevelIterationes que TS tendrá que inyectar un poco de repetición cuando se transpile. La única línea de la pregunta se transpila con 21 líneas de texto estándar agregado: (a partir de TypeScript 2.6.1)

var __read = (this && this.__read) || function (o, n) {
    var m = typeof Symbol === "function" && o[Symbol.iterator];
    if (!m) return o;
    var i = m.call(o), r, ar = [], e;
    try {
        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
    }
    catch (error) { e = { error: error }; }
    finally {
        try {
            if (r && !r.done && (m = i["return"])) m.call(i);
        }
        finally { if (e) throw e.error; }
    }
    return ar;
};
var __spread = (this && this.__spread) || function () {
    for (var ar = [], i = 0; i < arguments.length; i++) ar = ar.concat(__read(arguments[i]));
    return ar;
};
var uniques = __spread(new Set([1, 2, 3, 1, 1]));
console.log(uniques);

Este texto estándar se inyectará una vez por archivo que utilice iteración de nivel inferior, y este texto estándar se puede reducir usando la "importHelpers"opción a través de tsconfig. (Vea esta publicación de blog sobre iteración de nivel inferior y importHelpers)

Alternativamente, si la compatibilidad con ES5 no le importa, siempre puede apuntar a "es6" en primer lugar, en cuyo caso el código original funciona sin necesidad de la marca "downlevelIteration".

Respuesta original:

Esto parece ser una peculiaridad de transpilación de ES6 mecanografiado. El ...operador debe trabajar en cualquier cosa que tenga una propiedad de iterador, (Accedido por obj[Symbol.iterator]) y los Conjuntos tengan esa propiedad.

Para evitar esto, se puede utilizar Array.frompara convertir el conjunto en una matriz primero: ...Array.from(new Set([1, 2, 3, 1, 1])).

También puede usar el método Array.from para convertir el conjunto en matriz

let uniques = Array.from(new Set([1, 2, 3, 1, 1])) ;
console.log(uniques);

Necesita configurar "target": "es6",su tsconfig.

Para que funcione, necesita "target": "ES6" (o superior) o "downlevelIteration": true en compilerOptions de su tsconfig.json. Esto resolvió mi problema y funciona bien o para mí. Espero que también te ayude.

En Javascript:

[ ...new Set([1, 2, 3, 1, 1]) ]

En mecanografiado:

Array.from(new Set([1, 2, 3, 1, 1]))

En estado de reacción (setState):

setCart(Array.from(new Set([...cart, {title: 'Sample', price: 20}])));