Cycle through an array a specified number of times while shifting elements

Question

Cycle through an array a specified number of times while shifting elements

Imagine you have an array like [1,2,3,4,5], and you want to rotate it a total of 3 times. After the first rotation, the array should look like [2,3,4,5,1]. You need a solution that can handle rotating the array any number of times without manual intervention. Here's an attempt at creating a function to rotate the array:

function rotateLeft(arr, n) {
    var newArr = [];
         for( let i=1; i< arr.length; i++){
            newArr.push(arr[i]);
        }
            newArr.push(arr[0]);
        
    console.log(newArr);
}

rotateLeft([1,2,3,4,5], 3);

javascript arrays

Answer 1

Answer №1

Rearrange the elements of an array by pushing the first element to the end using a while loop

const originalArray = [1,2,3,4,5];
console.log(`Original Array: [${
  originalArray}], Rearranged Array: [${
    rearrangeArray(originalArray, 3)}]`);

function rearrangeArray(array, times) {
  // if you want to mutate the original array
  // omit cloning
  const clonedArray = [...array];
  while (times--) {
    clonedArray.push(clonedArray.shift());
  };
  return clonedArray;
}

Answer 2

Rearrange the elements of an array by pushing the first element to the end using a while loop

const originalArray = [1,2,3,4,5];
console.log(`Original Array: [${
  originalArray}], Rearranged Array: [${
    rearrangeArray(originalArray, 3)}]`);

function rearrangeArray(array, times) {
  // if you want to mutate the original array
  // omit cloning
  const clonedArray = [...array];
  while (times--) {
    clonedArray.push(clonedArray.shift());
  };
  return clonedArray;
}

Answer 3

Answer №2

Instead of performing an in-place rotation of the array, a new array is created to achieve a simpler solution:

function rotateLeft(arr, n) {
  n %= arr.length;
  return [...arr.slice(n), ...arr.slice(0, n)];
}

// Generating an array filled with numbers
const arr = [...Array(20).keys()];

console.log(...arr);

// Rotating the array left by 8 positions
console.log(...rotateLeft(arr, 8));

// Rotating the array left by -22 positions (equivalent to rotating right by 22)
// Since the length of the array is 20
// This is the same as rotating left by -2 
// Which is equivalent to rotating left by 18 positions
console.log(...rotateLeft(arr, -22));

Answer 4

Instead of performing an in-place rotation of the array, a new array is created to achieve a simpler solution:

function rotateLeft(arr, n) {
  n %= arr.length;
  return [...arr.slice(n), ...arr.slice(0, n)];
}

// Generating an array filled with numbers
const arr = [...Array(20).keys()];

console.log(...arr);

// Rotating the array left by 8 positions
console.log(...rotateLeft(arr, 8));

// Rotating the array left by -22 positions (equivalent to rotating right by 22)
// Since the length of the array is 20
// This is the same as rotating left by -2 
// Which is equivalent to rotating left by 18 positions
console.log(...rotateLeft(arr, -22));

Cycle through an array a specified number of times while shifting elements

Answer №1

Answer №2

Similar questions

Is there a way to create dynamic documents in Firestore using Angular?

Having difficulty retaining the value of a variable following the retrieval of JSON data

what is the method for passing query string parameters in an XMLHttpRequest to a PHP page

Issue with displaying mysql row object as variable in pug view's javascript in Express.js manifests as 'undefined' output

Incomplete Json information

"Looking for a datetime picker plugin that works well with Bootstrap

Python function for sorting elements into arrays within bins

Creating objects based on interfaces

Error: You cannot implement an import statement beyond a module while utilizing reactjs CDN Links

Customized content is delivered to every client in real-time through Meteor

In the Node environment, why does null evaluate as less than 3 while also being greater than 3?

Python's version of the Game of Life is not functioning correctly

Invoking a function from a higher-level parent scope within multiple layers of nested directives

Ways to ensure ngModel is accessible across components

Creating unique border-radius for each point in a Highcharts column chart with React

Gradually bringing a tag into view, gently fading it away, and then altering the text before beginning the cycle anew

eliminating the hues beneath the lines on Morris region charts

Accessing the Selected Value in Javascript

What is behind the peculiar reaction when checkboxes are used in React?

Storing a portion of AJAX response as a PHP variable