Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHPAccess Methods of an Array of Objects in JavaScript
In this tutorial, we shall learn to access the methods of an array of objects in JavaScript.
What is an array of objects? An array of objects can store several values in a single variable. Every value has an array index. The values can be objects, booleans, functions, numbers, strings, or another array.
Arrays are extremely flexible because they are listed as objects. Therefore, we can access it easily.
An array of objects has a lot of built-in methods. Some are concat, forEach, join, indexOf, splice, sort, slice, lastIndexOf, filter, map, pop, shift, push, unshift, reverse, find, reduce, isArray, length, includes, etc.
Using the dot Notation
In this method, we can access the methods of an array of objects using the array and the dot notation.
Users can follow the syntax below for using this method.
Syntax
//create an array of objectsconst arr =[v1,v2,?vn];//access the method name arr.methodName();
Here, the array name directly accesses the array method with the dot notation.
Parameters
- v1,v2,...vn ? The array elements.
Example
In this program, we access the array join method using the input array and the dot notation following the syntax given above.
When the user ticks on the button, the function named getArrayMethod gets called and joins the input array values with the @ operator.
<html><body><p> The JavaScript program to access the methods of an array of objects using the dot notation </p><div id="arrMethBtnWrap"><p> Click on the button </p><button onclick="getArrayMethod();"> Join </button></div><br><pre id="arrMethInp"></pre><p id="arrMethOut"></p><script>functiongetArrayMethod(){var arrMethObj=["A","B","C"];var arrMethInp=document.getElementById("arrMethInp");var arrMethOut=document.getElementById("arrMethOut");var arrMethBtnWrap=document.getElementById("arrMethBtnWrap"); arrMethBtnWrap.style.display="none"; arrMethInp.innerHTML="The input array="+JSON.stringify(arrMethObj);var arrMethJoin = arrMethObj.join("@"); arrMethOut.innerHTML=`Accessed array join method and combined values with @ symbol -> `+ arrMethJoin;}</script></body></html>
Using array prototype method call function
In this method, we can use a function.prototype.call on Array.prototype to access the methods of an array of objects.
Users can follow the syntax below for using the array prototype method.
Syntax
//create an array of objectsconst arr =newArray();//access method nameArray.prototype.methodName.call(arg);
The array method is accessed here using the array prototype and call function
Parameters
- arg ? The array of objects and any other values.
Example
In this program, we access the array join method using the array prototype method call function following the syntax given above.
When the clicks the button, we call the method getArrayProtMethod. The method joins the input array values, and the string arguments are passed to the Array.prototype.join.call function and displays the output to the user.
<html><body><p> The JavaScript program to access the methods of an array of objects using the array prototype method call.</p><div id="arrProtBtnWrap"><p> Click on the button </p><button onclick="getArrayProtMethod();"> Join </button></div><br><pre id="arrProtInp"></pre><p id="arrProtOut"></p><script>functiongetArrayProtMethod(){var arrProtObj=["A",["X","Y"],"B"];var arrProtInp=document.getElementById("arrProtInp");var arrProtOut=document.getElementById("arrProtOut");var arrProtBtnWrap=document.getElementById("arrProtBtnWrap"); arrProtBtnWrap.style.display="none"; arrProtInp.innerHTML="The input array="+JSON.stringify(arrProtObj);functiongetJoin(x, y, z){const arrProtObj=Array.prototype.join.call(arguments); arrProtOut.innerHTML=`Accessed array join method and combined the input array values with two string arguments using the array prototype method call. </b> <br><br>`+ arrProtObj;}getJoin(arrProtObj,"S1","S2");}</script></body></html>
In this tutorial, we went through the two ways to access the methods of an array of objects in JavaScript.
The article might have helped you understand the method of access using the array with the dot notation and the array prototype function that accesses the array methods.
In the long run, the Array.prototype method goes well. The reason is that this method avoids the need for loops and other iteration options.
2K+ Views
