CodingWife 寇丁人妻日安

【JS30】Day07:Array Cardio Day 2

2018-02-13

javascript 30day

目標:說明並練習這些在 JS 中常用的幾個陣列方法

使用技巧

  • Array.prototype.some()
  • Array.prototype.find()
  • Array.prototype.findIndex()

參考文章:【 ES6 】陣列麻吉罵下篇:Sort、Every、Find、Some

Array.prototype.some()

一. 使用 some 確認陣列是否有元素 >=19 。

const isAdult = people.some(function(person) {
const currentYear = (new Date()).getFullYear();
if(currentYear - person.year >= 19) {
return true;
}
});
//Output:true

或改寫成 arrow function

const isAdult = people.some(person => ((new Date()).getFullYear()) - person.year >= 19);

console.log({isAdult});

some會遍歷整個陣列的元素傳進function,確認元素是否符合條件,假設其中一個元素符合條件,
即返回true,假設整個陣列都沒有元素符合條件,返回false

Array.prototype.every()

二. 使用 every 確認陣列是否有元素 >=19。

const allAdults = people.every(person => ((new Date()).getFullYear()) - person.year >= 19);
console.log({allAdults});

every會遍歷整個陣列的元素傳進function,檢查陣列中所有元素是否符合條件,符合條件即回傳true
只要有一個元素不符合,則回傳false

Array.prototype.find()

三. 尋找 id 是 823424 的留言。

const comment = comments.find(function(comment) {
if (comment.id == '823423') {
return true;
}
});
console.log(comment);
//Output:{text: "Super good", id: 823423}

試著自己改寫arrow function

const comment = comments.find(comment => comment.id == '823423');
console.log(comment);

find會遍歷整個陣列,假使有元素符合條件,及返回元素值為
true的元素,
filter不同的差別為,find只會回傳第一個符合條件的元素值。

Array.prototype.findIndex()

四.刪除 id 為 823434 的留言

const index = comments.findIndex(comment => comment.id === 823423);
console.log(index);
//Output:1
comments.splice(index, 1);

或是將comments.splice(index, 1);改寫成

const newComments = [
...comments.slice(0, index),
...comments.slice(index + 1)
];