js中如何向數(shù)組中添加元素unshift()方法

更新時間：2023年12月18日 16:43:39 作者：藍關(guān)故人

這篇文章主要介紹了js中如何向數(shù)組中添加元素unshift()方法,具有很好的參考價值,希望對大家有所幫助,

js向數(shù)組中添加元素unshift()

將新項添加到數(shù)組起始位置：

實例

將新項添加到數(shù)組起始位置：

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon","Pineapple");

fruits 將輸出：

Lemon,Pineapple,Banana,Orange,Apple,Mango

定義和用法

unshift() 方法可向數(shù)組的開頭添加一個或更多元素，并返回新的長度。

注意： 該方法將改變數(shù)組的數(shù)目。

提示：將新項添加到數(shù)組末尾，請使用push()方法。

js unshift性能分析

js unshift()方法可以向數(shù)組的頭部添加元素并返回新的數(shù)組長度，我們手寫一個unshift() 方法

Array.prototype._unshift = function () {
        let arr = this
        let oldLen = this.length
        let argLen =  arguments.length
        let newLen = oldLen + argLen
        for (let i = oldLen - 1; i >= 0; i--) {
            arr[i + argLen] = arr[i]
        }
        for (let i = 0; i < argLen; i++) {
            arr[i] = arguments[i]
        }
        return newLen
    }
    let arr1 = [1, 3, 4, 5, 6]
    console.log(arr1._unshift(7, 8, 1),arr1); // 8, [7, 8, 1, 1, 3, 4, 5, 6]

從上面代碼可以看出先把元素往后移動，再添加元素，對于數(shù)組長度很大的情況下性能是比較差的。

但是我們可以先push(), 然后再reverse() ，效率更快。

咱們手寫一下push和reverse做下對比

 Array.prototype._push = function () {
        let arr = this
        let len = arguments.length
        for(let i = 0; i < len; i++) {
            this[this.length] = arguments[i]
        }
        return this.length
    }
    let arr = [2, 54, 65, 3, 4]

Array.prototype._reverse = function () {
        let arr = this
        let j = arr.length - 1
        for(let i = 0; i < j; i++,j--) {
            let curLeft = arr[i]
            let curRight = arr[j]
            arr[i] = curRight
            arr[j] = curLeft
        }
        return arr
    }

可以看出reverse和push的時間復(fù)雜度要低。實際對比下

 let arr = []
 console.time('time1')
 for(let i = 0 ;i< 10000; i++) {
     arr.unshift(i)
 }
 console.timeEnd('time1')   // 平均耗時 5ms

    let arr = []
    console.time('time2')
    for(let j = 0 ;j< 10000; j++) {
       arr.push(j)
    }
    arr.reverse()
    console.timeEnd('time2')  // 平均耗時 0.47ms