Лучший способ использовать операторы IF

Question

Предположим, у меня есть 10 столбцов в AG-Grid, мне нужно обновить поля некоторых столбцов, чтобы они не редактировались, исходя из нескольких условий.

Приведенный ниже код работает, но я хотел бы сделать это лучшеway.

Примечание: только при событии click я получу идентификатор столбца.

 if (event.column.colId === 'xxx' || event.column.colId === 'yyy' || event.column.colId === 'xx' || event.column.colId === 'yy'
        || event.column.colId === 'dd' || event.column.colId === 'mm' || event.column.colId === 'yy' || event.column.colId === 'cc' || event.column.colId === 'vv') {
        event.colDef.editable = false;
      }

Answer 1

Вы можете использовать массив:

const colIds = ['xxx', 'yyy', 'xx', 'yy']; //etc.

if (colIds.indexOf(event.column.colId) > -1) {
  event.colDef.editable = false;
}

Answer 2

Более подходящим набором для этой работы может быть Set.В большинстве случаев разница в производительности сама по себе не должна беспокоить, но эта коллекция, как правило, будет реализована в виде хеш-таблицы и, следовательно, более производительна для больших наборов (конечно, при условии, что она не инициализируется в каждой итерации).

Тем не менее, это семантически правильный набор для хранения уникальных значений и более четко демонстрирует ваши намерения. ИМХО.

Использование довольно просто:

const match = new Set(['xxx', 'yyy', 'xx', 'yy']);

// O(1) time complexity, most likely
if (match.has('yy')) {
     // do stuff
}

Если вы не хотитечтобы использовать Set или поддерживать старые браузеры без использования полифилла, вы можете использовать простой объект js, чтобы получить те же преимущества по производительности хэширования:

function init(a) {
  var result = {};
  for (var i = 0, length = a.length; i < length; i++) {
    result[a[i]] = true;
  }
  return result;
}

var match = init(['xxx', 'yyy', 'xx', 'yy']);
if (match.hasOwnProperty('yy')) {
    // do stuff
}

Answer 3

Вы можете создать массив со значениями, которые необходимо сравнить, и затем использовать метод массива indexOf(), чтобы проверить, имеет ли event.column.colId значение, указанное в массиве, или нет.

var match = ['xxx', 'yyy', 'xx', 'yy', 'dd', 'mm', 'cc', 'vv']; 
if (match.indexOf(event.column.colId) !== -1) {
    event.colDef.editable = false;
}

Вы также можете использовать if(match.includes(event.column.colId)), который возвращает логическое значение, но includes() не работают в браузере IE, поэтому я рекомендую использовать indexOf()

indexOf () методвозвращает индекс в вызывающем объекте String первого вхождения указанного значения, начиная поиск с fromIndex.Возвращает -1, если значение не найдено.