JS快速構建數組方法

一、常用(普通)數組的構建

1.1 直接構建

let arr = ['mock1', 'mock2', 'mock3']

1.2 通過new Array

let arr = newArray('mock1', 'mock2', 'mock3')

let arr1 = newArray();
arr1[0] = 'mock1'
arr1[1] = 'mock2'
...

//array可設定長度,但對於map並沒什么用,后面詳細介紹
let arr1 = new Array(9)

二、特殊數組的構建

2.1 構建相同內容的數組

直接構建法:
簡單粗暴不推薦,如果數據多,不僅構建麻煩,而且不美觀

let arr = ['mock', 'mock', 'mock']

循環法: for循環
比第一種要好,但是代碼依然不美觀

let arr = [];
for(var i = 0;i < 3;i++){
    arr.push('mock')
}

fill: 使用一個固定值來填充數組
這種顯然就方便又美觀多了！

let newArr = new Array(3);
newArr.fill('mock')

2.1 構建順序(倒序數組)

直接構建法:
數據多起來,10條、20條可要了親命

let arr = ['mock1', 'mock2', 'mock3'...]

循環法: for循環
和2.1一樣的道理

let arr = [];
for(var i = 0;i < 10;i++){
    arr.push(`mock${i+1}`)
}

fill + map實現
這種顯然就方便又美觀多了！

let newArr = new Array(10).fill('').map( (item, index) => index+1);

console.log(newArr)

可以完美打印出[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

簡單解釋一下原理.
之所以要用fill結合map，因為new Array創建的空數組是無法map的.
比如new Array(3)創建的數組是[,,,],用map進行循環得不到任何結果.當然你說可以用for和length,我只是不太喜歡用for.map看起來更簡潔舒服

所以我們新建了數組要向數組里真真切切填充一個(任何)數,因為到后面,其值還是會被map代替。

let arr = new Array(10).fill('任何數')

這時候就可以使用map方法了,然后通過每次return返回的值改變當前數組位置的值

arr.map( (item, index) => index+1 )

上面有幾點要注意:

1. map的時候,需要用的是序號值index,item(數組的值)對我們是沒有意義的
2. 當箭頭函數的內容只有一行的時候,會自動return該行內容

總之,還是建議大家盡可能使用高質量、簡潔的代碼去構建項目.這樣對性能也好,后面維護項目也好,都有很大的作用