Как оптимизировать работу скрипта?

Question

[eellazy]

Всем доброго дня!

Есть таблица excel с 1370 записями.

Написал скрипт который показывает название товара в зависимости от выбранной опции.

$(document).ready(function() {

    var arr1 = ["M166 E16", "A-Class", "2004", "A 160", "W168.II", "бензин"];
    var arr2 = ["M166 E19", "A-Class", "2004", "A 190", "W168.II", "бензин"];
    var arr3 = ["M266 E15", "A-Class", "2005", "A 150", "W169.I", "бензин"];

    $('.left').on('change', function() {
        if  (
               arr1.indexOf($("#class").val()) != -1
            && arr1.indexOf($("#model").val()) != -1
            && arr1.indexOf($("#god").val()) != -1
            && arr1.indexOf($("#kuzov").val()) != -1
            && arr1.indexOf($("#tip").val()) != -1)
        {
            $("#page-title").html( "Мотор M166 E16" );
        }
        else if  (
               arr2.indexOf($("#class").val()) != -1
            && arr2.indexOf($("#model").val()) != -1
            && arr2.indexOf($("#god").val()) != -1
            && arr2.indexOf($("#kuzov").val()) != -1
            && arr2.indexOf($("#tip").val()) != -1)
        {
            $("#page-title").html( "Мотор M166 E19" );
        }

        else if  (
            arr3.indexOf($("#class").val()) != -1
            && arr3.indexOf($("#model").val()) != -1
            && arr3.indexOf($("#god").val()) != -1
            && arr3.indexOf($("#kuzov").val()) != -1
            && arr3.indexOf($("#tip").val()) != -1)
        {
             $("#page-title").html( "Мотор M266 E15" );
        }

    });
});

С массивом всё понятно. Занести нужные мне значения.
Как можно оптимизировать вторую часть скрипта? Где идут проверки на значения и показ названия? Писать 1370 проверок не прокатит. Можно попробовать внести в первый элемент массива само название и как-то его подставлять в название

Так же заметил баг. Если указать правильные занчение - отобразится нужное название. Но если указать после на значение которого нету в массиве - то название товара по прежнему остается и будет до тех пор пока я не введу ту комбинацию которая будет в масиве

Answer 1

[Сергей Соколов]

Надо перебирать в цикле имеющиеся значения. Удобнее держать данные (строки) в массиве массивов:

data = [
    ["M166 E16", "A-Class", "2004", "A 160", "W168.II", "бензин"],
    ["M166 E19", "A-Class", "2004", "A 190", "W168.II", "бензин"],
    // и остальные данные. 
  ];

Вытащить значения полей ввода лучше лишь 1 раз и запомнить в переменных:

// вместо многократного
($("#class").val())
// лучше один раз
var _class = $("#class").val();
// и потом использовать значение этой переменной

Общий алгоритм: ищем, перебирая строки. Как только нашли, дальше не ищем. В конце смотрим, нашлось вообще что-то (показываем) или нет (пишем «нет результатов»).

Поиск вызывает вопросы:

1. точно ли ищете полное соответствие значений или достаточно подстроки;
   
2. важен ли case (может, искать будут «БЕНЗИН» вместо «бензин»
   
3. точно ли хотите искать каждое значение во всех полях строки? Например, год – известно же, что он в определённой колонке. Быстрее сравнивать искомый год только с одним полем.
   

Сравниние с -1 короче записать так: !!~value – тоже будет false только если value == -1

Итого

$(document).ready(function() {
  const data = [
    ["M166 E16", "A-Class", "2004", "A 160", "W168.II", "бензин"],
    ["M166 E19", "A-Class", "2004", "A 190", "W168.II", "бензин"],
    ["M266 E15", "A-Class", "2005", "A 150", "W169.I", "бензин"],
    // и остальные данные. 
  ];


  $('.left').on('input', function() {
    const _class = $("#class").val(),
      _model = $("#model").val(),
      _god = $("#god").val(),
      _kuzov = $("#kuzov").val(),
      _tip = $("#tip").val()
    ;
    
    var index = -1; // сначала считаем, что "не найдено"
    
    for(let i = 0; i < data.length; i++) {
      let car = data[i];
      if( !!~car.indexOf(_class)
        &&  !!~car.indexOf(_model)
        &&  !!~car.indexOf(_god)
        &&  !!~car.indexOf(_kuzov)
        &&  !!~car.indexOf(_tip)
      ) {
        index = i;
        break;
      }
    }
    
    if(!!~index) {  // нашли и index стал больше -1
      $("#page-title").html( "Мотор " + data[i][0] );
    } else {        // не нашли и index === -1
      $("#page-title").html( "Нет такого" );
    }
  });
});