1、遞歸(最容易想到的)
const arrWithoutLoop = (n) => {
if (n === 0) {
return [];
}
let result = [];
result.unshift(--n); //將元素添加到數組開頭
if (n === 0) {
return result;
} else {
return arrWithoutLoop(n).concat(result);
}
};
console.log(arrWithoutLoop(10)); //[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
2下梢、setInterval(也容易想到)
let arr = [];
let index = 0;
let pushArray = setInterval(function() {
arr[index] = index++;
if (index >= 10) {
clearInterval(pushArray);
console.log(arr);//[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
}
}, 0);
上面兩種比較的消耗性能巩搏,下面介紹幾種比較高級一點的
3册舞、利用Array的方法Array?.from()
Array.from(arrayLike[, mapFn[, thisArg]]) 方法從一個類似數組或可迭代對象中創(chuàng)建一個新的數組實例骚露。
第二個參數如果指定了蹬挤,新數組中的每個元素會執(zhí)行該回調函數。
let arr = Array.from({ length: 10 }, (value, key) => key);
console.log(arr);
4棘幸、利用Array?.prototype?.map()和Array?.prototype?.join()
map() 方法創(chuàng)建一個新數組焰扳,其結果是該數組中的每個元素都調用一個提供的函數后返回的結果。
但是如果元素是空的(不是null或者undefined)误续,則map會跳過吨悍,不會遍歷。
let originArr = new Array(3);
originArr[1] = undefined;
originArr[2] = null;
console.log(originArr);
let temArr = originArr.map(function(value, index) {
return index;
});
console.log(temArr);
使用new Array()
,創(chuàng)建的是一個空數組(每項都是empty)蹋嵌,如果直接使用map,那就無法遍歷了育瓜,這是就需要使用Array?.prototype?.join()
(使用toString()
也可以)
join() 方法將一個數組(或一個類數組對象)的所有元素連接成一個字符串并返回這個字符串。如果數組只有一個項目欣尼,那么將返回該項目而不使用分隔符。如果一個元素為 undefined 或 null,它會被轉換為空字符串愕鼓。
let originArr = new Array(3);
console.log(originArr[0]);//undefined
let temArr = originArr.join(',');
console.log(temArr);// , ,
這是钙态,就可以利用String?.prototype?.split(),將jion()生成的字符串分割成數組菇晃。
String?.prototype?.split()
方法使用指定的分隔符字符串將一個String
對象分割成字符串數組册倒,以將字符串分隔為子字符串,以確定每個拆分的位置磺送。當字符串為空時驻子,split()返回一個包含一個空字符串的數組,而不是一個空數組估灿,如果字符串和分隔符都是空字符串崇呵,則返回一個空數組。
利用這一特性就可以生產一個空字符串數組馅袁,就可以使用
map()
遍歷了域慷。
let arr = new Array(10);
console.log(arr); //[empty × 10]
let mArr = arr.join(",").split(",");
//let mArr = arr.toString().split(",");
console.log(mArr);//["", "", "", "", "", "", "", "", "", ""]
mArr = mArr.map(function(value, index) {
return index;
});
console.log(mArr);//[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
這個方式就比較考驗對于Array API的熟練程度了
5、rest 參數和Array?.prototype?.keys()
ES6新特性汗销,給我們提供了很多簡便方法犹褒。
rest 參數
ES6 引入 rest 參數(形式為...變量名),用于獲取函數的多余參數弛针,這樣就不需要使用arguments對象了叠骑。rest 參數搭配的變量是一個數組,該變量將多余的參數放入數組中削茁。
let mArr =[1,2,3,4];
let newMArr=[...mArr];
console.log(newMArr);//[1, 2, 3, 4]
利用這樣特性宙枷,配合keys()
,可以生產數組
const mArrWithoutLoop = (n) => [...new Array(n).keys()];
console.log(mArrWithoutLoop(10));//[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
6、 Object.keys()和Function?.prototype?.apply()
Object.keys()
方法會返回一個由一個給定對象的自身可枚舉屬性組成的數組付材,數組中屬性名的排列順序和使用for...in
循環(huán)遍歷該對象時返回的順序一致 朦拖。
Function?.prototype?.apply()
方法調用一個具有給定this值的函數,以及作為一個數組(或類似數組對象)提供的參數厌衔。
由于apply傳遞的參數可以使類似數組對象璧帝。
console.log( Array instanceof Function);//true
console.log( Array.apply([], { length: 3 }));//[undefined, undefined, undefined]
console.log( Array(3));//[empty × 3]
上面代碼可以生成不是[empty × n]的數組
let createArray = Object.keys(Array.apply([], { length: 10 }));
console.log(createArray);//["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"]
createArray=createArray.map(function(value,index){
return +value;
});
console.log(createArray);[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
總結
其實總結來說,除了第一第二種富寿,其他就是利用提供的API生成一個數組睬隶,這樣我們就可以改變里面的數據。由于map()
遍歷的要求页徐,只有生產不為[empty *n ]
的數組苏潜。