0xD34F

onResize = () => {
  this.setState(() => ({
    /* ... */
  }));
}

componentDidMount() {
  window.addEventListener('resize', this.onResize);
  this.onResize();
}

componentWillUnmount() {
  window.removeEventListener('resize', this.onResize);
}

$('table').on('change', 'select', ({ target: t }) => {

  $(t).replaceWith(t.value);

  // или

  $(t).prop('outerText', t.value);

  // или

  $(t).after(t.value).remove();
});

const isSelect = el => el.tagName === 'SELECT';
// или
const isSelect = el => el.nodeName === 'SELECT';
// или
const isSelect = el => el.matches('select');
// или
const isSelect = el => el instanceof HTMLSelectElement;

document.querySelector('table').addEventListener('change', ({ target: t }) => {
  if (isSelect(t)) {

    t.replaceWith(t.value);

    // или

    t.parentNode.replaceChild(new Text(t.value), t);

    // или

    t.outerText = t.value;

    // или

    t.after(t.value);
    t.remove();

    // или

    t.parentNode.replaceChildren(...Array.from(
      t.parentNode.childNodes,
      n => n === t ? t.value : n
    ));
  }
});

progress.css('background-color', [
  { min: 100, color: '#47C965' },
  { min:  40, color: '#f5dd30' },
  { min:   0, color: '#bf4542' },
].find(n => n.min <= strength).color);

const tests = [ здесь перечисляете регулярные выражения ].map((n, i) => ({
  regex: n,
  message: error_wrap.attr(`data-error_${i + 1}`),
}));

const newArr = Object
  .values(arr.reduce((acc, n, i) => ((acc[n] ??= []).push(i), acc), {}))
  .reduce((acc, n) => (n.forEach(i => acc[i] = n.length > 1), acc), []);

// или

const newArr = arr.map(function(n) {
  return this[n];
}, arr.reduce((acc, n) => (acc[n] = acc.hasOwnProperty(n), acc), {}));

// или

const count = arr.reduce((acc, n) => (acc[n] = (acc[n] ?? 0) + 1, acc), {});
const newArr = arr.map(n => count[n] > 1);

// или

const newArr = arr.map((n, i, a) => a.indexOf(n) !== a.lastIndexOf(n));

arr.forEach(function(n, i, a) {
  a[i] = this.get(n) > 1;
}, arr.reduce((acc, n) => acc.set(n, -~acc.get(n)), new Map));

// или

const duplicates = arr.reduce((acc, n) => acc.set(n, acc.has(n)), new Map);
arr.splice(0, arr.length, ...arr.map(n => duplicates.get(n)));

