Python提供了三個有用的全局函數用於處理集合：map()、filter()和reduce()。 提示：有時候，使用列表推導更能表達意思，並且通常被認為更符合Python風格。 filter()接受一個可迭代對象，並返回一個過濾對象，即另一個可迭代對象，但不包含原始對象中的某些元素。 你可以通過在過濾函數中返回True或False來實現過濾功能： numbers = [1, 2, 3] def isEven(n): return n % 2 == 0 result = filter(isEven, numbers) print(list(result)) # [2] 你也可以使用lambda函數使代碼更簡潔： numbers = [1, 2, 3] result = filter(lambda n: n % 2 == 0, numbers) print(list(result)) # [2]

Python提供了三个非常有用的全局函数，我们可以用来处理集合：map()、filter()和reduce()。 提示：有时使用列表推导更加合适，而且通常被认为更加“Pythonic”。 map()用于对可迭代的项（如列表）中的每个项运行一个函数，并创建一个具有相同数量项的新列表，但每个项的值可以更改。 下面是一个使用map()将列表中的每个项加倍的示例： numbers = [1, 2, 3] def double(a): return a * 2 result = map(double, numbers) 当函数是一行代码时，通常使用lambda函数： numbers = [1, 2, 3] double = lambda a: a * 2 result = map(double, numbers) 甚至可以内联使用lambda函数： numbers = [1, 2, 3] result = map(lambda a: a * 2, numbers) 原始列表保持不变，map()返回一个具有更新值的新列表。 结果是一个map对象，一个可迭代对象，您需要将其转换为list才能打印其内容： print(list(result)) # [2, 4, 6]

Python提供了三个有用的全局函数，我们可以使用它们来处理集合：map()、filter()和reduce()。 提示：有时候，列表推导式更加合适，而且通常被认为更加“Pythonic”。 reduce()函数用于根据序列（如列表）计算一个值。 例如，假设你有一个存储为元组的费用列表，你想计算每个元组中某个属性的总和，比如每项费用的金额： expenses = [ ('Dinner', 80), ('Car repair', 120) ] 你可以使用循环来遍历它们： total = 0 for expense in expenses: total += expense[1] print(total) # 200 或者，你可以使用reduce()函数将列表减少为一个单一的值： from functools import reduce print(reduce(lambda a, b: a[1] + b[1], expenses)) # 200 reduce()函数不像map()和filter()一样默认可用。你需要从标准库模块functools中导入它。

在建立React應用程式時，例如使用Next.js建立的應用程式，React Developer Tools是一個絕對必要安裝的工具。 React Developer Tools提供了一個檢查React應用程式的工具，可以顯示React元件樹狀結構，並且可以查看每個元件的props、state、hooks等等。 安裝好React Developer Tools後，你可以打開瀏覽器的開發人員工具（在Chrome中，右鍵點擊頁面，然後點擊Inspect），你會發現兩個新的面板：Components（元件）和Profiler（性能分析）。 如果你將滑鼠移動到元件上，瀏覽器會在頁面上選擇由該元件渲染的部分。如果你在樹狀結構中選擇任何元件，右側的面板將顯示對應元件的父元件和傳遞給它的props： 你可以輕鬆地通過點擊元件名稱來進行導航。 你可以點擊開發人員工具工具欄中的眼睛圖標來檢查DOM元素，如果你使用第一個圖標（方便地位於類似常規DevTools圖標下方的滑鼠圖標），你可以將滑鼠懸停在瀏覽器UI中的元素上，以直接選擇渲染該元素的React元件。 你可以使用bug圖標將元件數據記錄到控制台。 這非常棒，因為一旦你將數據打印出來，在控制台中你可以右鍵點擊任何元素，然後選擇“存儲為全局變量”。例如，我在此示例中使用了url prop，並且我能夠在控制台中通過臨時變量temp1來檢查它： 使用Next.js自動加載的Source Maps（在開發模式下），從元件面板中，我們可以點擊<>代碼，DevTools會切換到Source面板，並顯示元件的源代碼： Profiler（性能分析）標籤更加出色，如果可能的話。它允許我們記錄應用程式中的交互並查看發生了什麼。我現在還無法展示一個例子，因為至少需要兩個元件來創建一個交互。我稍後會談到這個。 我展示的所有截圖都是使用Chrome，但是React Developer Tools在Firefox中的工作方式是相同的：

到目前為止，我們已經看到了如何將一個鍵與一個值或者一組值關聯起來。 Hash允許我們將多個值關聯到單個鍵上，非常適合存儲類似於對象的項目。 例如，一個人有名字和年齡。我們可以創建一個person:1的hash： HMSET person:1 name "Flavio" age 37 使用HGETALL可以獲取用戶的所有屬性： HGETALL person:1 您可以使用HSET來更新哈希屬性： HSET person:1 age 38 您可以使用HINCRBY來遞增存儲在哈希中的值： HINCRBY person:1 age 2 可以在此處查看所有的Hash命令：https://redis.io/commands#hash。

