0xD34F

const className = 'класс элементов, чьи id вам надо получить';

Как получить элементы, зная их класс:

const elems = document.querySelectorAll(`.${className}`);
// или
const elems = document.getElementsByClassName(className);

Как извлечь из элемента его id:

const getId = el => el.id;
// или
const getId = el => el.getAttribute('id');
// или
const getId = el => el.attributes.id.value;

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

const ids = Array.from(elems, getId);

// или

const ids = Array.prototype.map.call(elems, getId);

// или

const ids = [];
for (const n of elems) {
  ids.push(getId(n));
}

// или

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

// или

const ids = (function get(i, n = elems.item(i)) {
  return n ? [ getId(n), ...get(i + 1) ] : [];
})(0);

Удаляется где надо, проблема в том, что вы разделили данные со значениями селектов и их id. Одно удаляете, а другое остаётся. Храните значение в том же объекте, что и id. Т.е., вырезаете selectField, а v-model="selectField[index]" заменяете на v-model="item.value", например, а selectField.includes(name) на conditionList.some(n => n.value === name).

бибилиотека react-yandex-maps не имеет такой функциональности

Функциональность имеет - ведь это никакая не библиотека, а обёртка над картами.

const result = Object.values(arr.reduce((acc, n) => (
  acc[n.id] = n.checked ? n : (acc[n.id] || n),
  acc
), {}));

или, с сохранением порядка:

const result = arr.reduce((acc, n) => {
  const i = acc.findIndex(m => m.id === n.id);
  if (!~i || (!acc[i].checked && n.checked)) {
    acc.push(n);
    if (~i) {
      acc.splice(i, 1);
    }
  }
  return acc;
}, []);

// или

const result = Object
  .values(arr.reduce((acc, n, i) => (
    (!acc[n.id] || (!acc[n.id][0].checked && n.checked)) && (acc[n.id] = [ n, i ]),
    acc
  ), {}))
  .sort((a, b) => a[1] - b[1])
  .map(n => n[0]);

Точно так же, как и без vue - смотрите на event.target, действуете по обстоятельствам:

https://jsfiddle.net/rdcem751/

Непонятно, действительно ли вам надо модифицировать исходные данные. Если да, тогда делайте watch на checkedRows, где будете проверять наличие свойства в выбранных объектах и добавлять его в случае отсутствия. Если нет - делаете computed свойство, основанное на checkedRows, где будет создаваться массив с копиями выбранных объектов, дополненными нужными свойствами.

О каких элементах идёт речь:

const elements = document.querySelectorAll('.buy');

Как добраться до текста внутри элемента:

const getText = el => el.querySelector(':scope > i').textContent;

// или

const getText = el => el.children[0].innerText;

Скрываем дубликаты:

[...elements].forEach((n, i, a) => {
  n.style.display = n === a.find(m => getText(m) === getText(n))
    ? 'block'
    : 'none';
});

или

const grouped = Array
  .from(elements, n => [ n, getText(n) ])
  .reduce((acc, n) => ((acc[n[1]] = acc[n[1]] || []).push(n[0]), acc), {});

Object.values(grouped).forEach(n => n.forEach((m, i) => m.hidden = !!i));

или

.hidden {
  display: none;
}

elements.forEach(function(n) {
  const t = getText(n);
  n.classList.toggle('hidden', this.has(t) || !this.add(t));
}, new Set);

people.filter((n, i, a) => n.country && i === a.findIndex(m => m.country === n.country))

или

people.filter(n => n.country && n === people.find(m => m.country === n.country))

или

people.filter(function({ country: n }) {
  return n && !(this[n] = this.hasOwnProperty(n));
}, {})

или

Object.values(people.reduce((acc, n) => (n.country && (acc[n.country] = n), acc), {}))

или

[...people.reduce((acc, n) => n.country ? acc.set(n.country, n) : acc, new Map).values()]

или

Array.from(
  new Set(people.map(n => n.country).filter(Boolean)),
  n => people.find(m => m.country === n)
)

const block = document.querySelector('.block');
const inputSelector = 'input[type="number"]';

