javascript: соединение нескольких (заранее неизвестное кол-во) слов в одну строку через разделитель

Question

Передо мной стоит задача - сформировать список классов в элементе в зависимости от установленных флагов, т.е.:

если флаг flag1 установлен, то добавляется имя класса class1 если флаг flag2 установлен, то добавляется имя класса class2 и т.д.

Хочется записать код правильно, красиво и оптимально :)

Я сделал следующим образом:

className = [flag1 ? 'class1' : '', flag2 ? 'class2' : ''].filter((name: string) => name !== '').join(' ')

но может существует более правильный (понятный, красивый, использующий современный JS и т.д.) способ?

Answer 1

Если все "флаги" объявлять отдельными переменными, в любом случае будет получаться что-то похожее на ваш пример - останется необходимость вручную их прописывать. А можно собрать их в общий объект и перебрать циклом:

let FLAGS = {
  flag1: { val: false, name: "class1" },
  flag2: { val: false, name: "class2" },
  flag3: { val: false, name: "class3" },
}

FLAGS.flag1.val = true;
FLAGS.flag3.val = true;

console.log( get_classes(FLAGS) );
console.log( or_get_classes(FLAGS) );

/***/
function get_classes(FLAGS) {
  return Object.values(FLAGS).filter(e => e.val).map(e => e.name).join(" ");
}

/***/
function or_get_classes(FLAGS) {
  let classNames = "";
  
  for (let flag in FLAGS) {
    if (FLAGS[flag].val) {
      classNames += FLAGS[flag].name + " ";
    }
  }
  
  return classNames.trimRight();
}

Есть еще такой фокус ( >> MDN: Object.defineProperty() ):

let FLAGS = {
  flag1: { val: false, name: "class1" },
  flag2: { val: false, name: "class2" },
  flag3: { val: false, name: "class3" },
}

Object.defineProperty(FLAGS, "get_classes", {
  value: function() {
    return Object.values(this).filter(e => e.val).map(e => e.name).join(" ");
  },
});

/***/
FLAGS.flag1.val = true;
FLAGS.flag3.val = true;

console.log( FLAGS.get_classes() );

Создает встроенный метод, который по умолчанию enumerable: false — т.е. не виден при переборе.

БЛОГ НА HUSL

javascript: соединение нескольких (заранее неизвестное кол-во) слов в одну строку через разделитель

Ответы (1 шт):