Merging two arrays of objects from the same response in JavaScript

How can I efficiently merge two arrays of objects from the same response?

let data = [{
   "testLevel":"mid",
   "testId":"m-001",
   "majorCourse": [
      {
         "courseName":"C++",
      }
   ],
   "additinalCertificate" : [
      {
         "courseName":"Data Structure",
      }
      {
         "courseName":"Intra Networking and design - level 1",
      }
   ]
}]

expected:

newObj = [{{"courseName":"C++"},{"courseName":"DS"}}]

I have a specific requirement in my Angular app where I need to display the merged data without using nested 'ngFor'. I want to show it like this:

1. C++
2. C++ + DS

Feeling exhausted...

let combine = [...data[0].majorCourse, ...data[0].additinalCertificate];

console.log('combine',combine); // getting undefined

Can anyone suggest an ES6 or better solution to achieve this task?

Thank you

Answer №1

Initially, it is important to note that there is no property with the value of java in your existing data object. Additionally, you have overlooked a comma (',') in between the data and additinalCertificate properties. Furthermore, when accessing the

"courseName":"Data Structure"
within the additinalCertificate, make sure to specify its index. Lastly, the final part involving the index of courseName will not be iterable, hence eliminating the necessity for using spread syntax on it.

Your revised code should resemble this:

let data = [{
  "testLevel": "mid",
  "testId": "m-001",
  "majorCourse": [{
    "courseName": "C++",
  }],
  "additinalCertificate": [{
    "courseName": "Data Structure",
  }, {
    "courseName": "Intra Networking and design - level 1",
  }]
}]

let combine = [...data[0].majorCourse, data[0].additinalCertificate[0]];

console.log('combine: ', combine)

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

Retrieve Browser Screen Width and Height using MVC3 Razor in the View

I am facing a challenge on my website where I need to generate a Bitmap dynamically and ensure it is rendered according to the width and height of the browser so that there are no overflow issues on the page. Although I have successfully created an image ...

Deleting the first element of an array in JavaScript using Node.js

I'm struggling to remove the first element of an array. When I try to use slice(1,1) or shift, I can't seem to retain a list. For instance, my array: [1499783769720,"54:52:00:62:46:66","54:52:00:b0:fa:57","54:52:00:8f:d9:7c","54:52:00:e7:67:10" ...

Programmatically control the opening and closing of a React Material UI Snackbar component

Currently, I am facing some challenges while working on programming a Single Page Application (SPA) using React and Material-UI. In my project, I have created a modal login box that gets triggered by a button on the navigation bar. Upon clicking submit, I ...

Ways to retrieve a specific item from a constantly changing knockout observableArray without employing a foreach loop

Why can I only access one property ('member_A') of an Element in an observableArray using an HTML <input>? I am attempting to add a new object of type abc() to the observableArray "list_of_abc" when the button "ADD To List of abc" is click ...

Using jQuery to search for corresponding JSON keys in the PokéAPI

Currently, in my development of an app, I am searching for and implementing an English translation of a language JSON endpoint using the PokéAPI. The challenge lies in identifying the correct location of the English language key within the array response, ...

Plot the components of an array and calculate the instances that JavaScript executes

I have an array containing information about PDF files stored in a buffer. Let's imagine this array holds ten PDF files structured like this: [{ correlative: "G-22-1-06", content: <Buffer 25 50 44 46 2d 31 2e 34 0a 25 d3 eb e9 e1 0a ...

Tips for altering the appearance of a button:

Upon clicking the subscribe button and successfully subscribing, I want to display an unsubscribe option in my code. To achieve this, I have created two separate divs for each button, thinking that we could toggle between them. <div id ="subscribe_ever ...

Dynamically resizing a property in the DOM with Angular

Could someone help me with an issue I'm having regarding resizing items on the screen in Angular when the browser window size changes? Here is my code snippet: // TS File height: number = 2.5; objHeight:number; screenHeight:number = window.innerHeig ...

Use Protractor to simulate Loss Connection by clearing LocalStorage in a Spec

Currently, I am utilizing the code window.localStorage.removeItem("name of localStorage variable you want to remove"); to eliminate two distinct localStorage Keys within a particular specification, and it is successfully removing them. Afterwards, I proce ...

Unable to open new window on iOS devices using $window.open

alertPopup.then (function(res) { if(ionic.Platform.isAndroid()) { $window.open('android_link_here', '_system') } else if(ionic.Platform.isIOS()) { $window.open('ios_link_here', '_system& ...

Manipulating the content of a specific row's table cells with a text box in jQuery Datatables

I am working with a jQuery datatable that consists of only one column. Every time a row is selected, a panel opens with a text box that automatically populates with the name of the selected td. I am trying to figure out how to edit the name of the selected ...

I'm having trouble with the @Input() binding in my custom directive and it's not working as intended

Example Link - Creating a Custom Directive import { Directive, ElementRef, Input } from '@angular/core'; @Directive({ selector: '[appCustomDirective]', }) export class CustomDirective { @Input('appCustomDirective') bord ...

What steps should I take to fix this TypeScript error?

I've been struggling to fix this error, but I'm unsure of the best way to resolve it. Here is the code snippet I've been working with:https://i.sstatic.net/m6M48.png Here is the specific error message: https://i.sstatic.net/uk6QY.png ...

UI-Router - issue with query parameters preventing arrays with only one item

My application utilizes UI-Router, specifically with a state named Widgets that includes a query parameter accepting an array of widgets: const widgetsState = { name: "widgets", url: "/widgets?{widgets:string[]}", component: Widgets, pa ...

Adding a dynamic key-value pair object to an array using the JS push method

In my programming challenge, I am dealing with an array of objects that have dynamic keys and values. The structure is a bit complicated, but here's a simplified version: let products_row = [ { id: 1, category_id: 11, options: { &a ...

CSRF fails to execute during the initial post submission

This is my first time dealing with CSRF and reaching out to Stack Overflow for the first time. After struggling through the configuration, I finally managed to get it working almost perfectly. However, I ran into an issue where if I open a bookmarked page ...

Storing information in local storage as JSON using AngularJS

I am working on a form with the following fields: <form ng-submit="addState()"> <input ng-model="text1" type="text"> <input ng-model="text2" type="text"> <input ng-model="text3" type="text"> ...

Dealing with nested file includes in PHP and passing values to a JavaScript function

When the button is clicked on login.php, it triggers the execution of redirect.php. This redirect.php file carries out Twitter authentication, which includes invoking another file that eventually calls index.php. index.php provides the result in the form ...

Guide to implementing a personalized filter in AngularJS 1.6

I am struggling with injecting a custom filter, status, into my component. Below is the code for my component: function ClaimsListController(dpClaimsListService) { var ctrl = this; ctrl.claims = null; ctrl.searchCriterion = null; ctrl.l ...

Eliminate duplicate objects from arrays of objects by a specific key name

Here are some arrays of objects I am working with: var arr = [ {name: 'john', last: 'smith'}, {name: 'jane', last: 'doe'}, {name: 'johnny', last: 'appleseed'}, {name: 'johnson', ...