JS生成指定长度的可遍历数组方法

在js中生成指定长度数组的方法，最容易想到的是new Array(length)

//控制台演示
var fixedArr = new Array(4)

fixedArr.length
4 

fixedArr.forEach(()=>{console.log(2)})
undefined 

fixedArr.map((item)=>{console.log(2)})
Array(4) [ <4 empty slots> ]

可以看到，尽管打印 fixedArr.length 为4，但是使用数组身上的map，forEach等方法时，并不能遍历四次，也就是不能进行遍历。

而往往我们有这样的需求：直接简单的生成一个可遍历，指定长度的数组，甚至数组元素也是可以指定的。

例如：

使用合适且简单的方法生成一个[1,2,3,4,5,6,7,8,9,10]的数组

使用合适且简单的方法生成一个元素全为0或者undefine的数组

使用合适且简单的方法生成一个第一个元素为1，第100个元素为100，其余元素为undefine的数组

... ...

---

1.使用fill固定值填充数组

//控制台演示
const array = new Array(5).fill(undefined)


fixedArr.forEach((item)=>{console.log(item)}) 
undefined
undefined
undefined
undefined
undefined

同理可以生成全为0的数组

---

2.keys配合解构赋值

//控制台演示
const arr = [...new Array(3).keys()];
// 解构赋值触发生成器对象

console.log(arr)
[0,1,2]


//测试
let mappp = new Array(4).keys()

mappp.next()
Object { value: 0, done: false }

mappp.next()
Object { value: 1, done: false }

mappp.next()
Object { value: 2, done: false }

mappp.next()
Object { value: 3, done: false }

mappp.next()
Object { value: undefined, done: true }

---

3.遍历器配合Array.from

function* makeArr(n){
    while(n--){
        yield 0;
    }
}

console.log(Array.from(makeArr(5)))
//[0,0,0,0,0]



function* makeArr(n){
    while(n--){
        if(n===0){yield 1}
        else if(n===100){ yield 100}
        else yield ;
    }
}
let newArr = Array.from(makeArr(100)).reverse()

console.log(newArr)
//[1,undefine , undefine ,.......,100]