0xD34F

https://jsfiddle.net/tg3fm9no/1/

Сочиняем селектор, соответствующий элементам; получаем коллекцию; перебираем; удаляем класс:

document.addEventListener('keydown', e => {
  if (e.key === 'Escape') {
    const popups = document.querySelectorAll('#popupClient, #popupPartner');
    popups.forEach(n => n.classList.remove('popup--open'));
  }
});

JSON.parse / eval

ну или

({
  'false': false,
  'true': true,
})[str]

const chainScripts = src =>
  src.reduce((acc, n) => {
    return acc.then(() => new Promise((resolve, reject) => {
      const s = document.createElement('script');
      s.onload = resolve;
      s.onerror = reject;
      s.src = n;
      document.head.appendChild(s);
    }));
  }, Promise.resolve());

Как получить input'ы:

const inputs = new DOMParser()
  .parseFromString(str, 'text/html')
  .querySelectorAll('input');

// или

const { elements: inputs } = document
  .createRange()
  .createContextualFragment(str)
  .querySelector('form');

// или

const inputs =
  (el => (el.innerHTML = str, el.getElementsByTagName('input')))
  (document.createElement('div'));

Как извлечь name:

const getName = el => el.name;

// или

const getName = el => el.getAttribute('name');

// или

const getName = el => el.attributes.name.value;

Извлекаем:

const names = Array.from(inputs, getName);

// или

const names = Array.prototype.map.call(inputs, getName);

// или

const names = [];
for (const n of inputs) {
  names.push(getName(n));
}

// или

const names = [];
for (let i = 0; i < inputs.length; i++) {
  names[i] = getName(inputs[i]);
}

// или

const names = (function get(i, n = inputs.item(i)) {
  return n ? [ getName(n), ...get(i + 1) ] : [];
})(0);

Например. Уверен, можно сделать и более цивилизованно (это про отслеживание зума и про замену внутренностей маркера), но ковырять документацию как-то лень.

- e.originalEvent.target.getAttribute('data-id')
+ e.originalEvent.target.closest('[data-id]').dataset.id

UPD.

Это верстка шаблона маркера 2гис, отдельно навешивать на нее обработчики нельзя

"Верстка шаблона маркера" - в смысле, DG.divIcon? Да, туда нельзя. А на сам маркер - можно:

