0xD34F

Объекты категорий складываете в массив, массив кладёте в хранилище. Маршруту добавляете параметр - идентификатор категории. Пробрасываете его в компонент маршрута, где используете его для извлечения данных категории из хранилища. Всё.

$minPrices = array_values(array_reduce($arr, function($acc, $n) {
  $key = $n['code_id'];
  if (!isset($acc[$key]) || $acc[$key]['price'] > $n['price']) {
    $acc[$key] = $n;
  }

  return $acc;
}, []));

const getNestedItems = (data, test) =>
  data instanceof Object
    ? Object.values(data).flatMap(n => getNestedItems(n, test))
    : test(data) ? [ data ] : [];


const result = getNestedItems(obj, x => /^[A-Z]+$/.test(x)).join('');

или

function* getNestedItems(data, test) {
  if (Object(data) === data) {
    for (const k in data) if (Object.hasOwn(data, k)) {
      yield* getNestedItems(data[k], test);
    }
  } else if (test(data)) {
    yield data;
  }
}


const result = ''.concat(...getNestedItems(obj, x => x?.toUpperCase?.() === x));

<div class="wrapper" v-if="надо рендерить обёртку">
  ...
  <элемент />
  ...
</div>
<элемент v-else />

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

все с атрибутом required

Если у них ещё и форма среди общих предков присутствует, то достаточно будет использовать checkValidity.

Ну а если непременно вручную надо проверять, то...

const className = 'здесь ваш класс';

Получаем input'ы:

const inputs = document.querySelectorAll(`.${className}`);

// или

const inputs = document.getElementsByClassName(className);

Проверяем заполненность:

const isFilled = [...inputs].every(n => n.value);

// или

const isFilled = !Array.prototype.some.call(inputs, n => !n.value);

// или

let isFilled = true;
for (const n of inputs) {
  if (!n.value) {
    isFilled = false;
    break;
  }
}

// или

let isFilled = true;
for (let i = -1; ++i < inputs.length && (isFilled = !!inputs[i].value);) ;

// или

const isFilled = !(function isEmpty(i) {
  return i < inputs.length && (!inputs[i].value || isEmpty(-~i));
})(0);

if (this.frame < 0) {
    this.frame = this.slides.lenght-1;
    this.setBackground(this.slides[this.frame])
}

Если frame неотрицательный, то вызывать setBackground уже не надо?

if (this.frame > this.slides.length) {

По-вашему, у массива может быть элемент с индексом, равным длине?

buttonLeft.addEventListener('click', slider.left());

Функция и результата её вызова - не одно и то же.

for (const { groups } of str.matchAll(re)) {
  console.log(groups);
}

Посчитать, сколько раз каждое из значений встречается в массиве, затем полученные результаты разделить на длину массива и умножить на 100:

Array.from(
  arr.reduce((acc, n) => acc.set(n, -~acc.get(n)), new Map),
  n => [ n[0], (n[1] / arr.length * 100).toFixed(2) + '%' ]
)

Вот это правильно - не читать документацию.

yAxis: {
  plotLines: [
    {
      color: 'red',
      value: 13,
      width: 5,
      zIndex: 666,
    },
  ],
  ...

Ключи объектов - это строки, если использовать нестроковое значение в качестве ключа, оно будет преобразовано в строку, дефолтное строковое представление объекта - это "[object Object]". Всё.

Хотите, чтобы объект реально был ключом - записывайте его в Map вместо простого объекта. Или научите свои объекты представлять себя в виде строки, переопределив у них метод toString (конечно, поступать так имеет смысл только в том случае, если вы можете гарантировать, что строковые представления будут уникальны).

\d{1,2} час(?:а|ов)? \d{1,2} минут(?:а|ы)?

tableRef.current.querySelector('.ant-table-body').scrollTop = 0;

Не нужны тут регулярные выражения, для разбора html есть специальные инструменты:

$doc = new DOMDocument();
$doc->loadHTML($html);
$a = $doc->getElementsByTagName('a');
$result = array_map([ $doc, 'saveHTML' ], iterator_to_array($a));

Но, конечно, дурацкое дело нехитрое:

$result = preg_split('/(?<=\/a>)(?=<a)/', $html);

// или

preg_match_all('/<a .*?>.*?<\/a>/', $html, $matches);
$result = $matches[0];

out.innerText = badWords.reduce((str, n) => str.replaceAll(n, '*'.repeat(n.length)), field);

или

for (const n of badWords) {
  field = field.replace(RegExp(n, 'g'), Array(n.length + 1).join('*'));
}

out.textContent = field;

или

out.innerHTML = (function replace(str, i, word = badWords[i]) {
  return word
    ? replace(str.split(word).join(Array(word.length).fill`*`.join``), -~i)
    : str;
})(field, 0);

[ n2 / n1 * 1000 for n1, n2 in zip(list1, list2) ]
# или
[ list2[i] / n * 1000 for i, n in enumerate(list1) ]
# или
[ list2[i] / list1[i] * 1000 for i in range(len(list1)) ]

let index = -1;

setInterval(el => {
  const show = !el.classList.contains('_active');
  index = (index + show) % infoModal.length;
  el.innerText = infoModal[index].title;
  el.classList.toggle('_active', show);
}, 1000, document.querySelector('.modal__title'));

UPD. Вынесено из комментариев:

Если, к примеру, нужно скрывать блок каждый раз через5 сек, а показывать блок через рандомный промежуток времени?

К чёрту setInterval, делаете функцию, которая вызывает себя по таймауту - случайному при скрытии элемента и фиксированному при показе:

(function updateText(el, i) {
  const show = el.classList.toggle('_active');
  i = (i + show) % infoModal.length;
  el.textContent = infoModal[i].title;
  setTimeout(updateText, 1000 + !show * Math.random() * 3000, el, i);
})(document.querySelector('.modal__title'), -1);

$newStr = preg_replace('~\b(\d)(\d)\b~', '$2$1', $str);

Время, которое я задаю, применяется к fadeOut, а вот к runProgress нет

Окей, посмотрим на эти fadeOut и runProgress:

this.fadeOut = `fadeOut ${this.time}s linear forwards`,
this.runProgress = `runProgress ${this.time}s liner forwards`,

Вам вопрос: чем отличаются эти две строки (конечно, помимо имён анимаций)?

UPD. А это вообще нормально - всем назначать одно и то же значение? В смысле, в шаблоне эти fadeOut и runProgress используются для задания анимации элементам, у которых есть предок с v-for. Если изменить значение свойства time и добавить в messages новый элемент, то у тех, что были добавлены раньше, изменится длительность анимации. Наверное, стоит вырезать свойства fadeOut и runProgress, элементам messages при создании добавлять актуальное значение свойства time, типа time: this.time, и использовать его при задании стилей:

methods: {
  getStyle: (name, { time }) => ({
    animation: `${name} ${time}s linear forwards`,
  }),
  ...

:style="getStyle('fadeOut', message)"

:style="getStyle('runProgress', message)"