Метод push()
додає один або більше елементів у кінець масиву та повертає нову довжину масиву.
Джерело цього інтерактивного прикладу зберігається у репозіторії на GitHub. Якщо ви бажаєте залучитися до проекту зі створення інтерактивних прикладів, будь ласка, скопіюйте це посилання https://github.com/mdn/interactive-examples та надішліть нам pull request.
Синтаксис
arr.push(element1[, ...[, elementN]])
Параметри
elementN
- Елементи, що додаються у кінець масиву.
Повернене значення
Нова length
властивість об'єкта, на якому був визваний цей метод.
Опис
Метод push
додає значення у масив.
push
було навмисно створено загальним методом. Він може використовуватися з call()
або apply()
на об'єктах, подібних до масивів. Метод push
спирається на властивість length
, щоб розуміти, з якого місця починати додавання заданих значень. Якщо властивість length
неможливо перетворити на число, використовується індекс рівний 0. До цього також належить випадок, коли властивості length
взагалі не існує, y цьому разі length
також буде створено.
Хоча strings - це найближчі, масивоподібні об'єкти, з ними неможливо використовувати цей метод, оскільки рядки є незмінними. Аналогічно до найближчого, масивоподібного об'єкта arguments.
Приклади
Додавання елементів у масив
Наступний приклад створює sports
масив з двома елементами, потім у нього додаються еще два елементи. Змінна total
містить нову довжину масиву.
var sports = ['soccer', 'baseball']; var total = sports.push('football', 'swimming'); console.log(sports); // ['soccer', 'baseball', 'football', 'swimming'] console.log(total); // 4
Поєднання двох масивів
Цей приклад використовує apply()
для того, щоб запушити усі елементи з другого масиву.
Не використовуйте цей метод, якщо другий масив (moreVegs
у цьому прикладі) занадто великий, оскільки максимальна кількість параметрів, які може вмістити одна функція обмежена, як доводить це практика. Дивиться apply()
для отримання більш докладної інформації.
var vegetables = ['parsnip', 'potato']; var moreVegs = ['celery', 'beetroot']; // Merge the second array into the first one // Equivalent to vegetables.push('celery', 'beetroot'); Array.prototype.push.apply(vegetables, moreVegs); console.log(vegetables); // ['parsnip', 'potato', 'celery', 'beetroot']
Використання об'єкта у масивоподібний спосіб
Як зазначено вище, push
було навмисно створено загаліним методом, і це може зіграти нам на користь. Array.prototype.push
добре працює на об'єктах, як це показує наш приклад. Зауважте, що ми не створюємо масив для зберігання колекції об'єктів. Натомість ми зберігаємо колекцію у самому об'єкті та використовуємо метод call
на Array.prototype.push
, щоб змусити його думати, начебто ми використовуємо його на масиві, і це працює, завдяки тому, що JavaScript дозволяє нам встановлювати контекст використання, як нам зручно.
var obj = { length: 0, addElem: function addElem(elem) { // obj.length is automatically incremented // every time an element is added. [].push.call(this, elem); } }; // Let's add some empty objects just to illustrate. obj.addElem({}); obj.addElem({}); console.log(obj.length); // → 2
Зверніть увагу, що obj
хоч і не є масивом, метод push
успішно збільшив його властивість length
так само, наче б ми мали справу зі справжнім масивом.
Специфікації
Специфікації | Статус | Коментар |
---|---|---|
ECMAScript 3rd Edition (ECMA-262) | Standard | Початкове визначення. Реалізоване в JavaScript 1.2. |
ECMAScript 5.1 (ECMA-262) The definition of 'Array.prototype.push' in that specification. |
Standard | |
ECMAScript 2015 (6th Edition, ECMA-262) The definition of 'Array.prototype.push' in that specification. |
Standard | |
ECMAScript Latest Draft (ECMA-262) The definition of 'Array.prototype.push' in that specification. |
Draft |
Сумісність з браузерами
Desktop | Mobile | Server | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
push | Chrome Full support 1 | Edge Full support 12 | Firefox Full support 1 | IE Full support 5.5 | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support 18 | Firefox Android Full support 4 | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes | nodejs Full support Yes |
Legend
- Full support
- Full support