0xD34F

Нехорошее решение - хранить в корзине сумму. Из-за этого вы при удалении элемента не можете правильно определить, сколько надо вычесть. Лучше так - хранить не сумму, а сами элементы. Когда сумма понадобится - посчитать её. Например.

const result = [];
for (const n of elements) {
  if (!used.some(m => m.id === n.id)) {
    result.push(n);
  }
}

или

const result = [];

COLLECT_OBJECTS:
for (let i = 0; i < elements.length; i++) {
  for (let j = 0; j < used.length; j++) {
    if (elements[i].id === used[j].id) {
      continue COLLECT_OBJECTS;
    }
  }
  result[result.length] = elements[i];
}

или

const result = elements.filter(function(n) {
  return !this.has(n.id);
}, new Set(used.map(n => n.id)));

или

const result = (function get(ids, i, n = elements[i]) {
  return n
    ? [].concat(ids.includes(n.id) ? [] : n, get(ids, -~i))
    : [];
})(used.map(n => n.id), 0);

или

const result = [...used.reduce(
  (acc, n) => (acc.delete(n.id), acc),
  new Map(elements.map(n => [ n.id, n ]))
).values()];

Например:

$.getJSON('https://api.cdnjs.com/libraries/jquery', function(data) {
  $('body').append(`<pre>${JSON.stringify(data, null, 2)}</pre>`);
});

Или, если вам непременно список нужен, можно так:

const toHTML = val =>
  val instanceof Object
    ? `<ul>${Object.values(val).map(n => `
         <li>${toHTML(n)}</li>`).join('')}
       </ul>`
    : val;

fetch('https://api.cdnjs.com/libraries/jquery')
  .then(r => r.json())
  .then(r => document.body.insertAdjacentHTML('beforeend', toHTML(r)));

Метод handleCartPriceChange, замените

this.setState({ price: this.state.price + price, title: [this.state.title+title]});

на

this.setState({
  price: this.state.price + price,
  title: this.state.title.concat(title)
});

str_replace($alphabet, array_keys($alphabet), $str)

И вы явно что-то в своём алфавите пропустили - в вашем примере 'к' это 10, а должно быть 11. Забыли про 'ё'?

<button class="btn" data-hover-text="hello, world!!"></button>

.btn {
  border: 0;
  background: green;
  display: inline-block;
  width: 3em;
  height: 3em;
  border-radius: 1.5em;
  overflow: hidden;
  transition: width 0.2s linear;
}

.btn::before {
  display: inline-flex;
  width: 100%;
  height: 100%;
  color: white;
  justify-content: center;
  align-items: center;
  white-space: nowrap;
  transition: letter-spacing 0.2s linear;
  letter-spacing: -2px;
  content: ">";
}

.btn:hover {
  width: 10em;
}

.btn:hover::before {
  letter-spacing: 0px;
  content: attr(data-hover-text);
}

https://jsfiddle.net/gbzcsuo2/

const type = document.querySelector('#type');
const price = document.querySelector('#price');

const minPrices = {
  bungalo: 0,
  flat: 1000,
  house: 5000,
  palace: 10000,
};

type.addEventListener('change', function() {
  const minPrice = minPrices[this.value];
  price.min = minPrice;
  price.value = Math.max(minPrice, price.value);
});

type.dispatchEvent(new Event('change'));

Наверное, вместо

this.setState({price});

должно быть что-то вроде

this.setState({ price: this.state.price + price });

И дефолтное значение price - почему пустая строка? Такой суммы не бывает. Бывает 0.

rebase

Никаких событий тут нет. Генерируйте нужное после установки значения вручную:

$(input).val(...).trigger('change');

Что сейчас происходит: нажали на элемент списка, фокус на input'е потерялся, по соответствующему событию список закрылся, отжали кнопку мыши, наконец-то событие клика случилось, но, так как списка уже нет, клик получается по элементу, который скрывался за списком, так что обработчик клика по элементу списка не срабатывает.

Вместо клика обрабатывайте нажатие кнопки мыши, вместо

