JavaScript метод shift()

Определение и применение

JavaScript метод shift() позволяет удалить первый элемент из массива (элемент с индексом 0) и возвратить его значение. Этот метод изменяет длину массива. Работу метода показывает пример «Как удалить первый элемент массива».

Для того, чтобы удалить последний элемент из массива и возвратить его значение вы можете воспользоваться методом pop().

Поддержка браузерами

Спецификация: ecma262

✓Поддерживается во всех основных браузерах с 2015 года.

Показать браузеры

ВсеКомпьютерыМобильные

Совместимостьjavascript.builtins.Array.shift

Возможность	Компьютеры					Мобильные
	ChromeChrome	EdgeEdge	FirefoxFirefox	OperaOpera	SafariSafari	Chrome AndroidChromeAndroid	Firefox for AndroidFirefoxAndroid	Opera AndroidOperaAndroid	Safari on iOSSafariiOS	Samsung BrowserSamsungAndroid	WebView AndroidWebViewAndroid	WebView on iOSWebViewiOS
shift	✓1	✓12	✓1	✓4	✓1	✓18	✓4	✓10.1	✓1	✓1.0	✓1	✓1

✓поддерживается◐с ограниченияминет поддержки?нет данных≤31 — не позднее версии 31

JavaScript синтаксис

array.shift();

Спецификация

ECMAScript: Array.prototype.shift.

Значения параметров

Параметров нет.

Возвращаемое значение

Значение удалённого первого элемента или undefined для пустого массива. Остальные элементы сдвигаются к началу, длина уменьшается.

Примеры, попробуйте сами

Как удалить первый элемент массива

Нажмите ▶, затем кнопку удаления в результате. Сравните первый удалённый элемент и оставшийся массив.

index.html

HTML

<button type="button" data-migration-click-0="">Удалить первый элемент</button>
<div id="test"></div>
<p id="return-value" aria-live="polite"></p>

main.js

JavaScript

var animals = ['Crocodile', 'Elephant', 'Tiger']
document.getElementById('test').textContent = animals.join(', ')
function myFunc() {
    var removed = animals.shift()
    document.getElementById('test').textContent = animals.join(', ')
    document.getElementById('return-value').textContent = 'Удалено: ' + String(removed)
}
document.querySelector('[data-migration-click-0]').addEventListener('click', myFunc)

В этом примере мы регистрируем обработчик события click, зарегистрированным через addEventListener() (вместо атрибута onclick) и при нажатии на кнопку (HTML элемент <button>) вызываем функцию myFunc(), которая с использованием JavaScript метода shift() удаляет первый элемент из массива, и с помощью свойства textContent добавляет новое содержимое массива в элемент <div> с глобальным атрибутом id test.

Обратите внимание, что метод удаляет именно элемент с индексом 0:

Как shift() обрабатывает пустые позиции

Измените индекс элемента и запустите код. Сравните длину, наличие индексов и возвращаемое значение каждого shift().

index.html

HTML

<p>Результат выполнения выводится в консоль.</p>

main.js

JavaScript

const values = []
values[2] = 2
console.log('Исходная длина:', values.length)
console.log('Есть индекс 0:', 0 in values)
while (values.length > 0) {
    console.log('Удалено:', values.shift(), 'Осталось:', values.length)
}
console.log('Из пустого массива:', values.shift())