Array#unshift mutates the array and returns the new length of the array.


For getting a new array, you could use Array#concat

return [static_stat].concat(api_data);

or take a new array with spreaded items.

return [static_stat, ...api_data];
Answer from Nina Scholz on Stack Overflow
🌐
Zapier
community.zapier.com › featured-articles-65 › add-remove-items-in-an-array-with-push-pop-shift-unshift-14074
Add/remove items in an array with Push, Pop, Shift, Unshift | Zapier Community
February 11, 2022 - let Set = inputData.Set.split(","); // creates array by splitting Input Data variable at commas let Item = inputData.Item; Set.unshift(Item); output = [{Item, Set}];
🌐
GeeksforGeeks
geeksforgeeks.org › javascript › what-is-the-difference-between-unshift-and-push-method-in-javascript
What is the difference between unshift() and Push() method in JavaScript? - GeeksforGeeks
July 23, 2025 - Javascript Array unshift() method: The JavaScript Array unshift() Method is used to add one or more elements to the beginning of the given array.
Discussions

javascript: unshift an object to an array of object - Stack Overflow
For getting a new array, you could use Array#concat ... Sign up to request clarification or add additional context in comments. ... Yes, you are right. The unshift() method adds one or more elements to the beginning of an array and returns the new length of the array. More on stackoverflow.com
🌐 stackoverflow.com
Basic JavaScript - Manipulate Arrays With unshift Method
Your code so far // Setup const ... x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/115.0.0.0 Safari/537.36 Challenge: Basic JavaScript - Manipulate Arrays With unshift Method Link to the challenge:... More on forum.freecodecamp.org
🌐 forum.freecodecamp.org
0
August 22, 2023
The four common Javascript array methods Push, Pop, Shift and Unshift
Great article! I think it’s important to note that working with the end of the array (push/pop) is more performant than the beginning (shift/unshift). The reason for this is that the array is indexed, so adding to the end of the array doesn’t require any additional time. Shift/unshift though require the whole array to be reindexed since you’re adding to the beginning. Performance isn’t important while you’re learning, and really only matters with large arrays, but it is a good concept to get used to early on. In programming, that’s noted with something called big O notation, which is just a formalized way to loosely note what’s going on in the code. Push/pop are what’s known as O(1)—pronounced “O of 1”—which means that it’s constant time, or the time of the method will always take the same amount of time no matter the length of the array. Shift/unshift are O(n)—pronounced “O of n”—which means that the length of time it takes depends on the number of items in the array. This isn’t to say that shift/unshift are bad. They are useful! Use them as you will. Write first, and then optimize later. More on reddit.com
🌐 r/learnjavascript
3
11
May 16, 2020
Better performing alternative to Array.unshift
Adding things to the front of an array is slower than adding something to the end because it has to shift all the other elements in the array back by one. When you add something to the end, nothing else has to change. So if you can change your code to add to the end instead, that would be better. But this is also one of those micro-optimizations that you probably won't see an impact from unless dealing with large arrays in a hot code path. More on reddit.com
🌐 r/learnjavascript
14
1
December 7, 2022
🌐
W3Schools
w3schools.com › jsref › jsref_unshift.asp
JavaScript Array unshift() Method
Array[ ] Array( ) at() concat() constructor copyWithin() entries() every() fill() filter() find() findIndex() findLast() findLastIndex() flat() flatMap() forEach() from() includes() indexOf() isArray() join() keys() lastIndexOf() length map() of() pop() prototype push() reduce() reduceRight() rest (...) reverse() shift() slice() some() sort() splice() spread (...) toReversed() toSorted() toSpliced() toString() unshift() values() valueOf() with() JS Boolean
🌐
MDN Web Docs
developer.mozilla.org › en-US › docs › Web › JavaScript › Reference › Global_Objects › Array › unshift
Array.prototype.unshift() - JavaScript | MDN
Then, it sets each index starting at 0 with the arguments passed to unshift(). Finally, it sets the length to the previous length plus the number of prepended elements. ... const arrayLike = { length: 3, unrelated: "foo", 2: 4, }; Array.prototype.unshift.call(arrayLike, 1, 2); console.log(arrayLike); // { '0': 1, '1': 2, '4': 4, length: 5, unrelated: 'foo' } const plainObj = {}; // There's no length property, so the length is 0 Array.prototype.unshift.call(plainObj, 1, 2); console.log(plainObj); // { '0': 1, '1': 2, length: 2 }
🌐
Medium
rehmat-sayany.medium.com › optimizing-javascript-array-manipulation-avoiding-unshift-for-better-performance-fa920f5a5a03
Avoiding unshift() for Better Performance in Javascript | by Rehmat Sayany | Medium
October 22, 2024 - While this code may seem simple, it’s highly inefficient for large arrays. Let’s explore why. Memory Overhead: whenever unshift() is called, it shifts all the elements of the array one index to the right, creating a copy of the array. This can cause significant memory overhead, especially when the array is large.
🌐
DEV Community
dev.to › justtanwa › javascript-array-methods-shift-unshift-push-and-pop-1fgi
JavaScript Array Methods - Shift, Unshift, Push and Pop - DEV Community
April 5, 2022 - const rainbowColors = ["red", "orange", ... "yellow", "green", "blue", "indigo", "violet"] The .pop() method removes and returns the element at the end of the array....
Find elsewhere
🌐
Scaler
scaler.com › home › topics › javascript array unshift() method
JavaScript Array unshift() Method - Scaler Topics
February 23, 2024 - Array.unshift() is a JavaScript method that adds one or more elements to the beginning of an array and returns the new length of the array. It modifies the original array rather than creating a new one.
🌐
Bennadel
bennadel.com › blog › 1796-javascript-array-methods-unshift-shift-push-and-pop.htm
Javascript Array Methods: Unshift(), Shift(), Push(), And Pop()
April 21, 2020 - This was a very usefull information, it really helped. I used unshift() and pop() to force a dynamically changing array adher to to a fixed size.
🌐
Bennadel
bennadel.com › blog › 2300-creating-a-javascript-shim-for-array-unshift-method.htm
Creating A JavaScript Shim For Array Unshift() Method
April 21, 2020 - Since splice() can be used to both delete and insert items, unshift() can be thought of as splicing values onto the front of an array. When we run the above code, we get the following console output: Unshifting.... ["Begin1", "Begin2", "End1", "End2"] As you can see, this works quite nicely. Necessary or not, this was a fun little snippet of code to write. The splice() method is incredibly powerful, which is why I tend to think of it. If you ever read JavaScript: The Good Parts by Douglas Crockford, you'll actually see a number of Array methods that can be reproduced using the splice() method.
🌐
Meticulous
meticulous.ai › blog › javascript-unshift-complete-guide
JavaScript Unshift | In-Depth Guide & Tutorial
Unshift is a method for adding elements to the beginning of an array or an object resembling an array. It's one of the most commonly used JavaScript methods when dealing with arrays and has the signature of unshift(element1, element2... elementN).
🌐
GeeksforGeeks
geeksforgeeks.org › javascript › javascript-array-unshift-method
JavaScript Array unshift() Method - GeeksforGeeks
July 15, 2024 - JavaScript Array unshift() Method is used to add one or more elements to the beginning of the given array.
🌐
freeCodeCamp
forum.freecodecamp.org › javascript
Basic JavaScript - Manipulate Arrays With unshift Method - JavaScript - The freeCodeCamp Forum
August 22, 2023 - Tell us what’s happening: Describe your issue in detail here. Your code so far // Setup const myArray = [["John", 23], ["dog", 3]]; myArray.shift(); // Only change code below this line myArray.unshift[("Paul" , 35)];…
🌐
Reddit
reddit.com › r/learnjavascript › the four common javascript array methods push, pop, shift and unshift
r/learnjavascript on Reddit: The four common Javascript array methods Push, Pop, Shift and Unshift
May 16, 2020 -

