javascript - 在数组中搜索，而不仅仅是唯一值

Question

我有一个包含荷兰城市名称的简单数组:

var cities = ['Amsterdam', 'Den Haag', 'Den Helder', 'Rotterdam', 'Utrecht', 'Groningen', 'Zoetermeer', 'Zwolle', 'Delft'];

我搜索该数组的代码如下所示:

elems.searchField.on('keyup', function(e) {
    var index, city, result;
    var currentCity = elems.searchField.val().toLowerCase();
    for (index = 0; index < cities.length; ++index) {
        city = cities[index].toLowerCase();

        if (city.indexOf(currentCity) > -1) {
            result = city;
            console.log(result);
            break;
        }
    }
});

elems.optionsButton.on('click', function(e) {
    if (optionButtonState === 0) {
        elems.consoleItemSecondAndThird.css('display', 'flex');
        optionButtonState = 1;
    } else {
        elems.consoleItemSecondAndThird.hide();
        optionButtonState = 0;
    }
});

您可以看到两个以“Den”开头的城市，它们是“Den Haag”和“De Helder”。当我输入“Den”时，我需要看到它们都列出，但是，我的代码仅查找唯一值，并且仅在插入“Den”时显示“Den Haag”。如何让它显示包含搜索查询的所有值？

Answer 1

您可以使用filter()要获取数组并在过滤器内部使用 startsWith() 功能。但请注意 startsWith 是 ES6 中的

开头

var cities = ['Amsterdam', 'Den Haag', 'Den Helder', 'Rotterdam', 'Utrecht', 'Groningen', 'Zoetermeer', 'Zwolle', 'Delft'];

console.log(cities.filter(item => item.startsWith('Den')));

为了兼容旧版本的浏览器，可以使用indexOf()函数来比较index。

var cities = ['Amsterdam', 'Den Haag', 'Den Helder', 'Rotterdam', 'Utrecht', 'Groningen', 'Zoetermeer', 'Zwolle', 'Delft'];

console.log(cities.filter(item => item.indexOf('Den') === 0));