使用TypeScript在Array中查找对象

Question

有没有一种规范的方法来使用TypeScript在数组中查找对象？

我知道TypeScript已经实现了很多ES6功能,ES6可以做到这一点:

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

但是我在TS路线图上找不到.

显然,这可以用ES5 Javascript的老式方式完成.关键是TypeScript正在跟踪ES6功能,所以我问是否有更好的方法,最好是像上面显示的ES6示例.

Answer 1

第一部分 - Polyfill

对于尚未实现它的浏览器,可以使用polyfill array.find.由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;
  };
}

第二部分 - 接口

您需要扩展open Array接口以包含该find方法.

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

当它到达TypeScript时,您将收到编译器的警告,提醒您删除它.

第三部分 - 使用它

变量x将具有预期的类型......{ id: number }

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

Answer 2

对于一些项目,它更容易你的目标设定es6在你的tsconfig.json.

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

Answer 3

使用tsconfig.json你也可以像这样定位es5:

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