Javascript has a number of methods related to arrays which allow programmers to perform various array operations. There are four methods which are particularly used for adding and removing elements to and from an array. They are: push(), pop(), shift() and unshift(). For an experienced as well as new programmers, its likely to sometimes get confused how each of them work and which one to use in which situation. Thus, in this article, we have tried to simplify the concept with pictures and examples. Let's start exploring them one by one. Then we will compare their similarities and differences. Please look at the pictures too for better understanding.

https://foxbits.dev/article/four-common-javascript-array-methods-push-pop-shift-and-unshift/15

🌐
Programiz
programiz.com › javascript › library › array › unshift
JavaScript Array unshift()
// add "JavaScript" at the beginning of the array languages.unshift("JavaScript"); console.log(languages); // Output: [ 'JavaScript', 'Java', 'Python', 'C' ]
🌐
Edureka
edureka.co › blog › unshift-javascript-array-method
Unshift JavaScript | Unshift() Array Methods in JavaScript | Edureka
October 22, 2024 - Whenever an addition takes place with the “unshift()” method, the indices of the original array elements increase by a factor of 1. With this, we have come to the end of our article. I hope you understood unshift JavaScript method works in Array.
🌐
CodingNomads
codingnomads.com › javascript-array-unshift-shift-pop-push
JavaScript Array Essentials: Using pop, push, shift, and unshift
Next, the shift() method is used, which removes the first element ("purple") from the array, reverting it back to its original form: ["red", "blue", "green"]. The names "shift" and "unshift" are relatively unique to JavaScript, however, they do describe the actions being performed on the array - one "shifts" elements out of the array, while the other "unshifts" or pushes elements into the array from the start.
🌐
Reddit
reddit.com › r/learnjavascript › who thought "unshift()" was a good name? why?
r/learnjavascript on Reddit: Who thought "unshift()" was a good name? Why?
December 20, 2023 -

