[JS 筆記] 可選串連、條件三元、falsy、some與includes

Submitted by Jiajun on 週五, 11/10/2023 - 00:47

話說我在 Alpha Camp 上課已經邁入第二個月了，今天看到老師（助教？）的一段 code，實在不由得讚嘆 JS 的博大精深。這是在 Dev C3「後端應用實務」課程的其中一節，「用 Query String 打造搜尋功能」。以下 code 我有稍微改寫成菜雞 style，但仍保留許多值得筆記之處：

app.get('/movies', (req, res) => {
    // 一、可選串連運算子 `?.`
    const keyword = req.query.search?.trim();
    // 二、條件運算子 `?:`；三、空字串會被視為 false
    const matchedMovies = keyword ? movies.filter((item) => {
      // 四、some()是用一個 callback 函式作為函數來判斷真假，includes()是比對值來判斷
      return Object.values(item).some((property) => {
        if (typeof property === 'string'){
          return property.toLowerCase().includes(keyword.toLowerCase())
        } else {
          return false
        }
      })
    // 二、條件三元運算子 `?:`
    }) : movies;
    res.render('index', { movies: matchedMovies, baseUrl, keyword })
})

可選串連運算子 ?.，詳見 MDN
條件 (三元) 運算子 ?:，詳見 MDN
falsy 假值 → 不用額外的表達式，即為 false。詳見 MDN
經 ChatGPT 的提點，在網路上找到以下說明：
- some() 接受一個 callback 函數作為參數，你可以在這個函數中寫下自己的邏輯，來確定一個陣列是否包含至少一個符合你所寫條件的元素。
- includes() 則對陣列中的每個元素進行一個通用的等於（equalTo）比較，如果陣列中至少有一個元素等於要查找的值，它就會返回真（true）。

(image source: Wikimedia Commons)

標籤 (Tags)

JavaScript