特性與用途

• 不會影響到原始陣列的資料
• 篩選符合條件的第一筆資料，並且回傳至新的陣列

直接進入寫法及範例

範例一：找出陣列中 >= 10 的資料

const dataList = [5, 7, 10, 99];

const newDataList = dataList.find(function(item){
  return item >= 10;
});
console.log(newDataList);

執行結果

因為 find 的特性，會回傳符合條件的第一筆資料，所以結果為 10

範例二：找出小於 100 的資料

const dataList = [
    {
      goodsName: '帆布提袋',
      price: 499
    },
    {
      goodsName: '文青斜背包',
      price: 399
    },
    {
      goodsName: '簡約風飲料提袋',
      price: 39
    },
]

const newDataList = dataList.find(function(item){
  return item.price < 200;
});
console.log(newDataList);

執行結果：

回傳一筆符合條件的資料

最後來練習箭頭函式

• 第一種寫法 ：先拔 function ，再加上 => 魔法棒，完成！

const dataList = [5, 7, 10, 99];

const newDataList = dataList.find((item) => {
  return item > 10;
});
console.log(newDataList);

• 第二種寫法：拔掉不需要的括號，想著把 => 後面當作魔法棒要執行的咒語（條件），那麼就完成了

const dataList = [5, 7, 10, 99];

const newDataList = dataList.find(item => item > 10);
console.log(newDataList);

參考資料及學習資源

• 六角學院 - JavaScript 必修篇 - 前端修練全攻略
• Array.prototype.find()

本日小節

在箭頭函式的自己學習的記法多了一點說明～不知道有沒有比較好理解一點（Ｘ）
今天是國慶日呢！！
這是我的學習紀錄，我們下次見！