(四)ES6數(shù)組

本節(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);
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末侠畔,一起剝皮案震驚了整個濱河市叶圃,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌践图,老刑警劉巖掺冠,帶你破解...
    沈念sama閱讀 218,122評論 6 505
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異码党,居然都是意外死亡德崭,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,070評論 3 395
  • 文/潘曉璐 我一進(jìn)店門揖盘,熙熙樓的掌柜王于貴愁眉苦臉地迎上來眉厨,“玉大人,你說我怎么就攤上這事兽狭『豆桑” “怎么了?”我有些...
    開封第一講書人閱讀 164,491評論 0 354
  • 文/不壞的土叔 我叫張陵箕慧,是天一觀的道長服球。 經(jīng)常有香客問我,道長颠焦,這世上最難降的妖魔是什么斩熊? 我笑而不...
    開封第一講書人閱讀 58,636評論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮伐庭,結(jié)果婚禮上粉渠,老公的妹妹穿的比我還像新娘分冈。我一直安慰自己,他們只是感情好霸株,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,676評論 6 392
  • 文/花漫 我一把揭開白布雕沉。 她就那樣靜靜地躺著,像睡著了一般去件。 火紅的嫁衣襯著肌膚如雪坡椒。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,541評論 1 305
  • 那天箫攀,我揣著相機(jī)與錄音,去河邊找鬼幼衰。 笑死靴跛,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的渡嚣。 我是一名探鬼主播梢睛,決...
    沈念sama閱讀 40,292評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼识椰!你這毒婦竟也來了绝葡?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,211評論 0 276
  • 序言:老撾萬榮一對情侶失蹤腹鹉,失蹤者是張志新(化名)和其女友劉穎藏畅,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體功咒,經(jīng)...
    沈念sama閱讀 45,655評論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡愉阎,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,846評論 3 336
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了力奋。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片榜旦。...
    茶點(diǎn)故事閱讀 39,965評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖景殷,靈堂內(nèi)的尸體忽然破棺而出溅呢,到底是詐尸還是另有隱情,我是刑警寧澤猿挚,帶...
    沈念sama閱讀 35,684評論 5 347
  • 正文 年R本政府宣布咐旧,位于F島的核電站,受9級特大地震影響绩蜻,放射性物質(zhì)發(fā)生泄漏休偶。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,295評論 3 329
  • 文/蒙蒙 一辜羊、第九天 我趴在偏房一處隱蔽的房頂上張望踏兜。 院中可真熱鬧词顾,春花似錦、人聲如沸碱妆。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,894評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽疹尾。三九已至上忍,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間纳本,已是汗流浹背窍蓝。 一陣腳步聲響...
    開封第一講書人閱讀 33,012評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留繁成,地道東北人吓笙。 一個月前我還...
    沈念sama閱讀 48,126評論 3 370
  • 正文 我出身青樓,卻偏偏與公主長得像巾腕,于是被迫代替她去往敵國和親面睛。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,914評論 2 355

推薦閱讀更多精彩內(nèi)容