iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 23
0

參考出處 JS 30 DAY 7

參考出處 Alex 宅幹嘛

今天接續著昨天,要練習的也是在 JS 常用來處理陣列的方法:

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

實作

我們有兩份資料分別是 people、comments

const people = [
      { name: 'Wes', year: 1988 },
      { name: 'Kait', year: 1986 },
      { name: 'Irv', year: 1970 },
      { name: 'Lux', year: 2015 }
    ];
const comments = [
      { text: 'Love this!', id: 523423 },
      { text: 'Super good', id: 823423 },
      { text: 'You are the best', id: 2039842 },
      { text: 'Ramen is my fav food ever', id: 123523 },
      { text: 'Nice Nice Nice!', id: 542328 }
    ];

Array.prototype.some()

some() 的方法會透過給定函式、測試陣列中是否至少有一個元素,通過該函式所實作的測試。

我們這裡要做的是:是不是至少有一個人 19 歲或更老。

is at least one person 19 or older?

所以回傳值會是 true 或是 false

const ans = people.some(p =>{
return new Date().getUTCFullYear()- p.year > 19
})

因為上面只要有一個人 19 歲就可以過,所以 console.log 出來的結果是 true.

** getUTCFullYear() 方法用來取得一個 Date 物件的年份,時區是 UTC 時間。

Array.prototype.every()

every() 的方法會測試陣列中的所有元素是否全部都通過了由給定之函式所實作的測試。

跟上面的例子相反,要全部都超過 19 歲才過,因為有一個人 5 歲, console.log 就是 false

is everyone 19 or older?

const ans = people.every(p =>{
return new Date().getUTCFullYear()- p.year > 19
})

Array.prototype.find()

find() 的方法會回傳第一個滿足所提供之測試函式的元素值。

我們要找到 ID 是 823423 的 comment
find the comment with the ID of 823423

const ans = comments.find(comment => comment.id === 823423)

console.log(ans)

find() 方法會把本體印出來

output

Object {
  id: 823423,
  text: "Super good"
}

Array.prototype.findIndex()

findIndex() 方法將依據提供的測試函式,尋找陣列中符合的元素,並返回其 index(索引)。如果沒有符合的對象,將返回 -1 。

const ans = comments.findIndex(comment => comment.id === 823423)

跟 find() 不一樣,這裡會顯示總共有幾筆,所以 console 出來會是 1。

條件:

Find the comment with this ID
delete the comment with the ID of 823423

找到 ID 後我們還需要刪除。

刪除我們可以用 splice

下面的意思是,找到這筆資料,然後刪掉一筆資料。

const ans2 = comments.splice(ans,1)

console.log(comments)

console

Array(4)
0: {text: "Love this!", id: 523423}
1: {text: "You are the best", id: 2039842}
2: {text: "Ramen is my fav food ever", id: 123523}
3: {text: "Nice Nice Nice!", id:


以上,明天見


上一篇
DAY 22 Array Cardio
下一篇
DAY 24 JS30 Hold Shift and Check Checkboxes
系列文
半路出家,文組新手學 Javascript30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言