input[type=checkbox], label{

$('select').change(function() {
  const text = $(':checked', this).text();
  console.log(text);
});

document.querySelector('select').addEventListener('change', function(e) {
  const select = this;
  // или
  // const select = e.target;
  // const select = e.currentTarget;

  const [ option ] = select.selectedOptions;
  // или
  // const option = select[select.selectedIndex];
  // const option = select.querySelector(':checked');
  // const option = [...select.options].find(n => n.selected);

  const text = option.text;
  // или
  // const text = option.textContent;
  // const text = option.innerText;

  console.log(text);
});

document.querySelector('#filter-input').addEventListener('input', e => {
  const val = e.target.value.toLowerCase();

  container.querySelectorAll('.title').forEach(n => {
    n.closest('.card').style.display = n.innerText.toLowerCase().includes(val)
      ? 'block'
      : 'none';
  });
});

document.getElementById('filter-input').oninput = function() {
  const val = this.value.toLowerCase();

  for (const n of container.getElementsByClassName('title')) {
    let card = n;
    while (!(card = card.parentNode).classList.contains('card')) ;
    card.hidden = n.textContent.toLowerCase().indexOf(val) === -1;
  }
};

Object.entries(newValue).forEach(([ k, v ]) => {
  if (v !== oldValue[k]) {
    this.$store.commit('setCarInfo', { to: k, value: v });
  }
});

computed: {
  rangeValues() {
    return new Proxy(this.$store.state.carSetup, {
      set: (target, key, val) => {
        this.$store.commit('setCarInfo', { [key]: val });
        return true;
      },
    });
  },
},

setCarInfo: (state, payload) => Object.assign(state.carSetup, payload),

const obj = Object.fromEntries(arr.map((n, i) => [ `answer${i + 1}`, n ]));

const obj = arr.reduce((acc, n, i) => (acc['answer' + ++i] = n, acc), {});

const obj = {};
for (const [ i, n ] of arr.entries()) {
  obj['answer'.concat(-~i)] = n;
}

keys = list(data.keys())
result = [ { k: data[k][i] for k in keys } for i in range(len(data[keys[0]])) ]

computed: {
  filteredProducts() {
    const keyword = this.keyword.toLowerCase();

    return this.products.filter(item => (
      (item.name.toLowerCase().includes(keyword)) &&
      (!this.colors.length || this.colors.includes(item.color)) &&
      (!this.sizes.length || this.sizes.some(n => item.size.includes(n))) &&
      (!this.categories.length || this.categories.includes(item.category))
    ));
  },
  ...

computed: {
  colorFilter() {
    return Array
      .from(new Set(this.products.map(n => n.color)))
      .sort((a, b) => a.localeCompare(b));
  },
  ...

onChange = {(event, userItem)=>handleChange(event, userItem)}

function handleChange(e) {
  console.log('userItem', this);
  console.log('value', e.target.value);
}

from random import sample

arr = [ 'AAA', 'BBB', 'CCC', 'DDD', 'EEE', 'FFF', 'GGG', 'HHH' ]
string = ''.join(sample(arr, k=len(arr)))

$('.filter').change(({ target: t }) => {
  $(`[name="${$(t).closest('.button').data('size')}"]`)
    .closest('.product-box')
    .toggleClass('hidden', !t.checked);
}).find(':checked').change();

const filter = document.querySelector('.filter');

filter.addEventListener('change', ({ target: t }) => {
  const size = t.closest('.button').dataset.size;
  document.querySelectorAll(`[name="${size}"]`).forEach(n => {
    n.closest('.product-box').classList.toggle('hidden', !t.checked);
  });
});

filter.querySelectorAll(':checked').forEach(n => {
  n.dispatchEvent(new Event('change', { bubbles: true }));
});

const group = (arr, key) =>
  arr.reduce((acc, n) => (
    (acc[n[key]] = acc[n[key]] || []).push(n),
    acc
  ), {});

const groupItemKeys = [ 'kurs', 'contract', 'credit' ];

const groupedData = useMemo(() => {
  return Object.entries(group(data, 'country'));
}, [ data ]);

<tbody>{groupedData.map(([ country, items ], i) =>
  <tr>
    <td>{i + 1}</td>
    <td>{country}</td>
    {groupItemKeys.map(k =>
      <td>{items.map(n => <div>{n[k]}</div>)}</td>
    )}
  </tr>)}
</tbody>

const groupedData = useMemo(() => {
  return Object.values(group(data, 'country'));
}, [ data ]);

<tbody>{groupedData.map((n, i) => n.map((m, j) =>
  <tr>
    {!j && <React.Fragment>
      <td rowSpan={n.length}>{i + 1}</td>
      <td rowSpan={n.length}>{m.country}</td>
    </React.Fragment>}
    {groupItemKeys.map(k => <td>{m[k]}</td>)}
  </tr>))}
</tbody>

const rowsData = useMemo(() => {
  return Object
    .values(group(data, 'country'))
    .flatMap((items, i) => items.map((n, j) => (j
      ? []
      : [ i + 1, n.country ].map(m => [ m, items.length ])
    ).concat(groupItemKeys.map(k => [ n[k] ]))));
}, [ data ]);

<tbody>{rowsData.map(n =>
  <tr>{n.map(m => (
    <td rowSpan={m[1]}>{m[0]}</td>))}
  </tr>)}
</tbody>

result = [ { arr[i]: arr[i + 1] } for i in range(0, len(arr), 2) ]

<div>
  <input id="password">
</div>
<div>
  <div>Сложность пароля: <span id="strength_percent">0</span>%</div>
  <progress id="strength_progress" max="100" value="0"></progress>
</div>
<div id="errors"></div>

const validations = [
  {
    test: val => val.length >= 8,
    message: 'пароль должен содержать хотя бы 8 символов',
  },
  {
    test: val => /[A-ZА-ЯЁ]/.test(val),
    message: 'пароль должен содержать хотя бы 1 большую букву',
  },
  {
    test: val => /[a-zа-яё]/.test(val),
    message: 'пароль должен содержать хотя бы 1 маленькую букву',
  },
  {
    test: val => /[^\s\da-zа-яё]/i.test(val),
    message: 'пароль должен содержать хотя бы 1 спецсимвол (не пробел, букву или цифру)',
  },
  {
    test: val => /\d/.test(val),
    message: 'пароль должен содержать хотя бы 1 цифру',
  },
];

document.querySelector('#password').addEventListener('input', e => {
  const errors = validations.reduce((acc, n) => (
    n.test(e.target.value) || acc.push(n.message),
    acc
  ), []);

  const strength = (validations.length - errors.length) / validations.length * 100;

  document.querySelector('#strength_progress').value = strength;
  document.querySelector('#strength_percent').innerText = strength | 0;
  document.querySelector('#errors').innerHTML = errors
    .map(n => `<p>${n}</p>`)
    .join('');
});