如何实现文本框值与数组元素匹配？代码返回全数组问题咨询

我正尝试实现文本框输入值与指定数组元素的匹配功能，以下是我的代码片段：

JavaScript代码：

$('#message').on('keyup', function () {
 suggest_array_sample = [
 { array_val: "#{person1}" },
 { array_val: "#{person2}" },
 { array_val: "#{person3}" }
 ];
 found_variable_array = [];
 $.each(suggest_array_sample, function (key, value) {
 console.log(value);
 if ($.inArray(value, textbox_value)) {
 console.log('found');
 found_variable_array.push(value);
 } else {
 console.log('not found');
 }
 })
 console.log(found_variable_array);
});

HTML代码：

<textarea id="message"></textarea>

当前问题是：无论输入什么，代码总是返回整个数组而非匹配项。预期输出为：当输入#{person1}时，返回[{array_val:"#{person1}"}]；当输入包含多个匹配项的内容时，返回对应的匹配元素数组。但实际返回整个suggest_array_sample数组。请问是否可通过inArray()实现需求，还是需要修改代码？

首先得说你的代码里有几个关键问题，直接导致了这个不符合预期的结果：

1. $.inArray的用法完全搞反了，还漏了输入值的获取
   $.inArray的正确参数顺序是$.inArray(要查找的值, 目标数组)，但你写的是$.inArray(value, textbox_value)——首先textbox_value根本没定义，你连文本框的输入值都没获取；其次就算获取了，你拿数组里的对象去和字符串类型的输入值比，完全不对路。

2. 非零值被当作true的坑
   因为$.inArray找不到匹配项时会返回-1，而在JavaScript里，-1属于非零值，会被if判断为true，所以所有数组元素都被塞进了结果数组里，这就是为什么你总是得到整个数组。

修正后的代码 #

我们先获取输入值，然后遍历数组，直接比较对象的array_val属性（根据你的需求，这里做精确匹配，要是需要包含匹配可以改成includes）：

$('#message').on('keyup', function () {
    // 把数组移到事件外面，避免每次按键都重新创建，提升性能
    const suggest_array_sample = [
        { array_val: "#{person1}" },
        { array_val: "#{person2}" },
        { array_val: "#{person3}" }
    ];
    const found_variable_array = [];
    // 获取当前文本框的输入值，顺便去除首尾空格
    const textbox_value = $(this).val().trim();

    $.each(suggest_array_sample, function (key, item) {
        // 精确匹配：输入值和array_val完全一致
        if (textbox_value === item.array_val) {
            console.log('found');
            found_variable_array.push(item);
        } else {
            console.log('not found');
        }
        // 如果需要"输入值包含array_val内容"的匹配，就换成下面这行：
        // if (textbox_value.includes(item.array_val)) { ... }
    });

    console.log(found_variable_array);
});

关于$.inArray的适用性 #

$.inArray适合在纯值类型数组（比如字符串、数字数组）里查找值的位置，比如["a","b","c"]里找"b"。但你的数组里是对象，对象是引用类型，除非你查找的是同一个对象引用，否则$.inArray根本找不到匹配项。所以你的需求不适合用$.inArray，直接遍历数组比较属性是更靠谱的方案。

内容的提问来源于stack exchange，提问作者Alfred M.