4 practical ways to invert arrays in JavaScript

 

This article mainly introduces 4 commonly used methods for reversing arrays in JavaScript. Reversing an array can reverse the order of elements in the array, so as to meet some specific needs. The code is introduced in great detail in this article. Friends who need it can refer to Down

1. Use a For loop to invert the array:

We will use a descending loop for this method to iterate over each element of the given array. The last element of the array will be the start of the loop (arr.length — 1) and it will run until the start of the array is reached (i ≥ 0)

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
function reverseArray1(arr) {
    var newArr = [];
    for (let index = arr.length - 1; index >= 0; index--) {
        newArr.push(arr[index]);
    }
    return newArr;
}
console.log(reverseArray1(arr));

The reverseArray1 function takes an array ( arr ) as a parameter and creates a new array ( newArr ) with the same elements in reverse order by looping backwards through the given array ( let i = arr.length - 1; i >= 0 ; i -- ). This solution doesn't modify the original array, because it pushes and stores elements in the new array, which takes extra space.

2. Use the Unshift() method to invert the array:

This method is not very different from the first method, because it also uses an extra variable to store the reversed array, so, the original array remains unchanged.

function reverseArray2(arr) {
    var newArr = [];
    arr.forEach(element => {
        // unshift() 方法可向数组的开头添加一个或更多元素，并返回新的长度。
        newArr.unshift(element);
    });
    return newArr;
}
console.log(reverseArray2(arr));

The reverseArray2 function traverses the given array ( arr ) from beginning to end. It uses the unshift method on the new array ( newArr ) and inserts each element at the beginning of the array ( newArr[0] ). The second solution is also less space efficient than the first solution because it requires more memory to store the reversed array in a different variable ( newArr ).

3. Invert the array in place: (change the original array)

Similar to the reverse method, our last method also modifies the original array by reversing its elements in place. This solution; reversing an array in-place is much more complicated than the previous two solutions.

function reverseArray3(arr) {
    for (let index = 0; index < Math.floor(arr.length / 2); index++) {
        // 借助第三方变量交换两个变量的值
        var temp = arr[index];
        arr[index] = arr[arr.length - 1 - index];
        arr[arr.length - 1 - index] = temp
    }
    return arr;
}
console.log(reverseArray3(arr));

在上面的代码中，我们使用Math.floor向下舍入( i < Math.floor(arr.length/2) ) i < Math.floor(arr.length/2)给定数组的一半元素。 然后将数组的元素放在第一位和最后一位，第二位与第二位到最后一位，依此类推。 代替使用局部绑定，我们使用数组解构来交换其元素。

4.直接调用 reverse()：

console.log(['a','b','c','d'].reverse());

到此这篇关于JavaScript反转数组常用的4种方法的文章就介绍到这了,希望可以帮到你。

转自：微点阅读   https://www.weidianyuedu.com