0xD34F

function onlyOne(checkbox) {
  for (const n of document.getElementsByName(checkbox.name)) {
    n.checked = n === checkbox ? n.checked : false;
  }
}

или

function onlyOne(checkbox) {
  checkbox
    .closest('.group')
    .querySelectorAll('input[type="checkbox"]')
    .forEach(n => n.checked = n.checked && n === checkbox);
}

А зачем вы обернули объявление функции checkParams в ready? - снаружи она не видна, отсюда и ошибка. Уберите ready, или назначайте обработчики там же, где и функция объявлена, а не инлайново.

https://jsfiddle.net/m913pr75/

...как мне правильно написать регулярку для jq метода find(), чтобы он...

Никак. Если бы вы составили себе труд ознакомиться с документацией, то знали бы, что find с регулярными выражениями не работает.

<select id="person"></select>
<select id="key"></select>
<span id="value"></span>

const data = [
  {
    "ФИО": "Иванов Сергей",
    "Адрес": {
      "Город": "Москва",
      "Улица": "Пятницкая",
      "Дом": "35",
    },
  },
  {
    "ФИО": "Сидоров Иван",
    "Адрес": {
      "Город": "Питер",
      "Улица": "Ленина",
      "Дом": "42",
    },
  },
];


const selects = [
  Select('#person', data.map(n => n['ФИО'])),
  Select('#key', Object.keys(data[0]['Адрес'])),
];

selects.forEach(n => n.addEventListener('change', onChange));


function Select(selector, options) {
  const el = document.querySelector(selector);
  el.append(...options.map(n => new Option(n)));
  el.value = null;
  return el;
}

function onChange() {
  const [ person, key ] = selects.map(n => n.value);
  if (person && key) {
    const value = data.find(n => n['ФИО'] === person)['Адрес'][key];
    document.querySelector('#value').textContent = value;
  }
}

const getUnique = arr => Array
  .from(arr.reduce((acc, n) => acc.set(n, acc.has(n)), new Map))
  .reduce((acc, n) => (n[1] || acc.push(n[0]), acc), []);


const result = getUnique(arr);

или

const getByCount = (arr, checkCount) => Array
  .from(arr.reduce((acc, n) => acc.set(n, -~acc.get(n)), new Map))
  .reduce((acc, n) => (checkCount(n[1]) && acc.push(n[0]), acc), []);


const result = getByCount(arr, count => !~-count);

Является ли нормальной практикой создание нового метода , включающего в себя эти три метода

Если вам надо эти методы вот так вот вызывать в нескольких местах - определённо стоит сделать.

Но если случай единичный, можно просто передать в качестве коллбека функцию, которая будет содержать вызовы нужных методов. Типа так:

buildButton(() => {
  this.drawSomeButtons();
  this.changeSomeVariables();
  this.doSomethingElse();
});

