• 0

JS Array Mix


Question

If I had 2 arrays that looked like this:

 

["1", "2", "3", "4", "5"]

and

["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K"]

 

and I wanted to make it end up like this:

["A", "1", "B", "2", "C", "3", "C", "4", "E", "5", "F", "G", "H", "I", "J", "K"]

 

What would be the easiest way to do it in JS, especially assuming that we may never know the length of the first two arrays?  It should also allow duplicates.

 

Thank you.

Link to comment
https://www.neowin.net/forum/topic/1422426-js-array-mix/
Share on other sites

7 answers to this question

Recommended Posts

  • 0

I've found the solution:

 

var arr1 = ["1", "2", "3", "4", "5"],
    arr2 = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K"],
    arr3 = [],
    arrLen = Math.min(arr1.length, arr2.length);
    
for (i = 0; i < arrLen; i++) {
    result.push(arr1[i], arr2[i]);
}

arr3.push(...arr1.slice(arrLen), ...arr2.slice(arrLen));
console.log(arr3);

 

  • Like 1
Link to comment
https://www.neowin.net/forum/topic/1422426-js-array-mix/#findComment-598769185
Share on other sites

  • 0

Your code seems way too complicated for no reason. Here's a better solution if you don't mind modifying the source arrays

 

let array1 = ["1", "2", "3", "4", "5"];
let array2 = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K"];
let array3 = [];

while (array1.length > 0 || array2.length > 0)
{

	if (array1.length > 0)  array3.push(array1.shift())
	if (array2.length > 0)  array3.push(array2.shift())

}

 

 

Edited by PmRd
  • Like 1
  • Thanks 1
Link to comment
https://www.neowin.net/forum/topic/1422426-js-array-mix/#findComment-598769186
Share on other sites

  • 0
  On 16/10/2022 at 03:23, PmRd said:

Your code doesn't work and seems way too complicated for no reason. Here's a better solution if you don't mind modifying the source arrays

 

let array1 = ["1", "2", "3", "4", "5"];
let array2 = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K"];
let array3 = [];

while (array1.length > 0 || array2.length > 0)
{

	if (array1.length > 0)  array3.push(array1.shift())
	if (array2.length > 0)  array3.push(array2.shift())

}

 

 

Expand  

Thank you. Your method is much more elegant

  • Like 2
Link to comment
https://www.neowin.net/forum/topic/1422426-js-array-mix/#findComment-598769189
Share on other sites

  • 0
  On 16/10/2022 at 03:30, Brian Miller said:

Thank you. Your method is much more elegant

Expand  

If you want the source arrays to remain intact you can do this instead

 

let array1 = ["1", "2", "3", "4", "5"];
let array2 = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K"];

function mix(arr1, arr2) {
  
    let array1clone = [...arr1];
    let array2clone = [...arr2];
  
    let result = [];
  
    while (array1clone.length > 0 || array2clone.length > 0)
    {

      if (array1clone.length > 0)  result.push(array1clone.shift())
      if (array2clone.length > 0)  result.push(array2clone.shift())

    }
  
    return result;
  
}

console.log(mix(array1, array2));

 

  • Like 1
Link to comment
https://www.neowin.net/forum/topic/1422426-js-array-mix/#findComment-598769190
Share on other sites

  • 0
  On 16/10/2022 at 03:35, PmRd said:

If you want the source arrays to remain intact you can do this instead

 

let array1 = ["1", "2", "3", "4", "5"];
let array2 = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K"];

function mix(arr1, arr2) {
  
    let array1clone = [...arr1];
    let array2clone = [...arr2];
  
    let result = [];
  
    while (array1clone.length > 0 || array2clone.length > 0)
    {

      if (array1clone.length > 0)  result.push(array1clone.shift())
      if (array2clone.length > 0)  result.push(array2clone.shift())

    }
  
    return result;
  
}

console.log(mix(array1, array2));

 

Expand  

I like that. Thank you

Link to comment
https://www.neowin.net/forum/topic/1422426-js-array-mix/#findComment-598769191
Share on other sites

  • 0

Here's a fancy-pants version that supports an arbitrary number of arrays and also sparse arrays:

 

function mixArrays(...arrays) {

    const arrayLengths = arrays.map(array => array.length);
    const maxLength = Math.max(...arrayLengths);
    
    let result = [];

    for (let index = 0; index < maxLength; index++) {
        for (let array of arrays) {
            if (index in array) {
                result.push(array[index]);
            }
        }       
    }

    return result;
}

 

Example with two arrays:

 

let array1 = ["1", "2", "3", "4", "5"];
let array2 = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K"];
let array3 = ["a", "b", "c"];

mixArrays(array1, array2);
// ['1', 'A', '2', 'B', '3', 'C', '4', 'D', '5', 'E', 'F', 'G', 'H', 'I', 'J', 'K']

 

Three arrays:

 

mixArrays(array1, array2, array3);
// ['1', 'A', 'a', '2', 'B', 'b', '3', 'C', 'c', '4', 'D', '5', 'E', 'F', 'G', 'H', 'I', 'J', 'K']

 

And sparse arrays:

 

array1[8] = "8";

