本節(jié)主要講解數(shù)組的方法
- forEach
- map
- filter
- find
- every
- some
- reduce
先說原始的方法
var arr = [1,2,3,4,5];
for(var i=0;i<arr.length;i++)
{
console.log(arr[i]);
}
ES6的方法
(1)forEach方法
//第一種寫法:
let arr = [1, 2, 3, 4, 5, 6];
arr.forEach((item, index) => {
console.log(item + "||" + index);
})
//第二種寫法:
let arr = [1, 2, 3, 4, 5, 6];
function abc(item, index) {
console.log(item + "||" + index);
}
arr.forEach(abc);
(2)map方法
- 有map必有return否則和foreach一樣,因?yàn)閙ap有返回值,要是不寫新的數(shù)組存的就是undefined
map 第一種寫法
let arr = [1, 2, 3, 4, 5, 6];
function abc(item, index) {
return item + 1;
}
let arr1 = arr.map(abc);
console.log(arr1);
map第二種寫法
let arr2 = [3, 4, 5, 6, 7];
let arr3 = arr2.map((item, index) => {
return item * 2;
})
console.log(arr3);
map第三種寫法
let arr4 = [
{ id: 1, age: 23, name: "哈哈", sex: "男" },
{ id: 2, age: 20, name: "呵呵", sex: "女" },
{ id: 3, age: 15, name: "嘿嘿", sex: "女" },
{ id: 4, age: 11, name: "啪啪", sex: "男" },
];
let arr5 = arr4.map((item, index) => {
return item.name;
})
console.log(arr5);
(3)filter過濾器
- filter必有return
//場景一
//假定有一個對象數(shù)組(A)獲取數(shù)組中指令類型的對象放到數(shù)組B中
let arr = [
{ id: 1, age: 23, name: "哈哈", sex: "男" },
{ id: 2, age: 20, name: "呵呵", sex: "女" },
{ id: 3, age: 15, name: "嘿嘿", sex: "女" },
{ id: 4, age: 11, name: "啪啪", sex: "男" },
];
let arr2 = arr.filter((content, index) => {
return content.sex == "男"
})
console.log(arr2);
//場景 二
//假定有一個數(shù)組(A)過濾掉不滿足一下條件的黎比。
//條件:性別男响疚,并且年齡大于20的
let arr = [
{ id: 1, age: 23, name: "哈哈", sex: "男" },
{ id: 2, age: 20, name: "呵呵", sex: "女" },
{ id: 3, age: 15, name: "嘿嘿", sex: "女" },
{ id: 4, age: 11, name: "啪啪", sex: "男" },
];
let arr3 = arr.filter((item, index) => {
return item.sex === "男" && item.age > 20
})
console.log(arr3);
//場景三
//假定兩個數(shù)組(a,b)根據(jù)A中id值乾巧,過濾掉B數(shù)組中不符合的數(shù)據(jù)
let arr = [
{ id: 1, age: 23, name: "哈哈", sex: "男" },
{ id: 2, age: 20, name: "呵呵", sex: "女" }
];
let arr2 = [
{ id: 1, age: 23, name: "哈哈", sex: "男" },
{ id: 2, age: 20, name: "呵呵", sex: "女" },
{ id: 3, age: 15, name: "嘿嘿2", sex: "女" },
{ id: 4, age: 11, name: "啪啪2", sex: "男" },
];
function filter(arr, arr2) {
let result = [];
arr2.filter((content, index) => {
result.push(arr.filter((item, index2) => {
return item.age == content.age && item.name == content.name;
})[0]);
})
let result2 = result.filter((item, index) => {
return item
})
return result2;
}
console.log(filter(arr, arr2));
//場景四
//去掉undefined
let arr4 = [1, 2, 3, undefined, undefined];
let arr3 = arr4.filter((content, index) => {
return content;
})
console.log(arr3);
無論是map還是filter他返回的都是一個新的數(shù)組
(4) find 找到符合條件的
find必有return并且他找到以后就不會往下執(zhí)行了隙咸,也就是說要是有2個符合條件的,他只能找到第一個,返回的不是數(shù)組
/*假定有一個對象數(shù)組A找到符合條件的對象*/
let arr2 = [
{ id: 1, age: 23, name: "哈哈", sex: "男" },
{ id: 2, age: 20, name: "呵呵", sex: "女" },
{ id: 3, age: 15, name: "嘿嘿2", sex: "女" },
{ id: 4, age: 23, name: "啪啪2", sex: "男" },
];
let arr3 = arr2.find((item, index) => {
return item.age == 23;
})
console.log(arr3); // { id: 1, age: 23, name: "哈哈", sex: "男" }, 符合的第二個就找不到
/*場景2有一個對象數(shù)組A虾宇,根據(jù)指定對象的條件找到數(shù)組中符合條件的對象*/
/*假定有一個對象數(shù)組A找到符合條件的對象*/
let arr2 = [
{ id: 1, age: 23, name: "哈哈", sex: "男" },
{ id: 2, age: 20, name: "呵呵", sex: "女" },
{ id: 3, age: 15, name: "嘿嘿2", sex: "女" },
{ id: 4, age: 23, name: "啪啪2", sex: "男" },
];
let arr = { id: 1, title: "Node.js" }
let arr3 = arr2.find((item, index) => {
return arr.id == item.id;
})
console.log(arr3);
every和some
- every和some返回就是布爾值
- every指的是每一項(xiàng)都要求符合條件就是邏輯與&&一假都假
- some 指的是有一個符合就可以了||一真都真
let computers = [
{ "name": "APPLE", ram: 16 },
{ "name": "IBM", ram: 4 },
{ "name": "Acer", ram: 32 }
];
let state = true;
let somestate = false;
let every = computers.every(function(item, index) {
return item.ram > 2;
})
console.log(every);
(5) reduce 一般求綜合的時(shí)候使用 2個參數(shù)旨剥,前面第一個是回調(diào)函數(shù),第二個是all的初始值臭墨。回調(diào)函數(shù)的參數(shù)也不一樣膘盖。第一個是合集胧弛,第二個是每一個分項(xiàng)。reduce必須有return
比如:
/*場景一*/
/*計(jì)算數(shù)組中所有值得和*/
let arr = [1, 2, 3];
let b = arr.reduce(function(all, item) {
return all + item;
}, 0);
console.log(b);
//老辦法
let a = 0;
arr.forEach(function(item, index) {
a += item;
})
console.log(a);
再比如:
/*場景二*/
/*假將數(shù)組中某個屬性抽離到另外的數(shù)組中*/
let a2 = [
{ color: "red", id: 1 },
{ color: "blue", id: 2 },
{ color: "yellow", id: 3 },
{ color: "green", id: 4 }
];
let b3 = a2.reduce(function(all2, item) {
all2.push(item.color);
return all2;
}, []);
console.log(b3);