javascript - 过滤方法的可变过滤标准

Question

我想过滤一个包含许多照片信息的数组，如下所示，但过滤器应该是可变的(参数和参数的数据类型):

var photos = [
  {
    lat: -15,
    lng: -20,
    alt: 381,
    date: "2016-12-12",
    comment: "Text1" // and many more arguments like file size, bitdepth, iso, ...
  }, 
  {
    lat: -17,
    lng: -22,
    alt: 1381,
    date: "2016-11-11",
    comment: "Text2" // and many more arguments like file size, bitdepth, iso, ...
  },
  {
    lat: -25,
    lng: -30,
    alt: 1000,
    date: "2016-10-10",
    comment: "Text3" // and many more arguments like file size, bitdepth, iso, ...
  },
];

现在我想使用该方法过滤数组

array.filter(callbackfn[, thisArg])

但是过滤条件和查找数据的数据类型有所不同(例如，搜索带有“(lat < -15)”或“(lng > -25) && (alt > 1000)”或“comment ==”的元素“Text2”'，但我不知道如何做到这一点。显然

function filterMetaData(obj, filterString) {
    if(filterString) {
        return true;
    } else {
        return false;
    }
}

var result = photos.filter(filterMetaData, "lat < -18");

不起作用，因为“lat < -18”是一个字符串，并且不被解释为标准，因此 if(filterString) 始终为 true。

如何做到这一点？谢谢，马库斯!

Answer 1

您可以使用函数作为参数

function filterMetaData(fn) {
    return function (o) {
        return fn(o);
    };
}

var photos = [{ lat: -15, lng: -20, alt: 381, date: "2016-12-12", comment: "Text1" }, { lat: -17, lng: -22, alt: 1381, date: "2016-11-11", comment: "Text2" }, { lat: -25, lng: -30, alt: 1000, date: "2016-10-10",  comment: "Text3" }],
    result = photos.filter(filterMetaData(function (o) { return o.lat < -18; }));

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

ES6 解构 object property assignment pattern

function filterMetaData(fn) {
    return function (o) {
        return fn(o);
    };
}

var photos = [{ lat: -15, lng: -20, alt: 381, date: "2016-12-12", comment: "Text1" }, { lat: -17, lng: -22, alt: 1381, date: "2016-11-11", comment: "Text2" }, { lat: -25, lng: -30, alt: 1000, date: "2016-10-10",  comment: "Text3" }],
    result = photos.filter(filterMetaData(({ lat, lng, alt, date }) => lat < -15 || (lng > -25 && alt > 1000)));

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }