What is the best way to combine JSON objects from a two-dimensional array into a single array using JavaScript?

I have a JSON object within an array that I want to push to an employeeArray.

employeeArray =[
  [  
    {  
      "ID":"967",
      "NAME":"Dang, Lance D",
      "Email":"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="0e426f606d6b204a6f60694e767774206d6163">[email protected]</a>"
    }
  ],
  [  
    {  
      "ID":"450",
      "NAME":"Starnes, Mitch",
      "Email":"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="266b4f52454e434a4a0875524754484355665e5f5c0845494b">[email protected]</a>"
    }
  ],
  [  
    {  
      "ID":"499",
      "NAME":"Cosby, Lance H",
      "Email":"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="f8b499969b9dd6bb978b9a81b8808182d69b9795">[email protected]</a>"
    }
  ]
];

I am looking to transform the two-dimensional employeeArray into a single array with JSON objects like this:

employeeArray =[
  {  
    "ID":"967",
    "NAME":"Dang, Lance D",
    "Email":"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="5e123f303d3b701a3f30391e262724703d3133">[email protected]</a>"
  },
  {  
    "ID":"450",
    "NAME":"Starnes, Mitch",
    "Email":"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="c489adb0a7aca1a8a8ea97b0a5b6aaa1b784bcbdbeeaa7aba9">[email protected]</a>"
  },
  {  
    "ID":"499",
    "NAME":"Cosby, Lance H",
    "Email":"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="cf83aea1acaae18ca0bcadb68fb7b6b5e1aca0a2">[email protected]</a>"
  }
];

I need assistance in using the values from the two-dimensional array to create the desired array using pure JavaScript.

javascriptarraysjsonmultidimensional-array

Answer №1

If you need to flatten an array, one approach is to utilize the reduce function:

personnelArray.reduce((previous, current) => previous.concat(current), [])

For ES5 compatibility:

personnelArray.reduce(function (previous, current) {
  return previous.concat(current);
}, []);

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Tips for dynamically populating an HTML table with data from a JSON array using JQuery

I have generated an HTML table <table id="top_five_table"> <tr> <td> </th> <th>URL</th> <th width="90">Total Hits</th> <th width="380">Percentage of all Hits</th> </tr> <tr> ...

javascriptjqueryhtmljson

Is the toString() method explicitly invoked by Number() if the value is not of type number or string? (such as a function)

Looking for clarification on the behavior of parseInt() compared to the Number() constructor called as a function. I want to confirm if this is reliable and if there's an official reference to support it. Below is sample code: let adder = (function ...

javascriptfunction

How can material-ui useScrollTrigger be utilized in combination with a child's target ref?

Attempting to utilize material-ui's useScrollTrigger with a different target other than window presents a challenge. The code snippet below illustrates an attempt to achieve this: export default props => { let contentRef = React.createRef(); ...

javascriptreactjsmaterial-ui

Preventing Negative Indexing in Arrays: Tips to Avoid Array Out of Bounds Errors

I've been working on a project and I'm having trouble preventing it from going out of bounds. The getPiece(row, col) method returns the value of a custom class from a 2D array that ranges from 0 to 7 in both directions. I need to ensure that the ...

javaarraysindexoutofboundsexception

Display various items using only one EJS scriptlet tag

I'm currently facing a challenge with rendering two objects using EJS. I am curious to know if it is feasible to render them both within the same pair of scriptlet tags or if they need to be rendered separately? So far, I have been able to successful ...

javascripthtmlnode.jsexpressejs

Incorrect JSON nested object duplication - Rails

I've set up a Rails API that utilizes the rabl gem to return JSON data. The code snippet below shows the /show template, which is also used in the /index template. object @deal attributes :headline, :text, :image, :id, :created_at child :vendor do ...

ruby-on-railsjsonrabl

Unable to submit form in Nextjs using react-bootstrap

Instructions To create a registration form, follow these steps: Fill out the form on the register page and then click submit. The react-bootstrap button will trigger the handleSubmit() function using onSubmit={}. Expected vs Actual Outcome I attempted va ...

javascriptnode.jsreactjsnext.jsreact-bootstrap

Avoid running multiple YouTube views simultaneously within an AngularJS application

Currently, I have an Angularjs application that displays a list of Youtube videos utilizing the videogular node module. An issue has arisen where users can play multiple Youtube videos simultaneously, leading to potential violations of Youtube's poli ...

javascriptangularjsangularyoutube

Filtering a List Using Angular

I am working on a code where I need to filter a list of elements based on the option selected from a combobox. Currently, my code is error-free but I am unable to successfully filter the list. Can someone please guide me on what steps I should take next? ...

javascripthtmlangulartypescript

Just starting out with d3 and struggling to display a graph using JSON data

I'm completely new to using d3 and struggling with creating a line graph from JSON data. Within my ReportBucketDAO.java file, I am generating JSON output based on my database records. while (rs.next()) { String currency = rs.getString("currenc ...

javajqueryjsonnetbeansd3.js

Utilizing JSON Files with C++ Programming

Currently, I am attempting to parse a JSON file using the jsoncpp library. Nevertheless, I am finding it challenging to comprehend its documentation. Can someone simplify and explain its functionality in layman's terms for me? Let's consider a s ...

c++jsondictionaryjsoncpp

Received an error during the module.exports = client process

In my commands folder, I have multiple files that contain slash commands. I am trying to import the client instance from index.js to another file, but when I use module.exports = client;, it ends up executing the entire index.js script unintentionally. I ...

javascriptnode.jsmodulediscord.jsclient

Using a PHP associative array to merge tables with identical field names

Currently, I am facing an issue with a particular query where I am trying to retrieve data from an array but struggling to identify the key names: SELECT table_1.*, table_2.* FROM... INNER JOIN... I have looked into similar posts for a solution and fou ...

phpmysqlarraysassociative

Iterate through each item in PHP using a Laravel foreach loop and display only the items that belong to the same

I'm facing an issue with displaying my data in the desired format. Let me illustrate with an example of an array: $items = 0 => [ 'name' => 'foo' 'description' => & ...

phparrayslaravel

Receiving a Java object representation of an HTTP response

I have been working with Spring Web to create a RESTful resource. I have defined Document objects in Java that mimic the JSON response structure. Strangely, when I set String.class as the response type, I receive the correct response. However, when I switc ...

javajsonspringhttp

Error: Unsupported Media Type when attempting to send JSON data from an AngularJS frontend to a Spring controller

Below is the controller function code snippet @RequestMapping(value = "/logInChecker", method = RequestMethod.POST, consumes = {"application/json"}) public @ResponseBody String logInCheckerFn(@RequestBody UserLogData userLogData){ Integer user ...

javajavascriptjsonangularjsspring-mvc

Locate and eliminate the item containing specific content

There are many <p> &nbsp </p> tags scattered throughout the description. I need to locate and delete any tags that contain only &nbsp. The description is enclosed in a container with the class name of desc_container. Below is an exampl ...

javascriptjquerydom

It appears that the query parameters are impacting the speed at which the page loads

I am currently developing a project on this platform. It is using c9.io, an innovative browser-based collaborative programming IDE. The index.php file includes the following script: <?php $path = ltrim($_SERVER['REQUEST_URI'], '/&ap ...

javascriptphphtmlcss

Learn how to use DataAnnotation to serialize an object to JSON, specifically formatting double properties within a ServiceStack request

When using ServiceStack, I am trying to format a request to keep the CodValue property in the #.# format. [DataContract(Name = "request1")] public class Request1 { [DataMember(Name = "codValue")] public double CodValue { get; set; } } var request1 ...

c#jsonservicestackormlite-servicestackservicestack-text

Using TypeScript, you can utilize RxJS to generate a fresh Observable named "Array" from a static array

I've successfully created an observable from an array, but the issue is that its type shows as Observable<number> instead of Observable<number[]> getUsers(ids: string[]): Observable<number[]> { const arraySource = Observable.from ...

arraysangulartypescriptrxjsobservable