Сортировка и изменение массивов: sort, push/pop, slice/splice

Изменение и сортировка массивов в JavaScript: sort, push, pop, shift, unshift, slice, splice — методы, которые модифицируют массив или создают его копию.

Одни методы изменяют массив на месте (мутируют), другие возвращают новый массив, не трогая исходный. Важно понимать это различие, чтобы избегать неожиданных побочных эффектов.

push и pop — работа с концом

push добавляет один или несколько элементов в конец и возвращает новую длину. pop удаляет последний элемент и возвращает его.

const stack = [1, 2, 3];

stack.push(4, 5);
console.log(stack);    // [1, 2, 3, 4, 5]

const last = stack.pop();
console.log(last);     // 5
console.log(stack);    // [1, 2, 3, 4]

Вывод:

[1, 2, 3, 4, 5]
5
[1, 2, 3, 4]

shift и unshift — работа с началом

shift удаляет первый элемент и возвращает его. unshift добавляет элементы в начало. Оба мутируют массив.

const queue = ['а', 'б', 'в'];

const first = queue.shift();
console.log(first);   // а
console.log(queue);   // ['б', 'в']

queue.unshift('я', 'э');
console.log(queue);   // ['я', 'э', 'б', 'в']

Вывод:

а
['б', 'в']
['я', 'э', 'б', 'в']

slice — извлечь фрагмент (без мутации)

slice(start, end) возвращает новый массив с элементами от start до end (не включая end). Исходный массив не изменяется.

const letters = ['а', 'б', 'в', 'г', 'д'];

console.log(letters.slice(1, 4));  // ['б', 'в', 'г']
console.log(letters.slice(-2));    // ['г', 'д'] — с конца
console.log(letters.slice());      // копия всего массива
console.log(letters);              // ['а', 'б', 'в', 'г', 'д'] — не изменился

Вывод:

['б', 'в', 'г']
['г', 'д']
['а', 'б', 'в', 'г', 'д']
['а', 'б', 'в', 'г', 'д']

splice — вставка и удаление (мутация)

splice(start, deleteCount, ...items) изменяет массив: удаляет deleteCount элементов начиная с start и вставляет items. Возвращает массив удалённых элементов.

const months = ['янв', 'фев', 'апр', 'май'];

// вставить 'мар' на позицию 2, ничего не удаляя
months.splice(2, 0, 'мар');
console.log(months); // ['янв', 'фев', 'мар', 'апр', 'май']

// удалить два элемента начиная с индекса 1 и вставить замену
const removed = months.splice(1, 2, 'ФЕВ', 'МАР');
console.log(removed); // ['фев', 'мар']
console.log(months);  // ['янв', 'ФЕВ', 'МАР', 'апр', 'май']

Вывод:

['янв', 'фев', 'мар', 'апр', 'май']
['фев', 'мар']
['янв', 'ФЕВ', 'МАР', 'апр', 'май']

sort — сортировка

sort сортирует массив на месте. По умолчанию элементы сравниваются как строки, что даёт неожиданный результат для чисел. Для корректной сортировки передают функцию сравнения.

// строковая сортировка по умолчанию — осторожно с числами!
const nums = [10, 1, 21, 2];
nums.sort();
console.log(nums); // [1, 10, 2, 21] — неверно для чисел!

// числовая сортировка
nums.sort((a, b) => a - b);
console.log(nums); // [1, 2, 10, 21]

// по убыванию
nums.sort((a, b) => b - a);
console.log(nums); // [21, 10, 2, 1]

Вывод:

[1, 10, 2, 21]
[1, 2, 10, 21]
[21, 10, 2, 1]

Сортировка объектов по полю:

const people = [
  { name: 'Вика', age: 28 },
  { name: 'Аня', age: 22 },
  { name: 'Боря', age: 35 },
];

people.sort((a, b) => a.age - b.age);
people.forEach(p => console.log(`${p.name}: ${p.age}`));

Вывод:

Аня: 22
Вика: 28
Боря: 35

Справочная таблица

Коротко

• push/pop работают с концом массива, shift/unshift — с началом.
• splice удаляет и вставляет элементы; slice возвращает копию фрагмента без мутации.
• sort сортирует на месте; для чисел нужна функция сравнения (a, b) => a - b.