Merge the elements of one array with the elements of another array simultaneously

Can a function be created that combines each value from two arrays, even if the arrays are of different lengths? For example:

arr1 = ["apple", "banana", "cherry"];
arr2 = ["pear", "kiwi", "orange"]

mergedArr= ["applepear", "applekiwi", "appleorange", "bananapear", "bananakiwi", "banannaorange", "cherrypear", "cherrykiwi", "cherryorange"...]

Answer №1

it seems that there is no equivalent in javascript as far as I can see. However, you have the option to write it yourself.

let array1 = ["one", "two", "three"];
let array2 = ["twenty", "thirty", "forty", "fifty"]

let newArray= array2.map(x=>array1.map(y=>x+y)).flat()

console.log(newArray)


additionally, using Array.forEach would result in undefined, so it's recommended to utilize map for this process.

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

Dynamic x-axis movement with interactive Google Line Chart functionality

I am struggling with implementing Google charts, After reviewing Real-time changing point chart with Google Charts, I realized it is not providing the solution I need. I aim to achieve a similar result as shown in this example: Is there a method for me t ...

Steps for resolving the Error: ENOENT - file or directory not found:

After numerous attempts, I am still facing difficulties deploying my site to GitHub Pages. Whenever I run npm run deploy, the following error message persists: **Error: ENOENT: no such file or directory, stat 'C:\Users\Wordsoft Ent\OneD ...

Performing MongoDB aggregation to tally the number of documents in a query for every array field

Here's an example through JS code of what I'm trying to achieve: let waiting = findSessions() // regular query for status "WAITING" let results = []; for (let w of waiting) { // Only push it to results if the w.members[0] and TARGET_USER_ID h ...

What is the Most Effective Way to Arrange an Array of Objects Based on Property or Method?

Looking for ways to enhance my array sorting function, which currently sorts by property or method value. The existing code is functional, but I believe there's room for improvement due to redundant sections. optimizeSort(array: any, field: string): ...

The decision will be dependent on the outcomes provided by the $resource promise

I have been working on calling my API with AngularJS to retrieve a list of 'reports' and then displaying them in a modal or saving the sale depending on whether any results were returned. I've been struggling with this for a while and would ...

Dynamic sidebar that adheres to the content and is placed alongside it using JavaScript

I am in need of creating a sticky sidebar that will float beside my content column. The purpose of this sidebar is to contain jump links on the page, similar to what can be seen on this page, but with the navigation buttons positioned directly next to the ...

Using JavaScript to Generate Formatting Tags Based on User Selections from a Multiselect Dropdown

When a user selects formatting options (such as bold, italic, underline) from a multiselect dropdown, I need to generate corresponding formatting tags. For example, if the user selects bold and italic, I should create a tag like <b><i></i&g ...

Loading website with continuous HTML5 video playback

I'm currently working on a website that features a large section with a video background set to loop. To enhance the user experience, we decided to include a preloading image while the site loads its resources. Our current setup involves using jQuery ...

How can you optimize the storage of keys in JS objects?

Just pondering over this scenario: Consider a line definition like the one below, where start and end are both points. let ln = { s: {x:0, y:0}, e: {x:0, y:0}, o: 'vertical' } Now imagine having a vast array of lines, how can we sav ...

Is it possible to utilize components or directives in both AngularJS and Angular when developing a hybrid application?

Is it possible to use AngularJS directives/services that have been "upgraded" in a hybrid app created with ngUpgrade for migrating from AngularJS to Angular? Can Angular components that are "downgraded" still be used on the Angular side as well? While res ...

The full screen menu is exclusively displayed in the navigation bar

My HTML and CSS code is causing an issue where the full-screen menu only appears in the nav bar. This problem seems to be specific to Safari. To solve the issue, I need to remove the following code: .nav { position: fixed; } However, I still ...

When an input is disabled in "react-hook-form", it may return undefined

Within my React application, there exists a form containing various input fields. I have enclosed these fields using FormProvider imported from react-hook-form and utilized register within each field. import { useForm, FormProvider, useFormContext } from & ...

Tips on maintaining the Parent menu in a hovered state when the mouse is over the child menu within a Dropdown Menu

I have been working on creating a dropdown menu that functions correctly. However, I am facing an issue where the top menu, when hovered, turns white, but as soon as I move down to the submenus, the top menu reverts back to its original color. Is there a ...

When attempting to input a value in the middle of the line, the cursor unexpectedly leaps to the end

I have successfully created a code that prevents spaces at the beginning and special characters in an input field. The code is working perfectly, but there is an issue with the cursor moving to the end when trying to type at the beginning or middle of the ...

I am looking to implement a dropdown menu that appears after clicking on an image. Any suggestions on how to achieve this using

I've been experimenting with adding a dropdown class, but I'm feeling a bit lost on where to start. Here's a snippet of code that shows what I'd like to do to add a dropdown menu: <span id="dropdown-info" ng-init= "myVar='i ...

Choose a drop-down menu with a div element to be clicked on using Puppeteer

Issue Description: Currently encountering a problem with a dropdown created using material select. The dropdown is populated through an API, and when selected, ul > li's are also populated in the DOM. Approaches Tried: An attempt was made to res ...

Querying the database to check for the presence of a file in a .js file on Google App Engine

I'm currently working on implementing an upload button for users to upload files to our storage system using Google App Engine with Python, as well as HTML and JavaScript for the views. To achieve this, we have an HTML file and a.js script that promp ...

Place a checkbox at the start of each table cell

Is there a way to add a checkbox before the text in the first cell of each row in an HTML table using jQuery? I attempted this method: $("table td:first-child").each(function() { $(this).prepend('<input type="checkbox" class="basic-kpi-row"/&g ...

Looking for assistance in creating an html page with a rotating CSS div containing unordered lists and list items

I am sharing the HTML content of my test page that I am looking to customize similar to some websites I have come across. My goal is to create a rotating div with an unordered list (ul li), where only three divs are displayed at a time while the rest remai ...

Insert a page break after content for desktop browsers

Is it possible to control the display of sections on different screen sizes? I have a page that looks good on 15" laptops, but larger resolutions cause the next section to appear on the first screen. Is there a way to show the next section only on th ...