javascript - objetos - ¿Cómo encuentro un elemento de matriz con TypeScript?(una forma moderna y más fácil)

map javascript

Question

¿Hay alguna forma canónica de encontrar un elemento en una matriz con TypeScript?

ES6 + permite este enfoque simple / limpio

[{"id":1}, {"id":-2}, {"id":3}].find(myObj => myObj.id < 0)  // returns {"id":-2}

TypeScript implementa muchas características de ES6 + y continúa haciéndolo. Parece probable que tenga al menos una buena solución, así que:

¿Cómo se puede encontrar un elemento en una matriz usando TypeScript, considerando la facilidad de uso, las mejores prácticas modernas y la elegancia a través de la simplicidad?
(reformulando ligeramente la pregunta para buscar los mejores enfoques)

Notas

• " elemento " podría ser un objeto JavaScript, o casi cualquier otra cosa. El ejemplo anterior es encontrar objetos simples de JS nativos, pero existen muchos escenarios.

• " canónico " es solo una manera elegante en Ciencias de la Computación (y otros campos) para decir "regla general aceptada o fórmula estándar" (recuerde que todos aquí no lo sabían en algún momento)

• No se trata de nuevas características . Cualquier versión de JS podría hacer esto. Sin embargo, la forma de hacerlo se vuelve cada vez menos atractiva cuanto más retrocedas en el tiempo.

• Hoja de ruta de TypeScript para referencia.

Answer 1

Jugar con tsconfig.json También puedes apuntar a es5 de esta manera:

{
    "compilerOptions": {
        "experimentalDecorators": true,
        "module": "commonjs", 
        "target": "es5"
    }
    ...

Answer 2

Para algunos proyectos, es más fácil establecer su objetivo en es6 en su tsconfig.json .

{
  "compilerOptions": {
    "target": "es6",
    ...

Answer 3

Podrías usar la biblioteca de subrayado.

Instalarlo:

   npm install underscore --save
   npm install @types/underscore --save-dev

Importalo

   import _ = require(''underscore'');

Úsalo

    var x = _.filter(
      [{ "id": 1 }, { "id": -2 }, { "id": 3 }],
      myObj => myObj.id < 0)
    );

Answer 4

Primera parte - Polyfill

Para los navegadores que no lo han implementado, un polyfill para array.find . Cortesía de MDN .

if (!Array.prototype.find) {
  Array.prototype.find = function(predicate) {
    if (this == null) {
      throw new TypeError(''Array.prototype.find called on null or undefined'');
    }
    if (typeof predicate !== ''function'') {
      throw new TypeError(''predicate must be a function'');
    }
    var list = Object(this);
    var length = list.length >>> 0;
    var thisArg = arguments[1];
    var value;

    for (var i = 0; i < length; i++) {
      value = list[i];
      if (predicate.call(thisArg, value, i, list)) {
        return value;
      }
    }
    return undefined;
  };
}

Segunda parte: interfaz

Debe ampliar la interfaz de matriz abierta para incluir el método de find .

interface Array<T> {
    find(predicate: (search: T) => boolean) : T;
}

Cuando esto llegue a TypeScript, recibirá una advertencia del compilador que le recordará que elimine esto.

Tercera parte: úsala

La variable x tendrá el tipo esperado ... { id: number }

var x = [{ "id": 1 }, { "id": -2 }, { "id": 3 }].find(myObj => myObj.id < 0);

Answer 5

Si necesita algunas mejoras de es6 no admitidas por Typecript, puede apuntar a es6 en su tsconfig y usar Babel para convertir sus archivos en es5.