<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[Tech blogs]]></title><description><![CDATA[I write blogs about different programming languages and latest technologies]]></description><link>https://blog.rohitjadhav.com</link><generator>RSS for Node</generator><lastBuildDate>Sun, 17 May 2026 22:28:56 GMT</lastBuildDate><atom:link href="https://blog.rohitjadhav.com/rss.xml" rel="self" type="application/rss+xml"/><language><![CDATA[en]]></language><ttl>60</ttl><item><title><![CDATA[JavaScript - Array]]></title><description><![CDATA[What is array?
An array is an object that can store multiple values at once. 
What is the difference between non-constant array and const array variable?
Non-const array variable can initialize with whole new array
also we can change the values.
let ...]]></description><link>https://blog.rohitjadhav.com/javascript-array</link><guid isPermaLink="true">https://blog.rohitjadhav.com/javascript-array</guid><category><![CDATA[iwritecode]]></category><category><![CDATA[#HiteshChaudhary ]]></category><category><![CDATA[@hiteshchoudharylco]]></category><dc:creator><![CDATA[Rohit Jadhav]]></dc:creator><pubDate>Thu, 01 Sep 2022 17:08:11 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/unsplash/xrVDYZRGdw4/upload/v1662052007532/XX6jlGyxh.jpeg" length="0" type="image/jpeg"/><content:encoded><![CDATA[<h1 id="heading-what-is-array">What is array?</h1>
<p>An array is an object that can store multiple values at once. </p>
<h1 id="heading-what-is-the-difference-between-non-constant-array-and-const-array-variable">What is the difference between non-constant array and const array variable?</h1>
<p>Non-const array variable can initialize with whole new array
also we can change the values.</p>
<pre><code>let myarray <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> Array();
myarray.<span class="hljs-built_in">push</span>(<span class="hljs-string">'value'</span>); <span class="hljs-comment">// Allowed</span>
myarray <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> Array(); <span class="hljs-comment">// Allowed</span>
</code></pre><p>Const array variable cannot be initialize again after declaration, only initilize at the time of declaration but we can change the values;</p>
<pre><code>const myarray <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> Array();
myarray.<span class="hljs-built_in">push</span>(<span class="hljs-string">'value'</span>); <span class="hljs-comment">// Allowed</span>
myarray <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> Array(); <span class="hljs-comment">// It will throw exception</span>
</code></pre><h1 id="heading-different-ways-to-create-array">Different ways to create array</h1>
<ol>
<li>Using Array literal</li>
</ol>
<pre><code>let students = [<span class="hljs-string">'Ram'</span>, <span class="hljs-string">'Sham'</span>, <span class="hljs-string">'Gagan'</span>]; //<span class="hljs-keyword">Array</span> <span class="hljs-keyword">with</span> <span class="hljs-keyword">values</span>
let studentsEmpty = []; //Empty <span class="hljs-keyword">array</span>

// Objects <span class="hljs-keyword">array</span>
let objArray = [
    {
        <span class="hljs-type">name</span>: <span class="hljs-string">'Rohit'</span>,
        age: <span class="hljs-string">'27'</span>
    },
    {
        marks: <span class="hljs-number">99</span>,
        result: <span class="hljs-string">'pass'</span>
    }
];
</code></pre><ol>
<li>Using New keyword<pre><code><span class="hljs-keyword">let</span> students = <span class="hljs-keyword">new</span> <span class="hljs-built_in">Array</span>();
</code></pre></li>
<li>Using Array constructor<pre><code><span class="hljs-keyword">let</span> students = <span class="hljs-keyword">new</span> <span class="hljs-built_in">Array</span>(<span class="hljs-string">'Ram'</span>, <span class="hljs-string">'Sham'</span>, <span class="hljs-string">'Gagan'</span>);
</code></pre><h1 id="heading-array-methods">Array Methods</h1>
</li>
</ol>
<div class="hn-table">
<table>
<thead>
<tr>
<td>Method</td><td>Description</td></tr>
</thead>
<tbody>
<tr>
<td><a class="post-section-overview" href="##concat()">concat()</a></td><td>It returns a new array object that contains two or more merged arrays.</td></tr>
<tr>
<td><a class="post-section-overview" href="##copywithin()">copywithin()</a></td><td>It copies the part of the given array with its own elements and returns the modified array.</td></tr>
<tr>
<td><a class="post-section-overview" href="##entries()">entries()</a></td><td>It creates an iterator object and a loop that iterates over each key/value pair.</td></tr>
<tr>
<td><a class="post-section-overview" href="##every()">every()</a></td><td>It determines whether all the elements of an array are satisfying the provided function conditions.</td></tr>
<tr>
<td><a class="post-section-overview" href="##flat()">flat()</a></td><td>It creates a new array carrying sub-array elements concatenated recursively till the specified depth.</td></tr>
<tr>
<td><a class="post-section-overview" href="##flatMap()">flatMap()</a></td><td>It maps all array elements via mapping function, then flattens the result into a new array.</td></tr>
<tr>
<td><a class="post-section-overview" href="##fill()">fill()</a></td><td>It fills elements into an array with static values.</td></tr>
<tr>
<td><a class="post-section-overview" href="##from()">from()</a></td><td>It creates a new array carrying the exact copy of another array element.</td></tr>
<tr>
<td><a class="post-section-overview" href="##filter()">filter()</a></td><td>It returns the new array containing the elements that pass the provided function conditions.</td></tr>
<tr>
<td><a class="post-section-overview" href="##find()">find()</a></td><td>It returns the value of the first element in the given array that satisfies the specified condition.</td></tr>
<tr>
<td><a class="post-section-overview" href="##findIndex()">findIndex()</a></td><td>It returns the index value of the first element in the given array that satisfies the specified condition.</td></tr>
<tr>
<td><a class="post-section-overview" href="##forEach()">forEach()</a></td><td>It invokes the provided function once for each element of an array.</td></tr>
<tr>
<td><a class="post-section-overview" href="##includes()">includes()</a></td><td>It checks whether the given array contains the specified element.</td></tr>
<tr>
<td><a class="post-section-overview" href="##indexOf()">indexOf()</a></td><td>It searches the specified element in the given array and returns the index of the first match.</td></tr>
<tr>
<td><a class="post-section-overview" href="##isArray()">isArray()</a></td><td>It tests if the passed value ia an array.</td></tr>
<tr>
<td><a class="post-section-overview" href="##join()">join()</a></td><td>It joins the elements of an array as a string.</td></tr>
<tr>
<td><a class="post-section-overview" href="##keys()">keys()</a></td><td>It creates an iterator object that contains only the keys of the array, then loops through these keys.</td></tr>
<tr>
<td><a class="post-section-overview" href="##lastIndexOf()">lastIndexOf()</a></td><td>It searches the specified element in the given array and returns the index of the last match.</td></tr>
<tr>
<td><a class="post-section-overview" href="##map()">map()</a></td><td>It calls the specified function for every array element and returns the new array</td></tr>
<tr>
<td><a class="post-section-overview" href="##of()">of()</a></td><td>It creates a new array from a variable number of arguments, holding any type of argument.</td></tr>
<tr>
<td><a class="post-section-overview" href="##pop()">pop()</a></td><td>It removes and returns the last element of an array.</td></tr>
<tr>
<td><a class="post-section-overview" href="##push()">push()</a></td><td>It adds one or more elements to the end of an array.</td></tr>
<tr>
<td><a class="post-section-overview" href="##reverse()">reverse()</a></td><td>It reverses the elements of given array.</td></tr>
<tr>
<td><a class="post-section-overview" href="##some()">some()</a></td><td>It determines if any element of the array passes the test of the implemented function.</td></tr>
<tr>
<td><a class="post-section-overview" href="##shift()">shift()</a></td><td>It removes and returns the first element of an array.</td></tr>
<tr>
<td><a class="post-section-overview" href="##slice()">slice()</a></td><td>It returns a new array containing the copy of the part of the given array.</td></tr>
<tr>
<td><a class="post-section-overview" href="##sort()">sort()</a></td><td>It returns the element of the given array in a sorted order.</td></tr>
<tr>
<td><a class="post-section-overview" href="##splice()">splice()</a></td><td>It add/remove elements to/from the given array.</td></tr>
<tr>
<td><a class="post-section-overview" href="##toLocaleString()">toLocaleString()</a></td><td>It returns a string containing all the elements of a specified array.</td></tr>
<tr>
<td><a class="post-section-overview" href="##toString()">toString()</a></td><td>It converts the elements of a specified array into string form, without affecting the original array.</td></tr>
<tr>
<td><a class="post-section-overview" href="##unshift()">unshift()</a></td><td>It adds one or more elements in the beginning of the given array.</td></tr>
<tr>
<td><a class="post-section-overview" href="##values()">values()</a></td><td>It creates a new iterator object carrying values for each index in the array.</td></tr>
</tbody>
</table>
</div>
<h2 id="heading-concat">concat()</h2>
<p>The concat() method is use to append the another array to current array </p>
<pre><code>let students1 <span class="hljs-operator">=</span> [<span class="hljs-string">'Ram'</span>, <span class="hljs-string">'Sham'</span>];
let students2 <span class="hljs-operator">=</span> [<span class="hljs-string">'Sadan'</span>, <span class="hljs-string">'Mahatre'</span>];