$('body').on('click', '.help'

пусть будет

$('body').on('mousedown', '.help'

Просто динамически задаёте класс:

<input :class="а здесь выражение, определяющее, какие классы будут добавлены">

Несколько примеров того, как это может выглядеть.

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

function maxZeroSequence(arr) {
  let iMin = 0;
  let iMax = 0;

  for (let i = 0; i < arr.length; i++) {
    let sum = 0;

    for (let j = i; j < arr.length; j++) {
      if ((sum += arr[j]) === 0 && (iMax - iMin) <= (j - i + 1)) {
        iMin = i;
        iMax = j + 1;
      }
    }
  }

  return arr.slice(iMin, iMax);
}

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

function maxZeroSequence(arr) {
  const sumIndices = Object.values(arr.reduce((acc, n, i) => {
    const sum = acc[0] += n;
    (acc[1][sum] = acc[1][sum] || [ i + 1 ])[1] = i + 1;
    return acc;
  }, [ 0, { 0: [ 0 ] } ])[1]);

  return arr.slice(...sumIndices.reduce((max, n) => {
    const diff1 = n[1] - n[0];
    const diff2 = max[1] - max[0];
    return diff1 > diff2 || (diff1 === diff2 && n[0] > max[0]) ? n : max;
  }, [ 0, 0 ]));
}

Коротко: const obj = Object.assign({}, ...arr);.

Длинно:

const obj = {};

for (let i = arr.length; i--;) {
  for (const k in arr[i]) {
    if (arr[i].hasOwnProperty(k) && !obj.hasOwnProperty(k)) {
      obj[k] = arr[i][k];
    }
  }
}

const cities = [ 'Москва', 'Санкт-Петербург', 'Севастополь' ];
if (cities.includes(geolocation.city)) {
  ...

Name должна падать в массив labels

Сделайте watcher для choosenMetabolit, что-то вроде

watch: {
  choosenMetabolit(val) {
    this.anMetProfData.labels.push(val.name);
  },
},

а result_1, 2 и 3 имели путь datasets[0, 1 или 2]. data

А вот эту фразу я не уверен что понял. "Имели путь" - в смысле значения result'ов записывались в соответствующие массивы data объектов, лежащих в datasets? Тогда можно дополнить watcher как-то так:

watch: {
  choosenMetabolit(val) {
    const data = this.anMetProfData;
    const sets = data.datasets;

    data.labels.push(val.name);
    sets[0].data.push(val.result_1);
    sets[1].data.push(val.result_2);
    sets[2].data.push(val.result_3);
  },
},

Вижу два варианта:

1. Разделить колонку на три - в первой отображать целую часть, во второй разделитель, в третьей дробную часть. Первая колонка выравнивается по правой стороне, третья по левой.

2. Задать моноширинный шрифт и добавить пробелов слева.

А к чему такие сложности со сменой подсказки? Достаточно просто указать формат номера документа (как-то так) - люди не дураки, сами разберутся, что после чего вводить.

Перенесите active из NavLink в Nav (кстати, а что там после этого останется? - да ничего, кроме рендеринга a, которому прокидываются props без изменений; получается, что не так уж и нужен этот компонент, проще создавать этот a сразу в Nav), и хранить в нём индекс активного элемента:

state = {
  active: null,
  ...
}

setActive(active) {
  this.setState({ active });
}

{this.state.items.map((n, i) => (
  <li>
    <NavLink
      href="#"
      className={this.state.active === i ? 'active' : ''}
      onClick={() => this.setActive(i)}
    >
      {n}
    </NavLink>
  </li>
))}

<div class="slider-wrapper">
  <button data-step="-1">-</button>
  <div class="slider"></div>
  <button data-step="+1">+</button>
</div>

$('.slider').slider({ /* настройки слайдера */ });

$('.slider-wrapper [data-step]').button().click(function() {
  const $slider = $(this).closest('.slider-wrapper').find('.ui-slider');
  const step = +this.dataset.step;
  const { min, max, value } = $slider.slider('option');

  $slider.slider('option', 'value', Math.max(min, Math.min(max, +value + step)));
});

https://jsfiddle.net/142touep/