在使用資料庫時，您可以選擇使用資料庫提供的基本功能，或使用一個建立在其之上並為您抽象出細節的函式庫。 Sequelize就是其中之一，它是一個非常受歡迎的Node.js封裝器，可用於PostgreSQL、MySQL和其他資料庫。 在本文中，我將探討如何使用Sequelize來處理PostgreSQL資料庫。 安裝並設定Sequelize 在內部，Sequelize使用pg函式庫與PostgreSQL建立連接，所以當我們安裝sequelize npm套件時，我們還需要安裝pg： npm install pg sequelize 提示：如果你的專案是全新的且沒有package.json文件，請不要忘記首先執行npm init -y。 在您的Node.js文件中，您首先定義資料庫存取變數： const user = '<postgres用戶名>' const host = 'localhost' const database = '<postgres資料庫名>' const password = '<postgres密碼>' const port = '<postgres埠號>' 然後從sequelize進行三個物件的導入： import { Sequelize, Model, DataTypes } from 'sequelize' 然後，您可以使用以下語法初始化一個新的Sequelize物件實例： const sequelize = new Sequelize(database, user, password, { host, port, dialect: 'postgres', logging: false }) 我們告訴Sequelize這是什麼類型的資料庫，可以在dialect屬性中指定（如前所述，它可以處理不只是Postgres）。 我們還禁用了日誌記錄，因為它會記錄所有SQL查詢，這可能會很冗長，且我們實際上並不需要查看它們（除非您正在調試問題）。 如何創建一個Sequelize模型 對於要使用Sequelize操作的每個資料表，您都需要創建一個模型。 以下是一個示例，假設我們有一個具有“name”和“age”兩列的dogs資料表。 我們創建一個Dog類，並將其擴展Model基類： import { Sequelize, Model, DataTypes } from 'sequelize' const class Dog extends Model {} 然後在類上調用init()靜態方法，描述資料和我們要應用的規則。在此示例中，我們禁用了null：...

在處理網站時，我需要遞迴地將資料夾中所有的檔名中的空格替換為底線。這是我在網站上工作時需要進行的其中一個臨時操作，而我並不想要搜索、安裝（購買）一個應用程式來完成這個操作。 以下是我使用Fish Shell腳本完成這個操作的方法: #!/opt/homebrew/bin/fish set search\_dir ./ find $search\_dir -type f | while read -l file # 將檔案名稱中的空格替換為底線 set new\_name (echo $file | tr ' ' '\_') # 重新命名檔案 mv $file $new\_name end 我將這個腳本放在包含我想要重新命名的所有檔案和資料夾的目錄中，並將其命名為replace_spaces.fish。 然後，我使用chmod +x replace_spaces.fish命令將其設置為可執行文件，最後使用./replace_spaces.fish命令運行它。

以現代方式進行JavaScript變數的深拷貝 多年以來，我們一直使用奇怪的解決方法來進行JavaScript物件的深拷貝。 其中許多方法容易出現錯誤。 比如使用JSON.parse(JSON.stringify(obj))，這種方法可能會忽略某些類型的物件。 或者更糟糕的是，通過引用來複製物件屬性，這樣可能會引入未來的錯誤。 如今，我們有structuredClone()，它是DOM API的一部分。 它不是JavaScript的一部分，而是DOM API的一部分。 它在所有現代瀏覽器的最新版本中都可用： 在Node.js 17+中也可用。

一個簡短的SWR教程 在Next.js應用程式中，使用SWR是進行GET請求的最佳方法之一。 你可以通過以下命令來安裝它： npm install swr 並且你需要定義一個fetcher函數，我通常在lib/fetcher.js文件中使用同樣的方式： const fetcher = (...args) => fetch(...args).then((res) => res.json()) export default fetcher 在組件的文件頂部引入它： import fetcher from 'lib/fetcher' 然後你就可以開始使用它了。 在組件的頂部引入useSWR： import useSWR from 'swr' 然後在組件內部的頂部，我們使用useSWR來加載我們需要的數據： const { data } = useSWR(`/api/data`, fetcher) 除了data屬性外，從useSWR返回的對象還包含isLoading和isError。isLoading對於顯示一些類似“加載中…”的視覺提示非常有用。 你可以向useSWR傳遞一個附加對象，其中包含一些選項。例如，我使用這個選項來限制SWR重新驗證的次數，這樣當我在開發模式下時，就不會重複連接到終點： const { data } = useSWR(`/api/data`, fetcher, { revalidateOnFocus: false, revalidateOnReconnect: false, refreshWhenOffline: false, refreshWhenHidden: false, refreshInterval: 0 })

在使用SWR時，您可能會遇到這個問題：只有在擁有一些數據時才想要發送請求。 舉個例子，我曾遇到的一個情況是，在向/api/user端點發送請求獲取用戶數據之前，我需要確定用戶是否已登錄。 具體來說，我有一個session對象，其中包含了一個user對象，它們都需要被定義。 所以，以下是我的解決方法： import fetcher from 'lib/fetcher' ... const { data: userData } = useSWR(session && session.user ? `/api/user` : null, fetcher) 第一個參數是URL。如果它是null，那麼SWR就不會發送請求，從而解決了原來的問題。