{"id":7146,"date":"2025-02-28T06:35:31","date_gmt":"2025-02-28T06:35:31","guid":{"rendered":"https:\/\/ubiq.co\/tech-blog\/?p=7146"},"modified":"2025-05-16T04:19:10","modified_gmt":"2025-05-16T04:19:10","slug":"how-to-add-new-elements-to-beginning-of-array-in-javascript","status":"publish","type":"post","link":"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/","title":{"rendered":"How to Add New Elements to Beginning of Array in JavaScript"},"content":{"rendered":"\n<p>Web developers often need to manipulate JavaScript arrays by adding elements to their beginning or end. There are several ways to easily prepend elements at the start of an array. You can also <a href=\"https:\/\/ubiq.co\/tech-blog\/how-to-append-items-to-js-array\/\">append items to JS array<\/a>. In this article, we will learn how to add new elements to beginning of array in JavaScript.<\/p>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_82_2 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/#How_to_Add_New_Elements_to_Beginning_of_Array_in_JavaScript\" >How to Add New Elements to Beginning of Array in JavaScript<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/#1_Using_Unshift\" >1. Using Unshift<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/#2_Using_Splice\" >2. Using Splice<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/#3_Using_Spread_Operator\" >3. Using Spread Operator<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/#4_Using_concat\" >4. Using concat<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/#Conclusion\" >Conclusion<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"How_to_Add_New_Elements_to_Beginning_of_Array_in_JavaScript\"><\/span>How to Add New Elements to Beginning of Array in JavaScript<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Here are the different ways to add one or more elements to the beginning of JavaScript array.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"1_Using_Unshift\"><\/span>1. Using Unshift<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Every JavaScript array supports unshift() function that allows to prepend an item to the beginning of the array. It will overwrite the original array. It returns the new length of the array. Here is its syntax.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">array.unshift(item1, item2, ...)<\/pre>\n\n\n\n<p>You can call unshift() function directly on any array. In this function, you need to list at least 1 item to be added to the beginning of the array.<\/p>\n\n\n\n<p>Here is an example to illustrate it.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">var data = [1, 2, 3];<br>data.unshift(0);<br>console.log(data); \/\/ output is [0, 1, 2, 3]<\/pre>\n\n\n\n<p>This approach modifies the original array without creating a new one.<\/p>\n\n\n\n<p>You can also use this function to add multiple items to the array. Here is an example to add 2 items to the beginning of an array. You will see that they are added in the same order as they are listed in unshift() function.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">var data = [1, 2, 3];<br>data.unshift(0, 4);<br>console.log(data); \/\/ output is [ 0, 4, 1, 2, 3 ]<\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"2_Using_Splice\"><\/span>2. Using Splice<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Splice function is generally used to add or remove one or more items from a JavaScript array. But it can also be used to prepend an item to an array. Here is its syntax.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">array.splice(index, count, item1, ..., itemN)<\/pre>\n\n\n\n<p>In the above function, the first argument is the index where you want to add\/remove items. Next, you need to specify the number of items to be added\/removed. Next, you need to list the actual items to be added or removed.<\/p>\n\n\n\n<p>Here is an example<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">var data = [1, 2, 3];<br>data.splice(0,0,4);<br>console.log(data); \/\/ output is [4, 1, 2, 3]<\/pre>\n\n\n\n<p>Splice function is available for every JavaScript array, by default. In the above code, we specify the first argument of splice function as the index to insert the new item. Since we want to add an item to the beginning of array, we set it to 0. The second argument is the number of items to be removed. Since we are not removing but adding item, we set it to 0. The last argument is the item to be inserted\/removed.<\/p>\n\n\n\n<p>In other words, we configure splice() function to insert item 4 at the beginning of array.<\/p>\n\n\n\n<p>This approach also mutates (modifies) the original array, without creating a new array.<\/p>\n\n\n\n<p>You can also use this method to add multiple items to the beginning of array. Here is an example to add 2 items to the beginning of array.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">var data = [1, 2, 3];<br>data.splice(0,0,4, 5);<br>console.log(data); \/\/ output is [4, 5, 1, 2, 3]<\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"3_Using_Spread_Operator\"><\/span>3. Using Spread Operator<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>JavaScript also provides spread operator &#8216;&#8230;&#8217; which is generally used to unpack items of an array. You can use it by simply prefixing the array name with &#8216;&#8230;&#8217;. It can also be used to prepend an item to an array. Here is an example.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">var data = [1, 2, 3];<br>var data2 = [0, ...data];<br>console.log(data2); \/\/ output is [0, 1, 2, 3]<br>console.log(data); \/\/ output is [1, 2, 3]<\/pre>\n\n\n\n<p>In the above code, we have mentioned the new item to be appended along with the original array, inside an array constructor [ ]. While doing so, we have prefixed the original array with spread operator.<\/p>\n\n\n\n<p>Please note, this method will create a new array that contains new item added to the beginning of old array. The original array remains unchanged.<\/p>\n\n\n\n<p>If you want to modify the original array, then you need to assign the result of concatenation to the original array, as shown.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">var data = [1, 2, 3];<br>var data = [0, ...data];<br><br>console.log(data); \/\/ output is [0, 1, 2, 3]<\/pre>\n\n\n\n<p>You can also use this method to add multiple items to an array. Here is an example to add items 0 and 4 to the original array.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">var data = [1, 2, 3];<br>var data = [0, 4, ...data];<br>console.log(data); \/\/ output is [0, 4, 1, 2, 3]<\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"4_Using_concat\"><\/span>4. Using concat<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>JavaScript also provides concat() function that is available for both strings as well as arrays. When called from a string variable, it is used to concatenate strings. When it is called from array, it is used to concatenate arrays. It can also be used to prepend an item to an array.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">var data = [1, 2, 3];<br>var data2 = [0].concat(data);<br><br>console.log(data2); \/\/ output is [0, 1, 2, 3];<br>console.log(data); \/\/ output is [1, 2, 3];<\/pre>\n\n\n\n<p>In the above code, we encapsulate the new item in a empty array [ ], and call concatenate function on it. In the function, we pass the original array as argument. This will result in a new array, where the new item is added at the beginning, followed by items of original array. <\/p>\n\n\n\n<p>Please note, this method will return a new array and not modify the original array. If you want to modify the original array, then you will have to assign the result of concat() function to the original array as shown.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">var data = [1, 2, 3];<br>var data = [0].concat(data);<br><br>console.log(data); \/\/ output is [0, 1, 2, 3];<\/pre>\n\n\n\n<p>You can also add multiple items to the beginning of an array using this method. Just list them one after the other within a new array [], and call concat() function on this array.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">var data = [1, 2, 3];<br>var data = [0, 4].concat(data);<br><br>console.log(data); \/\/ output is [0, 4, 1, 2, 3];<\/pre>\n\n\n\n<p>In the above example, we have included the two items 0 and 4 in a new array. We have called concat() function on this array to concatenate with original array <em>data<\/em>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Conclusion\"><\/span>Conclusion<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>In this article, we have learnt several different ways to add a new item to the beginning of a JavaScript array. Modifying data is sometimes required in <a href=\"https:\/\/ubiq.co\/data-reporting-tools\">data reporting<\/a> process. Some of these methods modify the original array while others return a new array with the result. You can use any of these solutions as per your requirement. If you want the original array to be modified, then use unshift() or splice() function. If you want to store the result in a new array, then use spread operator or concat() function.<\/p>\n\n\n\n<p>Also read:<\/p>\n\n\n\n<p><a href=\"https:\/\/ubiq.co\/tech-blog\/how-to-get-unique-values-in-javascript-array\/\">How to Get Unique Values in JavaScript Array<\/a><br><a href=\"https:\/\/ubiq.co\/tech-blog\/how-to-copy-array-in-javascript\/\">How to Copy Array in JavaScript<\/a><br><a href=\"https:\/\/ubiq.co\/tech-blog\/how-to-empty-array-in-javascript\/\">How to Empty Array in JavaScript<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Often JavaScript developers need to prepend new elements to arrays.  Here is how to add new elements to beginning of array in JavaScript.<\/p>\n","protected":false},"author":1,"featured_media":7172,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[295],"tags":[390],"class_list":["post-7146","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript","tag-add-elements"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>How to Add New Elements to Beginning of Array in JavaScript - Ubiq BI<\/title>\n<meta name=\"description\" content=\"Often JavaScript developers need to prepend new elements to arrays. Here is how to add new elements to beginning of array in JavaScript.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Add New Elements to Beginning of Array in JavaScript - Ubiq BI\" \/>\n<meta property=\"og:description\" content=\"Often JavaScript developers need to prepend new elements to arrays. Here is how to add new elements to beginning of array in JavaScript.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/\" \/>\n<meta property=\"og:site_name\" content=\"Ubiq BI\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/ubiqbi\" \/>\n<meta property=\"article:published_time\" content=\"2025-02-28T06:35:31+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-05-16T04:19:10+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/ubiq.co\/tech-blog\/wp-content\/uploads\/2025\/02\/add-item-to-beginning-of-array-javascript.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"258\" \/>\n\t<meta property=\"og:image:height\" content=\"171\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Sreeram Sreenivasan\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@UbiqBI\" \/>\n<meta name=\"twitter:site\" content=\"@UbiqBI\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Sreeram Sreenivasan\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-add-new-elements-to-beginning-of-array-in-javascript\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-add-new-elements-to-beginning-of-array-in-javascript\\\/\"},\"author\":{\"name\":\"Sreeram Sreenivasan\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/#\\\/schema\\\/person\\\/db98d49a766a3a111d8510935ab90abc\"},\"headline\":\"How to Add New Elements to Beginning of Array in JavaScript\",\"datePublished\":\"2025-02-28T06:35:31+00:00\",\"dateModified\":\"2025-05-16T04:19:10+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-add-new-elements-to-beginning-of-array-in-javascript\\\/\"},\"wordCount\":915,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-add-new-elements-to-beginning-of-array-in-javascript\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/ubiq.co\\\/tech-blog\\\/wp-content\\\/uploads\\\/2025\\\/02\\\/add-item-to-beginning-of-array-javascript.jpg?fit=258%2C171&ssl=1\",\"keywords\":[\"add elements\"],\"articleSection\":[\"JavaScript\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-add-new-elements-to-beginning-of-array-in-javascript\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-add-new-elements-to-beginning-of-array-in-javascript\\\/\",\"url\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-add-new-elements-to-beginning-of-array-in-javascript\\\/\",\"name\":\"How to Add New Elements to Beginning of Array in JavaScript - Ubiq BI\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-add-new-elements-to-beginning-of-array-in-javascript\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-add-new-elements-to-beginning-of-array-in-javascript\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/ubiq.co\\\/tech-blog\\\/wp-content\\\/uploads\\\/2025\\\/02\\\/add-item-to-beginning-of-array-javascript.jpg?fit=258%2C171&ssl=1\",\"datePublished\":\"2025-02-28T06:35:31+00:00\",\"dateModified\":\"2025-05-16T04:19:10+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/#\\\/schema\\\/person\\\/db98d49a766a3a111d8510935ab90abc\"},\"description\":\"Often JavaScript developers need to prepend new elements to arrays. Here is how to add new elements to beginning of array in JavaScript.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-add-new-elements-to-beginning-of-array-in-javascript\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-add-new-elements-to-beginning-of-array-in-javascript\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-add-new-elements-to-beginning-of-array-in-javascript\\\/#primaryimage\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/ubiq.co\\\/tech-blog\\\/wp-content\\\/uploads\\\/2025\\\/02\\\/add-item-to-beginning-of-array-javascript.jpg?fit=258%2C171&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i0.wp.com\\\/ubiq.co\\\/tech-blog\\\/wp-content\\\/uploads\\\/2025\\\/02\\\/add-item-to-beginning-of-array-javascript.jpg?fit=258%2C171&ssl=1\",\"width\":258,\"height\":171,\"caption\":\"add item to beginning of array in javascript\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-add-new-elements-to-beginning-of-array-in-javascript\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to Add New Elements to Beginning of Array in JavaScript\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/#website\",\"url\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/\",\"name\":\"Ubiq BI\",\"description\":\"Build dashboards &amp; reports in minutes\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/#\\\/schema\\\/person\\\/db98d49a766a3a111d8510935ab90abc\",\"name\":\"Sreeram Sreenivasan\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g\",\"caption\":\"Sreeram Sreenivasan\"},\"description\":\"Sreeram Sreenivasan is the Founder of Ubiq. He has helped many Fortune 500 companies in the areas of BI &amp; software development.\",\"sameAs\":[\"https:\\\/\\\/www.linkedin.com\\\/in\\\/sreeram-sreenivasan\\\/\"],\"url\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/author\\\/wordpress\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Add New Elements to Beginning of Array in JavaScript - Ubiq BI","description":"Often JavaScript developers need to prepend new elements to arrays. Here is how to add new elements to beginning of array in JavaScript.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/","og_locale":"en_US","og_type":"article","og_title":"How to Add New Elements to Beginning of Array in JavaScript - Ubiq BI","og_description":"Often JavaScript developers need to prepend new elements to arrays. Here is how to add new elements to beginning of array in JavaScript.","og_url":"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/","og_site_name":"Ubiq BI","article_publisher":"https:\/\/www.facebook.com\/ubiqbi","article_published_time":"2025-02-28T06:35:31+00:00","article_modified_time":"2025-05-16T04:19:10+00:00","og_image":[{"width":258,"height":171,"url":"https:\/\/ubiq.co\/tech-blog\/wp-content\/uploads\/2025\/02\/add-item-to-beginning-of-array-javascript.jpg","type":"image\/jpeg"}],"author":"Sreeram Sreenivasan","twitter_card":"summary_large_image","twitter_creator":"@UbiqBI","twitter_site":"@UbiqBI","twitter_misc":{"Written by":"Sreeram Sreenivasan","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/#article","isPartOf":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/"},"author":{"name":"Sreeram Sreenivasan","@id":"https:\/\/ubiq.co\/tech-blog\/#\/schema\/person\/db98d49a766a3a111d8510935ab90abc"},"headline":"How to Add New Elements to Beginning of Array in JavaScript","datePublished":"2025-02-28T06:35:31+00:00","dateModified":"2025-05-16T04:19:10+00:00","mainEntityOfPage":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/"},"wordCount":915,"commentCount":0,"image":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/ubiq.co\/tech-blog\/wp-content\/uploads\/2025\/02\/add-item-to-beginning-of-array-javascript.jpg?fit=258%2C171&ssl=1","keywords":["add elements"],"articleSection":["JavaScript"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/","url":"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/","name":"How to Add New Elements to Beginning of Array in JavaScript - Ubiq BI","isPartOf":{"@id":"https:\/\/ubiq.co\/tech-blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/#primaryimage"},"image":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/ubiq.co\/tech-blog\/wp-content\/uploads\/2025\/02\/add-item-to-beginning-of-array-javascript.jpg?fit=258%2C171&ssl=1","datePublished":"2025-02-28T06:35:31+00:00","dateModified":"2025-05-16T04:19:10+00:00","author":{"@id":"https:\/\/ubiq.co\/tech-blog\/#\/schema\/person\/db98d49a766a3a111d8510935ab90abc"},"description":"Often JavaScript developers need to prepend new elements to arrays. Here is how to add new elements to beginning of array in JavaScript.","breadcrumb":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/#primaryimage","url":"https:\/\/i0.wp.com\/ubiq.co\/tech-blog\/wp-content\/uploads\/2025\/02\/add-item-to-beginning-of-array-javascript.jpg?fit=258%2C171&ssl=1","contentUrl":"https:\/\/i0.wp.com\/ubiq.co\/tech-blog\/wp-content\/uploads\/2025\/02\/add-item-to-beginning-of-array-javascript.jpg?fit=258%2C171&ssl=1","width":258,"height":171,"caption":"add item to beginning of array in javascript"},{"@type":"BreadcrumbList","@id":"https:\/\/ubiq.co\/tech-blog\/how-to-add-new-elements-to-beginning-of-array-in-javascript\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/ubiq.co\/tech-blog\/"},{"@type":"ListItem","position":2,"name":"How to Add New Elements to Beginning of Array in JavaScript"}]},{"@type":"WebSite","@id":"https:\/\/ubiq.co\/tech-blog\/#website","url":"https:\/\/ubiq.co\/tech-blog\/","name":"Ubiq BI","description":"Build dashboards &amp; reports in minutes","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/ubiq.co\/tech-blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/ubiq.co\/tech-blog\/#\/schema\/person\/db98d49a766a3a111d8510935ab90abc","name":"Sreeram Sreenivasan","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g","caption":"Sreeram Sreenivasan"},"description":"Sreeram Sreenivasan is the Founder of Ubiq. He has helped many Fortune 500 companies in the areas of BI &amp; software development.","sameAs":["https:\/\/www.linkedin.com\/in\/sreeram-sreenivasan\/"],"url":"https:\/\/ubiq.co\/tech-blog\/author\/wordpress\/"}]}},"jetpack_featured_media_url":"https:\/\/i0.wp.com\/ubiq.co\/tech-blog\/wp-content\/uploads\/2025\/02\/add-item-to-beginning-of-array-javascript.jpg?fit=258%2C171&ssl=1","jetpack_shortlink":"https:\/\/wp.me\/pbGGTT-1Rg","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/posts\/7146","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/comments?post=7146"}],"version-history":[{"count":28,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/posts\/7146\/revisions"}],"predecessor-version":[{"id":8211,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/posts\/7146\/revisions\/8211"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/media\/7172"}],"wp:attachment":[{"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/media?parent=7146"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/categories?post=7146"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/tags?post=7146"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}