這是我在github 上發(fā)現(xiàn)的一個原生js挑戰(zhàn)項(xiàng)目钓猬，由于是js小白滑肉，希望通過這次的項(xiàng)目加深對js的理解
第4天主要是一些關(guān)于數(shù)組的操作
*filter
mapsortreduce
新的調(diào)試方式
以往我們習(xí)慣于用console,log()來輸出通殃，本次練習(xí)出現(xiàn)了console.table()這種新方式,將數(shù)據(jù)以表格的形式顯示
效果圖
js數(shù)組的操作（重點(diǎn)）
- filter
正如英文名一樣，這是一個過濾器,filter() 方法創(chuàng)建一個新數(shù)組, 其包含通過所提供函數(shù)實(shí)現(xiàn)的測試的所有元素唐含。MDN中給出的例子是這樣子的：
function isBigEnough(value) {
return value >= 10;
}
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44]
// ES6 way
const isBigEnough = value => value >= 10;//類似function(value){return value>=10}
let [...spraed]= [12, 5, 8, 130, 44];//...代表不定參數(shù)
let filtered = spraed.filter(isBigEnough);
// filtered is [12, 130, 44]
該例子是篩選出數(shù)組中大于10的元素
- map
map() 方法創(chuàng)建一個新數(shù)組松却，其結(jié)果是該數(shù)組中的每個元素都調(diào)用一個提供的函數(shù)后返回的結(jié)果。（即把數(shù)組中的每個元素進(jìn)行處理后幢踏，返回一個新的數(shù)組）
// 使用三個參數(shù)
const numbers = [1, 2, 3, 4, 5];
let arr = numbers.map((currentValue, index, array) => {
console.log(`currentValue = `, currentValue);
console.log(`index = `, index);
console.log(`array= `, array);
return currentValue * 2;
}, numbers);
console.log(`arr `, arr);
let numbers = [1, 5, 10, 15];
let doubles = numbers.map((x) => {
return x * 2;
});
// doubles is now [2, 10, 20, 30]
// numbers is still [1, 5, 10, 15]
let numbers = [1, 4, 9];
let roots = numbers.map(Math.sqrt);
// roots is now [1, 2, 3]
// numbers is still [1, 4, 9]
//即map()不改變原數(shù)組
- sort
sort()是一種冒泡排序髓需，默認(rèn)排序順序是根據(jù)字符串Unicode碼點(diǎn)
var fruit = ['cherries', 'apples', 'bananas'];
fruit.sort();
// ['apples', 'bananas', 'cherries']
var scores = [1, 10, 21, 2];
scores.sort();
// [1, 10, 2, 21]
// 注意10在2之前,
// 因?yàn)樵?Unicode 指針順序中"10"在"2"之前
var things = ['word', 'Word', '1 Word', '2 Words'];
things.sort();
// ['1 Word', '2 Words', 'Word', 'word']
// 在Unicode中, 數(shù)字在大寫字母之前,
// 大寫字母在小寫字母之前.
如果想要升序或者降序，我們需要價格比較函數(shù)房蝉，例如
function compareNumbers(a, b) {
return a - b;
}
- reduce
reduce這是一個歸并數(shù)組的方法僚匆，它接受一個函數(shù)作為參數(shù)（這個函數(shù)可以理解成累加器）微渠，它會遍歷數(shù)組的所有項(xiàng)，然后構(gòu)建一個最終的返回值咧擂，這個值就是這個累加器的第一個參數(shù),第二個參數(shù)為可選項(xiàng)逞盆，其值用于第一次調(diào)用 callback 的第一個參數(shù)。如果沒有設(shè)置初始值松申，則將數(shù)組中的第一個元素作為初始值云芦。空數(shù)組調(diào)用reduce時沒有設(shè)置初始值將會報錯贸桶。
var total = [0, 1, 2, 3].reduce(function(sum, value) {
return sum + value;
}, 0);
// total is 6
以上就是我在day4中學(xué)到的知識舅逸，這里我參考了soyaine的中文指南