mixArrays(array1, array2);
// ['1', 'A', '2', 'B', '3', 'C', '4', 'D', '5', 'E', 'F', 'G', 'H', '8', 'I', 'J', 'K']

 

  • Like 1
Link to comment
https://www.neowin.net/forum/topic/1422426-js-array-mix/#findComment-598769244
Share on other sites

  • 0
  On 16/10/2022 at 12:39, DonC said:

Here's a fancy-pants version that supports an arbitrary number of arrays and also sparse arrays:

 

function mixArrays(...arrays) {

    const arrayLengths = arrays.map(array => array.length);
    const maxLength = Math.max(...arrayLengths);
    
    let result = [];

    for (let index = 0; index < maxLength; index++) {
        for (let array of arrays) {
            if (index in array) {
                result.push(array[index]);
            }
        }       
    }

    return result;
}

 

Example with two arrays:

 

let array1 = ["1", "2", "3", "4", "5"];
let array2 = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K"];
let array3 = ["a", "b", "c"];

mixArrays(array1, array2);
// ['1', 'A', '2', 'B', '3', 'C', '4', 'D', '5', 'E', 'F', 'G', 'H', 'I', 'J', 'K']

 

Three arrays:

 

mixArrays(array1, array2, array3);
// ['1', 'A', 'a', '2', 'B', 'b', '3', 'C', 'c', '4', 'D', '5', 'E', 'F', 'G', 'H', 'I', 'J', 'K']

 

And sparse arrays:

 

array1[8] = "8";

mixArrays(array1, array2);
// ['1', 'A', '2', 'B', '3', 'C', '4', 'D', '5', 'E', 'F', 'G', 'H', '8', 'I', 'J', 'K']

 

Expand  

Thank you, that is totally fancy pants!!! :D

 

Link to comment
https://www.neowin.net/forum/topic/1422426-js-array-mix/#findComment-598769384
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Posts

    • That explains my recent issues with classic Outlook. I can see the FORMS2 folder has resolved the issue on my system.
    • Brave 1.79.126 by Razvan Serea Brave Browser is a lightning-fast, secure web browser that stands out from the competition with its focus on privacy, security, and speed. With features like HTTPS Everywhere and built-in tracker blocking, Brave keeps your online activities safe from prying eyes. Brave is one of the safest browsers on the market today. It blocks third-party data storage. It protects from browser fingerprinting. And it does all this by default. Speed - Brave is built on Chromium, the same technology that powers Google Chrome, and is optimized for speed, providing a fast and responsive browsing experience. Brave Browser also features Brave Rewards, a system that rewards users with Basic Attention Tokens (BAT) for viewing opt-in ads. This innovative system provides an alternative revenue model for content creators and a way to support the Brave community. Brave 1.79.126 changelog: Fixed crash when clicking on shields panel in certain cases. Fixed crash on navigation when a Google sign-in request has been triggered. (#46769) Fixed crash when Leo generates empty list when clicking on “Suggest questions” while using BYOM (Bring Your Own Model). (#46843) Fixed issue importing from Trezor wallet when Trezor Connect is outdated. (#46660) Upgraded Chromium to 137.0.7151.119. (#46911) Download: Brave Browser 64-bit | 1.2 MB (Freeware) Download: Brave Browser 32-bit View: Brave Homepage | Offline Installers | Screenshot Get alerted to all of our Software updates on Twitter at @NeowinSoftware
    • LeafView 3.6.5 by Razvan Serea LeafView is a fast, open-source image viewer built with Electron. It offers a sleek, minimal UI for fast and efficient image browsing. Supporting various formats, LeafView ensures a smooth viewing experience with essential features like zoom, rotation, and slideshow mode. Designed for simplicity and performance, it utilizes hardware acceleration for smooth rendering and supports touch gestures for seamless navigation. LeafView key features: Lightweight & Open-Source – Minimal resource usage with a clean, efficient design Electron-Based – Cross-platform compatibility with modern UI Multiple Image Format Support – Opens JPG, PNG, GIF, BMP, and more Smooth Rendering – Hardware acceleration for fast performance Essential Image Controls – Zoom, rotate, and slideshow mode Touch Gesture Support – Seamless navigation on compatible devices Minimal UI – Focused on simplicity and ease of use LeafView 3.6.5 changelog: Update electron to v36.5.0 Download: LeafView 3.6.5 | Portable | ~100.0 MB (Open Source) View: LeafView Website | Other operating systems | Screenshot Get alerted to all of our Software updates on Twitter at @NeowinSoftware
    • Which is why I continue to use Open Shell for my start menu. your best course of action is to install a third-party Start menu
  • Recent Achievements

    • First Post
      Fuzz_c earned a badge
      First Post
    • First Post
      TIGOSS earned a badge
      First Post
    • Week One Done
      slackerzz earned a badge
      Week One Done
    • Week One Done
      vivetool earned a badge
      Week One Done
    • Reacting Well
      pnajbar earned a badge
      Reacting Well
  • Popular Contributors

    1. 1
      +primortal
      700
    2. 2
      ATLien_0
      280
    3. 3
      Michael Scrip
      208
    4. 4
      +FloatingFatMan
      196
    5. 5
      Steven P.
      130
  • Tell a friend

    Love Neowin? Tell a friend!