const marker = DG.marker(...
marker.on('click', onMarkerClick);

function onMarkerClick(e) {
  // ...
}

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

Я вообще сделал это чтобы как то понять на какой маркер кликнули

Ну да, вешайте обработчик клика на маркер, смотрите у события свойство target.

Или, возможен другой вариант. Как я понимаю, this.markers - это DG.featureGroup. Оставляете общий обработчик клика, смотрите у события свойство eventTargets, это массив, внутри будет кликнутый маркер.

this.message = this.rules.map(n => n(this.input)).find(n => n !== true);

str.match(/(?<=<-)[^/]+/g)

Или надо получить то, что находится между парами <-какой-то мусор/? Тогда так можно:

str.match(/(<-[^\/]*\/).*?(?=\1)/g).map(n => n.replace(/.*\//, ''))

const nodeToObj = node => ({
  type: node.nodeType,
  value: node.nodeValue,
  tag: node.tagName,
  childNodes: Array.from(node.childNodes, nodeToObj),
  attributes: node.attributes && Array.from(
    node.attributes,
    ({ name, value }) => ({ name, value })
  ),
});

const nodeToJSON = (node, ...args) =>
  JSON.stringify(nodeToObj(node), ...args);

const json = nodeToJSON(document.querySelector('.menu'), null, 2);
document.body.insertAdjacentHTML('beforeend', `<pre>${json}</pre>`);

canvas

О каких классах и data-атрибуте идёт речь:

const class1 = 'item';
const class2 = 'in';
const key = 'price';
const attr = `data-${key}`;

Как извлечь значение атрибута:

const getValue = el => +el.dataset[key];
// или
const getValue = el => parseFloat(el.getAttribute(attr));
// или
const getValue = el => Number(el.attributes[attr].value);

Извлекаем, складываем:

const sum = Array.prototype.reduce.call(
  document.querySelectorAll(`.${class1}.${class2}`),
  (acc, n) => acc + getValue(n),
  0
);

// или

let sum = 0;
for (const n of document.getElementsByClassName(class1)) {
  sum += getValue(n) * n.classList.contains(class2);
}

Сделаем функцию для извлечения вложенного значения - принимает корневой объект и ключи:

const getNested = (root, ...keys) => keys
  .flat(Infinity)
  .flatMap(n => typeof n === 'string' ? n.split('.') : n)
  .reduce((p, c) => p != null ? p[c] : void 0, root);

Ключи могут быть представлены различными способами - единое значение (типа путь), несколько значений (каждое передаётся отдельным аргументом), массивы (включая вложенные):

const id = getNested(e, 'path.1.attributes.uid.textContent');
// или
const id = getNested(e, 'path', 1, 'attributes', 'uid', 'textContent');
// или
const id = getNested(e, 'path.1', [ 'attributes', [ 'uid' ] ], 'textContent');

Или есть такая штука (UPD. Теперь и браузерами поддерживается):

const id = e?.path?.[1]?.attributes?.uid?.textContent;

Делаете метод изменения масштаба:

zoom(change) {
  this.map.setZoom(this.map.getZoom() + change);
},

И подключаете его в качестве обработчика клика к кнопкам:

<div @click="zoom(+1)">zoom in</div>
<div @click="zoom(-1)">zoom out</div>

Кнопкам назначаете абсолютное позиционирование, чтобы можно было над картой расположить. Ну и стилизуете их как-нибудь ещё, тут уже вам виднее. Например.

floor($value / 10) * 10

Потому что событие mouseout возникает, когда курсор уходит на какой-либо из вложенных элементов - в вашем случае это i. Замените mouseout на mouseleave. А ещё почитайте - будет нелишним.

function handler(e) {
  console.log('hello, world!!');
  this.removeEventListener(e.type, handler);
}

document.addEventListener('click', handler);

Но вообще, если вам нужен обработчик события, который сработает один раз, то вручную удалять его не надо, для этого есть отдельная настройка среди параметров addEventListener:

document.addEventListener('click', handler, { once: true });

В дочернем компоненте обрабатываете клик по кнопке удаления так: @click="$emit('remove')".

А в родительском компоненте подписываетесь на это событие: @remove="removeFromBasket(item)".

Можно сделать computed свойство - объект, где ключами будут dsec_nnn (вы их используете для генерации id строк, так что они, как я понял, уникальны), а значениями dsec_declarant_kind, изменения которых вас интересуют:

computed: {
  declarantKind() {
    return this.dsec.reduce((acc, n) => (
      acc[n.dsec_nnn] = n.dsec_declarant_kind,
      acc
    ), {});
  },
},

И отслеживать его - ищем ключ, который присутствует в текущем и предыдущем объектах, с разными значениями. Если нашли (если нет - значит, массив сортировался, или же элемент был удалён или добавлен новый), достаём соответствующий объект из массива исходных данных:

watch: {
  declarantKind(newVal, oldVal) {
    const [ key ] = Object
      .entries(newVal)
      .find(([ k, v ]) => oldVal.hasOwnProperty(k) && oldVal[k] !== v) || [];

    if (key) {
      const item = this.dsec.find(n => n.dsec_nnn === key);
      console.log('объект:', item);
      console.log(`было: ${oldVal[key]}`);
      console.log(`стало: ${newVal[key]}`);
    }
  },
},

modals.entries() судя по документации должен предоставить [key, value]

Нет, не должен. Он итератор возвращает, а не массив. Так что

[...modals.entries()].map(([ id, modal ]) => (

))