const toggleBlock = () =>
  block.style.display = Array
    .from(document.querySelectorAll(inputSelector))
    .some(n => n.value && +n.value > +n.min)
      ? 'block'
      : 'none';

document.addEventListener('input', e => e.target.matches(inputSelector) && toggleBlock());
toggleBlock();

// или

const inputs = document.querySelectorAll(inputSelector);
const toggleBlock = () =>
  block.hidden = Array.prototype.every.call(
    inputs,
    n => !n.value || +n.value <= +n.min
  );

inputs.forEach(n => n.addEventListener('input', toggleBlock));
toggleBlock();

if ( typeof arr[i] === 'number' ) {
 		x*= arr[i];

А что если arr[i + 1] окажется строкой? Сначала надо проверить всё, а уже потом вычислять (если потребуется) объединённое значение.

Вариант раз - перебираем массив отдельно для каждого из проверяемых типов данных:

function bullshit(arr) {
  if (arr.length) {
    if (arr.every(n => n === `${n}`)) {
      return ''.concat(...arr);
    }

    if (arr.every(n => n === +n)) {
      return eval(arr.join('*'));
    }
  }

  return null;
}

Вариант два - считаем, сколько значений каких типов есть в массиве:

function bullshit(arr) {
  const count = arr.reduce((acc, n) => {
    const type = typeof n;
    acc[type] = (acc[type] || 0) + 1;
    return acc;
  }, {});

  switch (arr.length) {
    case count.string: return arr.join('');
    case count.number: return arr.reduce((acc, n) => acc * n, 1);
    default: return null;
  }
}

const result = Object
  .entries(obj)
  .sort((a, b) => a[0] - b[0])
  .reduce((acc, [ k, v ], i, a) => (
    i && !(-~a[~-i][0] - k) || (acc[0][acc[1] = k] = 0),
    acc[0][acc[1]] += v,
    acc
  ), [ {} ])[0];

Прочитать ошибку, понять, что там сказано, перестать пытаться совать объекты куда не надо.

Фигурные скобки убрать:

return { actionList };

const result = obj.people.filter(function(n) {
  return n.data && this.some(m => m.every(([ k, v ]) => n.data[k] === v));
}, arr.map(Object.entries));

Получаем один класс:

const className = Array
  .from(element.classList)
  .find(n => n.startsWith(classNamePrefix));

Получаем все, что есть:

const classNames = Array.prototype.filter.call(
  element.classList,
  n => !n.indexOf(classNamePrefix)
);

$('.wrap').on('input', function(e) {
  const valid = $(this).find('.valid').get().map(el => {
    if (el === e.target) {
      $(el).toggleClass('empty', !el.value);
    }

    return el.value;
  }).every(Boolean);

  $('.btn')
    .toggleClass('btn--isvalid', valid)
    .toggleClass('btn--novalid', !valid);
});

Вопрос - правильный ли такой подход?

Ну раз вы намерены использовать vue - в корне неверный. Говоря "объект", вы имеете в виду элемент DOM-дерева, тогда как vue предполагает первичность данных. Например - вроде бы сделано ровно по вашему описанию, но обратите внимание, что в основе данные, а не разметка - элементы создаются на основе массивов, элементы не модифицируются непосредственно, вместо этого изменяется содержимое массива.

Не выдумывайте, всё переопределяется. Просто вы этого не видите, потому что элемент с переопределённым стилем целиком скрыт вложенными элементами. Если сделать так, чтобы вложенные элементы занимали более ограниченную площадь (строчные вместо блочных, например), или сделать их частично прозрачными (тот же background, например), станет очевидным, что элемент .text был успешно стилизован.

После подключения обработчиков событий, генерируйте само событие, типа $('.form-group').trigger('input').

https://jsfiddle.net/4Lg53bs8/

$pow = ceil(count($array) / 2);
$arr = array_map(function($n) use($sum, &$pow) {
  $pow -= 1;
  return $sum * (1 + (1 - (2 ** -abs($pow))) * ($pow < 0 ? -1 : 1));
}, $array);