EDIT: This is just venting, not confusion on how the word is technically used by JS :D

OK, this is why I keep starting and stopping learning JS- reserved words with extremely unrelated English meanings. "Unshift" means a previous shift occurred. That's the only meaning for it in English. But JS decided to use it as a prepend array method. Argh!!

That is all...

Top answer
1 of 1
64

To understand this, there needs to be some knowledge about how a Stack (in JavaScript, an Array) is designed in computer science and is represented within your RAM/memory. If you create a Stack(an Array), essentially you are telling the system to allocate a space in memory for a stack that eventually can grow.

Now, every time you add to that Stack (with push), it adds to the end of that stack. Eventually the system sees that the Stack isn't going to be big enough, so it allocates a new space in memory at oldstack.length*1.5-1 and copies the old information to the new space. This is the reason for the jumps/jitters in your graph for push that otherwise look flat/linear. This behavior is also the reason why you always should initialize an Array/Stack with a predefined size (if you know it) with var a = new Array(1000) so that the system doesn't need to "newly allocate memory and copy over".

Considering unshift, it seems very similar to push. It just adds it to the start of the list, right? But as dismissive this difference seems, its very big! As explained with push, eventually there is a "allocate memory and copy over" when size runs out. With unshift, it wants to add something to the start. But there is already something there. So it would have to move the element at position N to position N+1, N1 to N1+1, N2 to N2+1 etc. Because that is very inefficient, it actually just newly allocates memory, adds the new Element and then copies over the oldstack to the newstack. This is the reason why your graph has more a quadratic or even slightly exponential look.

To conclude:

  • push adds to the end and rarely needs reallocate memory + copy over.

  • unshift adds to the start and always needs to reallocate memory and copy data over

/edit: regarding your questions why this isn't solved with a "moving index" is the problem when you use unshift and push interchangeably, you would need multiple "moving indexes" and intensive computing to figure out where that element at index 2 actually resides in memory. But the idea behind a Stack is to have O(1) complexity.

There are many other data structures that have such properties (and more features) but at a tradeoff for speed, memory usage, etc. Some of these datastructures are Vector, a Double-Linked-List, SkipList or even a Binary Search Tree depending on your requirements

Here is a good resource explaining data structures and some differences/advancements between them