<span class="hljs-comment">// contact two arrays </span>
let concatStudents <span class="hljs-operator">=</span> students1.concat(students2);

console.info(concatStudents);
<span class="hljs-comment">//output:: [Ram,Sham,Sadan,Mahatre]</span>

concatStudents <span class="hljs-operator">=</span> students2.concat(students1);

console.info(concatStudents);
<span class="hljs-comment">//output:: [Sadan,Mahatre,Ram,Sham]</span>

console.info([<span class="hljs-string">'Sham'</span>, <span class="hljs-string">'Ganga'</span>].concat([<span class="hljs-string">'Radha'</span>, <span class="hljs-string">'Maya'</span>]));
<span class="hljs-comment">//output:: ['Sham', 'Ganga', 'Radha', 'Maya']</span>
</code></pre><h2 id="heading-copywithin">copywithin()</h2>
<p>Syntax</p>
<pre><code>```
<span class="hljs-keyword">array</span>.copyWithin(target, <span class="hljs-keyword">start</span>, <span class="hljs-keyword">end</span>)
```
</code></pre><p>Parameters</p>
<ul>
<li>target - The position where the copied element takes place.</li>
<li>start - It is optional. It represents the index from where the method starts copying elements. By default, it is 0.</li>
<li>end - It is optional. It represents the index at which elements stops copying. By default, it is array.length-1.</li>
</ul>
<p>Example</p>
<pre><code>let studentsArray <span class="hljs-operator">=</span> [<span class="hljs-string">'rohit'</span>, <span class="hljs-string">'sagar'</span>, <span class="hljs-string">'kamala'</span>];
let result <span class="hljs-operator">=</span> studentsArray.copyWithin(<span class="hljs-number">0</span>,<span class="hljs-number">1</span>,<span class="hljs-number">2</span>);

console.info(result);
<span class="hljs-comment">//output: ['sagar', 'sagar', 'kamala']</span>
</code></pre><h2 id="heading-entries">entries()</h2>
<p>The entries() method creates a new iterator object of an array, holding the key/value pairs for every value in the array. A key represents the index number carrying an item as its value. It does not affect the original array.</p>
<p>Example 1</p>
<pre><code>let colors <span class="hljs-operator">=</span> [<span class="hljs-string">'yellow'</span>, <span class="hljs-string">'green'</span>, <span class="hljs-string">'orange'</span>, <span class="hljs-string">'black'</span>];
newColors <span class="hljs-operator">=</span> colors.entries();

<span class="hljs-keyword">for</span>(let color of newColors){
    console.info(color);
}
</code></pre><p>output </p>
<pre><code>[<span class="hljs-number">0</span>, 'yellow']
[<span class="hljs-number">1</span>, 'green']
[<span class="hljs-number">2</span>, 'orange']
[<span class="hljs-number">3</span>, 'black']
</code></pre><p>Example 2</p>
<pre><code>let colors <span class="hljs-operator">=</span> [<span class="hljs-string">'yellow'</span>, <span class="hljs-string">'green'</span>, <span class="hljs-string">'orange'</span>, <span class="hljs-string">'black'</span>];

let newColors <span class="hljs-operator">=</span> colors.entries();

<span class="hljs-keyword">for</span>(let color of newColors){
    color.forEach((element) <span class="hljs-operator">=</span><span class="hljs-operator">&gt;</span> {
        console.info(element);
    });
}
</code></pre><p>output</p>
<pre><code><span class="hljs-number">0</span>
<span class="hljs-string">yellow</span>
<span class="hljs-number">1</span>
<span class="hljs-string">green</span>
<span class="hljs-number">2</span>
<span class="hljs-string">orange</span>
<span class="hljs-number">3</span>
<span class="hljs-string">black</span>
</code></pre>
<h2 id="heading-pop">pop()</h2>
<p>Get last element and remove from the array</p>
<pre><code>let colors <span class="hljs-operator">=</span> [<span class="hljs-string">'red'</span>, <span class="hljs-string">'yellow'</span>, <span class="hljs-string">'green'</span>];

