0xD34F

выводит не совсем то что мне надо

Вместо array.length надо крутить цикл до array.length - n + 1.

А вообще, цикл в явном виде не нужен:

const strangeChunks = (arr, chunkSize) => (
  chunkSize = Math.min(arr.length, Math.max(0, chunkSize)),
  Array.from(
    { length: Math.min(arr.length, 1 + arr.length - chunkSize) },
    (_, i) => arr.slice(i, i + chunkSize)
  )
);

console.log(strangeChunks([ 1, 2, 3, 4, 5, 6, 7 ], 4));
console.log(strangeChunks('abcdefg', 5));

(products.find(n => n.product.id === newProduct.id) ??
(products[products.length] = {
  product: { ...newProduct },
  count: 0,
})).count++;

const el = useRef();

useEffect(() => {
  const onClick = e => {
    const dropdown = e.target.closest('.dropdown');
    if (dropdown && dropdown !== el.current) {
      setIsVisible(false);
    }
  };

  document.addEventListener('click', onClick);

  return () => {
    document.removeEventListener('click', onClick);
  };
}, []);

<div className="dropdown" ref={el}>

data: () => ({
  columns: [
    { field: '...', label: '...' },
    { field: '...', label: '...' },
    ...
  ],
  focused: {},
  ...
}),
methods: {
  rowStyle(row) {
    return row === this.focused.record && {
      backgroundColor: 'red',
    };
  },
  cellStyle(row, cell) {
    return cell.name === this.columns[this.focused.colPos]?.field && {
      backgroundColor: 'orange',
    };
  },
},

<vue-excel-editor
  :row-style="rowStyle"
  :cell-style="cellStyle"
  @cell-focus="focused = $event"
  ...
>
  <vue-excel-column
    v-for="n in columns"
    v-bind="n"
    :key="n.field"
  />
</vue-excel-editor>

Помимо массива с данными держите в стейте ссылку на следующую страницу:

state: {
  pokemons: [],
  next: 'https://pokeapi.co/api/v2/pokemon',
},

Используйте её для запроса данных, при получении ответа не забывайте сохранять новую ссылку:

actions: {
  async fetchPokemons({ state, commit }) {
    const data = await fetch(state.next).then(r => r.json());

    commit('setPokemons', {
      pokemons: data.results,
      next: data.next,
    });
  }
},

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

<button
  :disabled="!$store.state.next"
  @click="$store.dispatch('fetchPokemons')"
>
  NEXT
</button>

https://jsfiddle.net/yb2seq6m/

Но вообще, никакая "следующая" страница тут не нужна. Храните номер текущей страницы и количество элементов на странице, исходя из этих данных самостоятельно вычисляйте значение параметра offset. Когда понадобится следующая - делаете +1 к текущей. Например.

Добавить блоку с текстом

white-space: nowrap;
position: absolute;

https://jsfiddle.net/b5koa7dm/

Добавляем в массив копию исходного объекта:

const defaultAnimals = {
  cat: '',
  dog: '',
  mouse: '',
  rhinoceros: '',
};

const animalsReducer = (state, action) => {
  switch (action.type) {
    case 'updateObj':
      return {
        ...state,
        obj: {
          ...state.obj,
          [action.payload.name]: action.payload.value,
        },
      };

    case 'addObjToArr':
      return {
        ...state,
        arr: [ ...state.arr, state.obj ],
        obj: defaultAnimals,
      };

    default:
      return state;
  }
};

const Animals = () => {
  const [ animals, dispatch ] = useReducer(animalsReducer, {
    obj: defaultAnimals,
    arr: [],
  });

  const onChange = ({ target: { name, value } }) => {
    dispatch({
      type: 'updateObj',
      payload: { name, value },
    });
  };
  
  const onSubmit = e => {
    e.preventDefault();
    dispatch({
      type: 'addObjToArr',
    });
  };

  return (
    <div>
      <form onSubmit={onSubmit}>
        {Object.entries(animals.obj).map(([ k, v ]) => (
          <div key={k}>
            <label>
              {k}:
              <input name={k} value={v} onChange={onChange} />
            </label>
          </div>
        ))}
        <button>Save</button>
      </form>
      <pre>{JSON.stringify(animals.obj, null, 2)}</pre>
      <pre>{JSON.stringify(animals.arr, null, 2)}</pre>
    </div>
  );
};

Или, добавляем в массив объект, содержащий значение только одного из свойств исходного объекта:

const animalsReducer = (state, action) => {
  switch (action.type) {
    case 'updateObj':
      return {
        ...state,
        obj: {
          ...state.obj,
          [action.payload.name]: action.payload.value,
        },
      };

    case 'addObjToArr':
      return {
        ...state,
        arr: [
          ...state.arr,
          {
            animal: action.payload,
            name: state.obj[action.payload],
          },
        ],
      };

    default:
      return state;
  }
};

const Animals = () => {
  const [ { obj, arr }, dispatch ] = useReducer(animalsReducer, {
    obj: {
      cat: '',
      dog: '',
      mouse: '',
      rhinoceros: '',
    },
    arr: [],
  });

  const onChange = ({ target: { name, value } }) => {
    dispatch({
      type: 'updateObj',
      payload: { name, value },
    });
  };
  
  const onSubmit = (e, animal) => {
    e.preventDefault();
    dispatch({
      type: 'addObjToArr',
      payload: animal,
    });
  };

  return (
    <div>
      {Object.entries(obj).map(([ k, v ]) => (
        <form onSubmit={e => onSubmit(e, k)} key={k}>
          {k}:
          <input name={k} value={v} onChange={onChange} />
          <button>Save</button>
        </form>
      ))}
      <pre>{JSON.stringify(obj, null, 2)}</pre>
      <pre>{JSON.stringify(arr, null, 2)}</pre>
    </div>
  );
};