for (var def = 1; def <= n; n++) {

Может, всё-таки должно быть def++ вместо n++?

Один x - свойство экземпляра, другой - статический геттер:

class Base {
  constructor() {
    this.x = 3;
  }

  static get x() {
    return 1.5;
  }
}

Классом этой штуке быть не обязательно:

function Base() {
  this.x = 3;
}
Base.x = 1.5;

// или

function Base() {}
Base.prototype.x = 3;
Base.x = 1.5;

UPD. Наконец-то появились статические свойства, а свойства экземпляра стало необязательно инициализировать в конструкторе:

class Base {
  x = 3;

  static x = 1.5;
}

Получаем массив значений, достаём из него нужный элемент:

const getValue = (obj, index = 0) =>
  Object.values(obj)[index];

Или, перебираем имена свойств, считаем собственные:

function getValue(obj, index = 0) {
  for (const k in obj) {
    if (obj.hasOwnProperty(k) && !index--) {
      return obj[k];
    }
  }
}

Например:

$('.list_add_room').on('click', '.butt_edit', function() {
  const $el = $(this).closest('.item_contain_list').find('p');
  $('.list_add_room [contenteditable="true"]').not($el).removeAttr('contenteditable');
  $el.attr('contenteditable', (i, val) => val !== 'true').focus();
});

Есть ещё и такой вариант - убирать contenteditable при потере фокуса:

$('.list_add_room').on('click', '.butt_edit', function() {
  $(this).closest('.item_contain_list').find('p').attr('contenteditable', 'true').focus();
}).on('blur', '[contenteditable="true"]', function() {
  $(this).removeAttr('contenteditable');
});

Вы пытаетесь назначить обработчик события элементам, которых нет. Нет на момент назначения.

Поставьте код ниже элементов, или оберните его в $(function() { }), или воспользуйтесь делегированием:

$(document).on('change', 'input[type="radio"]', function() {
  $('.color').text($(this).val());
});

я открыл доселе неизвестный it-сообществу баг...

Ага, щас. Десять багов.

... или где-то далеко по мне плачет один учебник по js?

Так точно.

Замените setInterval(this.tick, interval); на

setInterval(this.tick.bind(this), interval);

или на

setInterval(() => this.tick(), interval);

Будем считать, что переменная genre уже в lowercase'е.

document.querySelectorAll('.u-combolist label').forEach(n => {
  if (n.textContent.toLowerCase().indexOf(genre) != -1) {
    n.previousElementSibling.checked = true;
  }
});

или

$('.u-combolist label')
  .filter((i, n) => $(n).text().toLowerCase().includes(genre))
  .prev()
  .prop('checked', true);

const $el = $('.field');
const el = document.querySelector('.field');

Теги должны остаться? Да:

$el.append(document.createTextNode(str));

// или

$el.append(new Text(str));

// или

$el.append(str.replace(/</g, '&lt;'));

// или

el.append(str);

Нет:

$el.append($(str).text());

// или

const div = document.createElement('div');
div.innerHTML = str;
el.insertAdjacentText('beforeend', div.innerText);

// или

el.append(document.createRange().createContextualFragment(str).textContent);

// или

el.append(new DOMParser().parseFromString(str, 'text/html').body.textContent);

Стили для раскрашивания клеток:

.black { background: black; }
.white { background: white; }

Размеры доски:

const rows = 8;
const cols = 8;

Создавать доску можно через генерацию разметки:

document.querySelector('.info').innerHTML = `
  <table>${Array.from({ length: rows }, (_, i) => `
    <tr>${Array.from({ length: cols }, (_, j) => `
      <td class="${(i ^ j) & 1 ? 'black' : 'white'}"></td>`).join('')}
    </tr>`).join('')}
  </table>`;

Или, создавая её элементы напрямую:

const table = document.createElement('table');

for (let i = 0; i < rows; i++) {
  const tr = table.insertRow();
  for (let j = 0; j < cols; j++) {
    tr.insertCell().classList.add([ 'white', 'black' ][(i ^ j) & 1]);
  }
}

document.querySelector('.info').append(table);

например

Анимируйте элементы независимо, вместо общего селектора передавайте в to конкретный элемент. Например:

const
  ease = Power0.easeNone,
  yoyo = true;

document.querySelectorAll('svg').forEach((n, i) => {
  const
    TopWave = new TimelineLite(),
    el = n.querySelector('.wave'),
    delay = i * (1 + Math.random() * 2);

  TopWave
    .to(el, 8, { delay, morphSVG: '.wave-one',   yoyo, ease })
    .to(el, 7, { delay, morphSVG: '.wave-two',   yoyo, ease })
    .to(el, 8, { delay, morphSVG: '.wave-three', yoyo, ease,
      onComplete: () => TopWave.restart()
    });
});

.test1, .test2, .test3 - убрать цифры, пусть везде будет просто .test

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

wrapper.addEventListener('click', ({ target: t }) => {
  const { test } = t.dataset;
  if (test) {
    const toRemove = Array
      .from(t.closest('.test').children, n => n.dataset.test)
      .filter(n => n !== test);

    wrapper.classList.remove(...toRemove);
    wrapper.classList.toggle(test);

    document.querySelector('#classlist').innerHTML = wrapper.classList;
  }
});

Начать следует с получения из json'а массива:

const { items } = JSON.parse(json).response;

Дальше два пути.

Первый - собираем html:

const html = `
  <tbody>${items.map(n => `
    <tr>
      <td>${n.title}</td>
      <td>${n.director}</td>
      <td>${n.year}</td>
      <td>${Object.values(n.photo).map(m => `<img src="${m}">`).join('')}</td>
    </tr>`).join('')}
  </tbody>
`;

Который затем добавляем в таблицу:

$('#example').append(html);
// или
document.querySelector('#example').insertAdjacentHTML('beforeend', html);

Второй - создаём элементы напрямую:

items.forEach(function(n) {
  const tr = this.insertRow();
  tr.insertCell().textContent = n.title;
  tr.insertCell().textContent = n.director;
  tr.insertCell().textContent = n.year;
  tr.insertCell().append(...Object.values(n.photo).reduce((acc, m) => (
    (acc[acc.length] = new Image).src = m,
    acc
  ), []));
}, document.getElementById('example').createTBody());