console.log(colors.<span class="hljs-built_in">pop</span>());

<span class="hljs-comment">//output: green</span>

console.log(colors);
<span class="hljs-comment">//output: ['red', 'yellow']</span>
</code></pre><h2 id="heading-push">push()</h2>
<p>Add new element at the end of the array</p>
<pre><code>let colors <span class="hljs-operator">=</span> [<span class="hljs-string">'red'</span>, <span class="hljs-string">'yellow'</span>, <span class="hljs-string">'green'</span>];

colors.<span class="hljs-built_in">push</span>(<span class="hljs-string">'black'</span>);

console.log(colors);
<span class="hljs-comment">//output: ['red', 'yellow', 'green', 'black']</span>
</code></pre><h2 id="heading-reverse">reverse()</h2>
<p>To reverse elements order of the array</p>
<pre><code>let colors <span class="hljs-operator">=</span> [<span class="hljs-string">'red'</span>, <span class="hljs-string">'yellow'</span>, <span class="hljs-string">'green'</span>];

colors.reverse();

console.log(colors);
<span class="hljs-comment">//output: ['green', 'yellow', 'red']</span>
</code></pre>
<h2 id="heading-shift">shift()</h2>
<p>The JavaScript array shift() method removes the first element of the given array and returns that element. This method changes the length of the original array.</p>
<pre><code>let colors <span class="hljs-operator">=</span> [<span class="hljs-string">'red'</span>, <span class="hljs-string">'yellow'</span>, <span class="hljs-string">'green'</span>];

let color <span class="hljs-operator">=</span> colors.shift();

console.log(color);
<span class="hljs-comment">//output: red</span>

console.log(colors);
<span class="hljs-comment">//output: ['yellow', 'green']</span>
</code></pre><h2 id="heading-slice">slice()</h2>
<p>The JavaScript array slice() method extracts the part of the given array and returns it. This method doesn't change the original array.</p>
<pre><code>let colors <span class="hljs-operator">=</span> [<span class="hljs-string">'red'</span>, <span class="hljs-string">'yellow'</span>, <span class="hljs-string">'green'</span>];

let colorsSlice <span class="hljs-operator">=</span> colors.slice(<span class="hljs-number">1</span>,<span class="hljs-number">3</span>);

console.log(colorsSlice);
<span class="hljs-comment">//output: ['yellow', 'green']</span>
</code></pre><h2 id="heading-sort">sort()</h2>
<p>Sort method arrange elements in sorted order</p>
<pre><code>let colors <span class="hljs-operator">=</span> [<span class="hljs-string">'red'</span>, <span class="hljs-string">'yellow'</span>, <span class="hljs-string">'green'</span>];

let sortedColors <span class="hljs-operator">=</span> colors.sort();

console.log(sortedColors);
<span class="hljs-comment">//output: ['green', 'red', 'yellow']</span>

console.log(colors)
<span class="hljs-comment">//output: ['green', 'red', 'yellow']</span>
</code></pre>
<h2 id="heading-tostring">toString()</h2>
<p>Converts array into command seprated string </p>
<pre><code>let colors <span class="hljs-operator">=</span> [<span class="hljs-string">'red'</span>, <span class="hljs-string">'yellow'</span>, <span class="hljs-string">'green'</span>];

console.log(colors.toString());

<span class="hljs-comment">//output: red,yellow,green</span>
</code></pre><h2 id="heading-unshift">unshift()</h2>
<p>The JavaScript array unshift() method adds one or more elements in the beginning of the given array and returns the updated array. This method changes the length of the original array.</p>
<pre><code>let colors <span class="hljs-operator">=</span> [<span class="hljs-string">'red'</span>, <span class="hljs-string">'yellow'</span>, <span class="hljs-string">'green'</span>];

let count <span class="hljs-operator">=</span> colors.unshift(<span class="hljs-string">'black'</span>)

console.log(colors);
<span class="hljs-comment">//output: ['green', 'red', 'yellow']</span>

console.log(count);
<span class="hljs-comment">//output: 4</span>
</code></pre>
]]></content:encoded></item></channel></rss>