[ ' '.join(sum(a, [])) ]

components: {
  componentName: () => import('...').then(component => {
    console.log(component.default.props);
    return component;
  }),
  ...
},

(entities[currentBrand] ?? []).map(n => (
  <ListItem>
    {n.icon}
    {n.label}
  </ListItem>
))

Рекурсия возможна:

const getFromTree = (tree, childrenKey, getter = n => n) =>
  Array.isArray(tree)
    ? tree.flatMap(n => [
        getter(n),
        ...getFromTree(n[childrenKey], childrenKey, getter),
      ])
    : [];

// или

function* flatTree(tree, childrenKey) {
  if (
    tree instanceof Object &&
    tree[Symbol.iterator] instanceof Function
  ) {
    for (const n of tree) {
      yield n;
      yield* flatTree(n[childrenKey], childrenKey);
    }
  }
}

Но не обязательна:

const getFromTree = function(tree, childrenKey, getter = n => n) {
  const result = [];

  for (const stack = this(tree); stack.length;) {
    const n = stack.pop();
    result.push(getter(n));
    stack.push(...this(n[childrenKey]));
  }

  return result;
}.bind(x => x instanceof Array ? [...x].reverse() : []);

// или

const flatTree = function*(tree, childrenKey) {
  const stack = [];

  for (let [ i, arr ] = this(tree); ++i < arr.length || stack.length;) {
    if (i === arr.length) {
      [ i, arr ] = stack.pop();
    } else {
      yield arr[i];
      stack.push([ i, arr ]);
      [ i, arr ] = this(arr[i][childrenKey]);
    }
  }
}.bind(x => [ -1, x?.constructor === Array ? x : [] ]);

Извлекаем:

// если использовать обычную функцию
const result = getFromTree(tree, 'evolves_to', n => n.species);
// или, генератор
const result = Array.from(flatTree(tree, 'evolves_to'), n => n.species);

Что если в carIds присутствуют такие значения, которых нет среди id в cars?

Если получать undefined для вас окей, тогда

const result = carIds.map(n => cars.find(m => m.id === n));

Если нет, то вместо отсутствующих объектов можно подставлять какое-нибудь дефолтное значение:

const result = carIds.map(function(n) {
  return this[n] ?? 'объект не найден';
}, Object.fromEntries(cars.map(n => [ n.id, n ])));

Или, есть вариант для несуществующих id ничего не получать:

const carsMap = new Map(cars.map(n => [ n.id, n ]));
const result = carIds.reduce((acc, n) => (
  (n = carsMap.get(n)) && acc.push(n),
  acc
), []);

Работает. Удалять только бывает нечего. С чего вы взяли, что позиции элементов и их id в массивах elementData и selectedElArr будут совпадать? Индекс надо не передавать в метод, а вычислять самостоятельно внутри:

methods: {
  toggleElement(id) {
    const index = this.selectedElArr.indexOf(id);
    if (index !== -1) {
      this.selectedElArr.splice(index, 1);
    } else {
      this.selectedElArr.push(id);
    }
  },
  ...

@click="toggleElement(data.id)"

const selectors = [ '.addservice', '.addprice' ];
const data = Array.from(
  document.querySelectorAll('.addserviceBlock'),
  n => selectors.map(m => n.querySelector(m).value)
);

Заголовки, элемент меню и классы для его пунктов:

const headers = document.querySelectorAll('section > h2');
const menu = document.querySelector('вам виднее, что тут должно быть');
const className = 'inner__menu anchor-js';

Собираем разметку:

const menuHTML = Array.from(headers, n =>
  `<a class="${className}" href="#${n.parentNode.id}">${n.innerText}</a>`
).join('');

// можем добавить новое содержимое, не трогая то, что уже есть
menu.insertAdjacentHTML('beforeend', menuHTML);
// или новый контент перезапишет существующий
menu.innerHTML = menuHTML;

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

const menuElements = Array.from(headers, n =>
  Object.assign(document.createElement('a'), {
    className,
    href: `#${n.parentNode.id}`,
    text: n.textContent,
  })
);

// добавляем
menu.append(...menuElements);
// перезаписываем
menu.replaceChildren(...menuElements);

const wrapper = document.createElement('div');
const start = block.querySelector('.start');
for (let el; !(el = start.nextElementSibling).matches('.end'); wrapper.appendChild(el)) ;
start.insertAdjacentElement('afterend', wrapper);

или

const wrapper = document.createElement('div');
const children = [...block.children];
const iStart = children.findIndex(n => n.classList.contains('start'));
const iEnd = children.findIndex(n => n.classList.contains('end'));
wrapper.append(...children.slice(iStart + 1, iEnd));
children[iStart].after(wrapper);

data.reduce((acc, { unique, id, count, name }) => (
  ((acc[unique] ??= { count })[id] ??= []).push(name),
  acc
), {})

Кого хотим достать: const key = 'TicketNumber';.

Достаём:

const val = str.match(RegExp(`(?<=[?;]${key}=)[^;#]*`))?.[0];

// или

const val = new URL(str.replaceAll(';', '&')).searchParams.get(key);

// или

const val = Object.fromEntries(str
  .split('?')
  .pop()
  .split('#')
  .shift()
  .split(';')
  .map(n => n.split('='))
)[key];

def find_outlier(arr):
  n0, n1, n2 = [ n % 2 for n in arr[:3] ]
  return next(n for n in arr if n % 2 != n0) if n0 == n1 else arr[int(n2 == n0)]