0xD34F

Определим функции сортировки, в зависимости от типа:

const sort = {
  str: (a, b) => a.text().localeCompare(b.text()),
  num: (a, b) => parseInt(a.text(), 10) - parseInt(b.text(), 10),
};

Кнопкам добавим data-атрибуты, которые будут указывать имя свойства и тип данных:

<button class="sort" data-field="age" data-type="num">Сортировать по возрасту</button>
<button class="sort" data-field="name" data-type="str">Сортировать по имени</button>

Ну и сортируем:

$('.sort').click(function() {
  const
    $this = $(this),
    data = $this.data(),
    compare = sort[data.type],
    field = `.${data.field}`,
    order = +data.order || 1;

  $('.block')
    .sort((a, b) => order * compare($(field, a), $(field, b)))
    .appendTo('.cont');

  $this.data('order', order * -1);
});

https://jsfiddle.net/8wkn5hz4/

const idsA = new Set(ListA.map(n => n.id));
const objB = Object.fromEntries(ListB.map(({ uid, ...n }) => [ uid, (n.id = uid, n) ]));
const ListAB = ListA.map(n => ({ ...n, ...objB[n.id] }));
ListB.forEach(({ uid }) => idsA.has(uid) || ListAB.push(objB[uid]));

Останавливайте всплытие при клике на инпут:

$list.find('input').click(e => e.stopPropagation());

Или проверяйте целевой элемент (это в обработчике клика по $listItems):

if (!$(e.target).is('input')) {
  $list.hide();
}

Вынесите её в thead.


UPD. Как это может выглядеть: thead, и дурацкий вариант.

str.match(/rgb\(.*\)/).pop().match(/\d+/g)

или

str.match(/rgb\((.*)\)/).pop().split(', ')

Замените

projectTechnologies.innerHTML = technologyHandler(dataTechnologies).map((el) => el);

на

projectTechnologies.innerHTML = technologyHandler(dataTechnologies).map(n => n.outerHTML).join('');

// или

technologyHandler(dataTechnologies).forEach(n => projectTechnologies.appendChild(n));

ИЛИ

Перепишите technologyHandler следующим образом:

const technologyHandler = str => str
  .split(' ')
  .map(n => `<p class="project_technologies-item">${n}</p>`)
  .join('');

// или

const technologyHandler = str =>
  str.replace(/ ?(\S+)/g, '<p class="project_technologies-item">$1</p>');

И уберите map после её вызова:

projectTechnologies.innerHTML = technologyHandler(dataTechnologies);

const digits = Object
  .entries([...`${num}`].reduce((acc, n) => (acc[n] = (acc[n] || 0) + 1, acc), {}))
  .reduce((acc, n) => (n[1] > 1 && acc.push(+n[0]), acc), []);

или

const digits = num
  .toString()
  .split('')
  .reduce((acc, n) => (acc[n]++, acc), Array(10).fill(0))
  .map((n, i) => n > 1 && i)
  .filter(n => n !== false);

или

const digits = Array
  .from(String(num), Number)
  .filter((n, i, a) => i !== a.indexOf(n))
  .filter((n, i, a) => i === a.indexOf(n));

или

const digits = (('' + num)
  .match(/\d/g)
  .sort()
  .join('')
  .match(/(\d)\1+/g) || [])
  .map(n => n[0] | 0);

Ловите событие change, обходите элементы, собирайте запрос. В чём проблема-то? Например.

const values = [ 'text', 'move', 'lols' ];
const selector = values.map(n => `[data-cmd="${n}"]`).join(', ');
const elements = document.querySelectorAll(selector);

elements.forEach(n => n.style.display = 'none');

$('.count').on('input', e => $('.game_iframe').width(e.target.value));

или

document.querySelector('.count').addEventListener('input', function() {
  document.querySelector('.game_iframe').style.width = `${this.value}px`;
});

https://jsfiddle.net/cvr4mgnf/

Можно добавить ещё один data-атрибут - количество знаков после запятой (или без атрибута - вычисляйте, сколько знаков после запятой у data-numb). Там, где число должно быть целым - указываете 0. Ну и при выводе делаете toFixed, используя значение этого атрибута в качестве параметра. Как-то так (с атрибутом). Или так (и без).

Создать массив, содержащий все возможные значения, перемешать его, взять сколько надо элементов из начала:

function randomArr(size, min, max) {
  const arr = Array.from({ length: max - min + 1 }, (n, i) => i + min);

  for (let i = arr.length; --i > 0;) {
    const j = Math.random() * (i + 1) | 0;
    [ arr[j], arr[i] ] = [ arr[i], arr[j] ];
  }

  return arr.slice(0, size);
}


const arr = randomArr(4, 1, 9);

const containerSelector = '.dog';
const buttonSelector = 'i.fa-dog';
const counterSelector = '.score_counter';

Если пара кнопка-счётчик представлена в единственном экземпляре:

$(buttonSelector).click(() => {
  $(counterSelector).text((i, val) => +val + 1);
});

// или

document.querySelector(buttonSelector).addEventListener('click', () => {
  document.querySelector(counterSelector).textContent -= -1;
});

Если элементов .dog несколько:

$(containerSelector).on('click', buttonSelector, e => {
  $(counterSelector, e.delegateTarget).text((i, val) => -~val);
});

// или

document.querySelectorAll(buttonSelector).forEach(function(n) {
  n.addEventListener('click', this);
}, ({ currentTarget: t }) => t
  .closest(containerSelector)
  .querySelector(counterSelector)
  .innerText++
);

Заворачиваем код в $('.calculator').each, вместо поиска элементов по всему документу ограничиваемся текущим .calculator. Как-то так.

const $thumbs = $('.thumbs');

$('.show-image').click(function(e) {
  e.preventDefault();
  $('.images img.active').removeClass('active');
  $('.images img').eq(this.dataset.index).addClass('active');
}).attr('data-index', i => i);

$('.next').click(() => $thumbs.append($thumbs.find('.show-image').first()));
$('.prev').click(() => $thumbs.prepend($thumbs.find('.show-image').last()));

const vowelCount = str => str.replace(/[^aeiouy]/gi, '').length;

или

const vowelCount = str => str.split(/[aeiouy]/i).length - 1;

или

const vowelCount = str => Array
  .from(str.toLowerCase())
  .reduce((acc, n) => acc + 'aeiouy'.includes(n), 0);

<button>toggle disabled</button>
<select>
  <option value="">выбрать</option>
  <option value="69">hello, world!!</option>
  <option value="187">fuck the world</option>
  <option value="666">fuck everything</option>
</select>

const $select = $('select');

$('button').click(function() {
  $select
    .prop('disabled', (i, val) => !val)
    .val('')
    .find('[value=""]')
    .text(() => $select.prop('disabled') ? 'тут ничего нет' : 'выбрать');
});

// или

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

document.querySelector('button').addEventListener('click', () => {
  select.disabled = !select.disabled;
  select.value = '';
  select[0].textContent = select.disabled ? 'тут ничего нет' : 'выбрать';
});

Как получить элементы:

const elems = document.querySelectorAll('.hint');
// или
const elems = document.getElementsByClassName('hint');

Как получить текст элемента:

const getText = el => el.innerText;
// или
const getText = el => el.textContent;
// или
const getText = el => el.firstChild.nodeValue;

Как собрать массив текстов:

const hints = Array.from(elems, getText);

// или

const hints = [].map.call(elems, getText);

// или

const hints = [];
for (const n of elems) {
  hints.push(getText(n));
}

// или

const hints = [];
for (let i = 0; i < elems.length; i++) {
  hints[i] = getText(elems[i]);
}

const filterSelector = '.s-mobile-filter-type-select';
const selectSelector = '.s-mobile-filter-type-select__select';
const selectedSelector = '.s-mobile-filter-type-select__selected-options-list-content';

Вот jquery:

$(selectSelector).on('change', function() {
  $(this)
    .closest(filterSelector)
    .find(selectedSelector)
    .text($('option:selected', this).get().map(n => $(n).text()).join(', '));
});

А вот jquery катится к чёрту:

const updateSelected = select => select
  .closest(filterSelector)
  .querySelector(selectedSelector)
  .textContent = Array
    .from(select.selectedOptions, n => n.text)
    .join(', ');


// можно назначить обработчик события каждому select'у индивидуально
document.querySelectorAll(selectSelector).forEach(function(n) {
  n.addEventListener('change', this);
}, e => updateSelected(e.target));

// или, применяем делегирование
document.addEventListener('change', ({ target: t }) => {
  if (t.matches(selectSelector)) {
    updateSelected(t);
  }
});