szQocks

Можно эффективнее, без сортировки, в один проход reduce.

Можно и короче записать

Оверлей - svg

на очень скорую руку и совсем не адаптивно



svg online: https://editor.method.ac/

Потому что перевод строки после return движок JS воспринимает как границу между операторами. Как будто там точка с запятой.
Если записать в одну строчку, то не будет undefined:

if(res.includes(array[i]) ) return res.push(array[i])

Ну а так, в целом, return здесь вовсе не нужен.
Ведь return - это выход из функции.
А вам нужен выход из текущей итерации цикла - это continue.

Best Practice https://github.com/vladilenm/select-plugin

взять готовый реакт, или же, если немного таких полей, то проще всего написать несколько event listener-ов

нуууу, или же.... (но это просто мне было интересно попробовать, так делать не надо)

https://www.youtube.com/watch?v=jblAsT79xvM Отличная верстка данного таймлайна)

Можно передавать флаг события в дочерний компонент через props.
Повесить на кнопку в родительском обработчик события, где при клике isClicked = true при нажатии, и затем передать в дочерний элемент в качестве props этот самый isClicked

Не знаю как во вью но в реакте это можно сделать передав из родителя в ребенка функцию как пропс, либо де на крайний вариант можно использовать useRef либо в контексте передать функцию

Вообще, если компонент завязан на родительский компонент, то это говорит о проблемах с архитектурой.
Но если очень надо, то можно:
1. подписаться на события родительского компонента, обратившись к нему через this.$parent
https://ru.vuejs.org/v2/guide/components-edge-case...
2. родительский компонент может вызвать методы любого потомка, на который он навешал ref
https://ru.vuejs.org/v2/guide/components-edge-case...

А почему не while?

const arr = [1,2,3,4,5,6]
let num = 10
let index = 3

while ( num > 0 ) {
  if ( !arr[index] ) {
    index = 0
  }
  
  arr[index] += 1
	
  index++
  num--
}

console.log( arr )

Такая запись называется быдлокод.
Конкретно если записать в свойство length массива объект, то будет ошибка:
RangeError: Invalid array length
Но вероятно к моменту выполнения данной строки в obj уже не объект, динамическая природа js плюс километровые функции, которые обычно пишутся быдлокодерами, вполне такое позволяют.

Никак, только обернуть в доп элемент.
Если копейки в цене всё время равны .00, то можно их захардкодить в ::after , а сам элемент сделать жирным

Почему-то все забывают, что clip-path поддерживает координаты через calc(), что нивелирует все проблемы с адаптивностью и соединением блоков вне зависимости от количества контента, ширины блока.

clip-path: polygon(0% 0%, 100% calc(0% + 60px), 100% calc(100% - 60px), 0% 100%);
/* calc(100% - 60px) -- вот тут задал четкую ширину скоса */

Как сверстать наклонные блоки на css?

Вот красивое решение: 9elements.com/blog/pure-css-diagonal-layouts

"H1" или "h1" - это не "заголовок html", а "тег для выделения заголовка в тексте". Их можно ставить как угодно и где угодно.

Есть необязательное правило:

• H1 - это заголовок документа
  
• H2 - это заголовки разделов
  
• H3 - это заголовки подразделов
  

ну и так далее...

Ну, если я правильно понял вопрос.