一個關於UNIX檔案系統指令集的簡短指南 我寫這份手冊的目標是讓學習、記憶和查詢主要UNIX檔案系統工具更容易。macOS和GNU/Linux都是UNIX系統，在實際應用中。macOS是基於BSD UNIX的認證UNIX，而GNU/Linux是UNIX相似或UNIX衍生。 在介紹檔案系統和它如何運作之後，我將詳細說明以下指令的細節： 處理資料夾和檔案 mkdir cd pwd rmdir ls touch mv cp ln 權限 chmod chown chgrp 檔案內容 cat less find cpio dd wc 檔案系統如何運作 每台現代化的電腦系統都依賴檔案系統以儲存和擷取程式。並非所有的東西都可以儲存在記憶體中，因為它是珍貴和有限的資源。所以，當電腦重新啟動或關機時，我們需要一個安全的地方來存儲資料。 記憶體在每次電腦重新啟動時都會被完全清除，而磁碟結構是持久存在的。 在這份指南中，我將專門介紹UNIX檔案系統，該系統可以在macOS和GNU/Linux機器上找到。Windows的檔案系統是不同的，雖然安裝了Windows子系統的Windows 10允許您使用我在這裡描述的相同工具。 檔案系統始於/ (根目錄)。這是第一層目錄的根節點。 UNIX系統中通常會找到的目錄有 /bin 包含主系統指令 /etc 包含系統配置 /dev 包含系統設備 /usr 包含使用者檔案 /tmp 包含臨時檔案 當然要根據使用的系統類型的不同而有所不同。Linux 通過其Linux Standard Base的努力使這些目錄時一樣的，您通常有： /bin 主系統指令 /boot 用於引導機器的檔案(在macOS上不存在) /dev 系統設備 /etc 系統配置檔案 /etc/opt 使用者程式配置檔案 /home 使用者的家目錄(/Users在macOS上) /lib 系統庫(在macOS上不存在) /mnt 掛載的檔案系統 /opt 使用者程式 /proc 系統由內核和程序(在macOS上不存在) /root 系統管理者的家目錄(在macOS上不存在) /run (在macOS上不存在) /sbin 開機系統二進制檔案 /tmp 臨時檔案 /usr 包含使用者軟件、庫和工具 /usr/bin 使用者二進制檔案 /usr/include 使用者頭檔案 /usr/lib 使用者庫 /usr/local 由使用者軟件用於儲存安裝,像在macOS上的Homebrew /usr/sbin 系統二進制檔案 /usr/share 包含與架構無關的資料,可能包含大量的其他資訊,包括文件和手冊 /usr/src 包含已安裝套件的原始碼(在macOS上不存在) /var 包含臨時檔案,日誌等 macOS有很多不同的目錄,包括...

了解什麼是URL物件以及如何使用它。 URL是一個用於使用Blob來操作URL的命名空間，並提供了2個靜態方法： URL.createObjectURL() URL.revokeObjectURL() 使用URL.createObjectURL()函數可根據Blob生成URL： const myURL = URL.createObjectURL(aBlob) 一旦你有了Blob URL，你可以通過以下代碼從內存中銷毀它： URL.revokeObjectURL(myURL) 除此之外，URL還通過其構造函數提供了一個完全不同的功能，它可以用來創建URL。你可以這樣調用它： const currentUrl = new URL(window.location.href) 現在，currentUrl有一組屬性，你可以使用它來檢查URL的各個部分： hash：哈希片段 host：域名+端口 hostname：域名 href：包含整個URL origin：協議+域名+端口 password pathname port protocol search searchParams username 這些都是URL的常見部分。你可以修改其中任何一部分，除了origin和searchParams，它們是只讀的。你可以通過調用toString()方法或引用href屬性來生成新的URL字符串。

V8是Google Chrome使用的JavaScript引擎的名稱。它是在使用Chrome瀏覽時將我們的JavaScript代碼執行的關鍵。V8提供了JavaScript執行的運行時環境，瀏覽器提供DOM和其他Web平台API。 V8是Google Chrome使用的JavaScript引擎的名稱。它是在使用Chrome瀏覽時將我們的JavaScript代碼執行的關鍵。 V8提供了JavaScript執行的運行時環境。DOM和其他Web平台API由瀏覽器提供。 有趣的是，JavaScript引擎獨立於其托管的瀏覽器。這一重要功能使得Node.js崛起成為可能。2009年，V8被選為Node.js的引擎，隨著Node.js的普及，V8成為用JavaScript編寫的大量服務器端代碼的引擎。 Node.js生態系統龐大，並且多得如Electron等項目，V8也負責為桌面應用程序提供支持。 其他JS引擎 其他瀏覽器都有自己的JavaScript引擎： Firefox使用Spidermonkey Safari使用JavaScriptCore（也稱為Nitro） Edge使用Chakra 還有許多其他引擎。 所有這些引擎都實現了ECMA ES-262標準，也稱為ECMAScript，這是JavaScript使用的標準。 追求性能 V8是用C++編寫的，並且不斷改進。它可以在Mac、Windows、Linux和其他幾個系統上運行。 在這篇V8介紹中，我將忽略V8的具體實現細節，這些可以在更權威的網站（如V8官方網站）上找到，而且這些細節會隨時間變化，有時甚至發生很大的變化。 V8一直在不斷發展，就像其他JavaScript引擎一樣，以加快Web和Node.js生態系統的速度。 在Web上，多年來一直在追求性能，我們（作為用户和開發人員）從這場競爭中受益良多，因為我們每年獲得更快、更優化的機器。 編譯 JavaScript通常被認為是一種解釋語言，但現代JavaScript引擎不僅僅解釋JavaScript，還進行編譯。 這一點可以追溯到2009年，當時Firefox 3.5添加了SpiderMonkey JavaScript編譯器，之後其他瀏覽器也紛紛效仿。 V8內部使用即時編譯（JIT編譯）對JavaScript進行編譯以加快執行速度。 這可能似乎有些反直觀，但自2004年Google地圖推出以來，JavaScript已經從一種通常執行幾十行代碼的語言發展成為浏覽器中運行數千行到數十萬行完整應用程序的語言。 現在我們的應用程序可以在瀏覽器中運行數小時，而不僅僅是幾個表單驗證規則或簡單的腳本。 在這個新世界中，編譯JavaScript完全有道理，因為儘管稍微花點時間準備JavaScript，但一旦準備完畢，它將比純粹解釋的代碼更高效。

找出關於JavaScript物件的valueOf()方法的所有資訊。 在物件實例上調用時，返回其基本值。 const person = { name: 'Fred' } person.valueOf() //{ name: 'Fred' } 這個方法通常只在JavaScript內部使用，很少在使用者代碼中實際被呼叫。

我的現有錄影裝置 編輯2023年1月5日：當然，這套配置現在已經過時了。事物發展很快。我可能會發布一篇更新的文章。 我已經拍攝視頻多年了，但我從來沒有正式詳細介紹過我的設置。 製作視頻是對質量的永不停止的追求，而且每年的質量基礎都在不斷提高。 所以我最近升級了很多設備，為JavaScript課程的錄製做準備，現在是時候總結我使用的設備和方法了。 硬件和軟件。 讓我們從相機開始。我現在使用的是iPhone 13 Pro。 以前我使用的是佳能EOS 200D（SL2），它的翻轉屏幕和外部麥克風輸入功能非常好，但是因為缺乏清晰的HDMI輸出和沒有虛擬電池選項，所以不是很好。 這使得編輯過程變得更長，因為需要將視頻文件從相機SD卡移到Mac上。 如果有一件事我對自己是非常了解的，那就是為了始終如一地做某件事，我需要盡量減少所有可能出現的阻力。 iPhone當然是新的選擇，因為它最近才發布，我是在發布當天購買的。 我使用它在桌子上的小三腳架上錄製屏幕錄像。 iPhone通過USB-C至Lightning連接器連接到MacBook Pro上，並運行Camo，這是一個很棒的應用程序，可以將iPhone用作攝像機，并且具有許多可以調整的設置。 這使得我可以將iPhone與任何接收視頻輸入的應用程序（如Screenflow）一起使用。 有時我還使用iPhone使用電影模式錄製視頻，這真是太棒了。 在這種情況下，我只需錄製視頻，然後將文件通過Airdrop傳輸到Mac上。 我提到了一台Mac，我使用的是MacBook Pro 16英寸配有外接的27英寸屏幕。 我還使用一台12.9英寸的iPad Pro，主要用於兩個用途：要麼在屏幕上保留一些筆記，如我要說的內容，要麼作為具有Sidecar功能的副屏幕使用。 有時候我會在iPad上保留筆記，然後在使用Sidecar時在MacBook上進行錄製。或者相反，我將筆記保存在iPad上，然後在MacBook上進行錄製。 讓我們來談談麥克風。我很長一段時間使用的是Samson Meteor，但最近我購買了一個Røde NT-USB，它的提升效果非常明顯。 還有一個好處是，我可以使用它的支臂（Røde PSA1），並配上懸掛式支撐架和防毛刺濾波器。我以前的麥克風只能放在桌子上，沒有支臂選項。起初適用，但不利於持續使用。 讓我們講一下燈光。 我有2個Elgato Key Light Air。我喜歡它們，它們看起來很不錯，不會發熱或發出噪音。我可以使用一個小應用程序通過WiFi控制它們。我可以設置燈光的顏色和亮度。非常酷！ 屏幕上是Elgato應用程序在運行，讓我可以控制燈光 我還有一個Elgato Light Strip，也可以通過相同的應用程序通過WiFi控制。很酷，我可以設置顏色和亮度，隨心所欲地更改。 我一直都開著它，因為它讓工作室的氛圍更加舒適。 在錄製時，我還有一個臨時的木質結構，我將其固定在桌子上，上面和上方放置一些毛毯，以減少回音，使音頻聽起來更好。此外，它還幫助我在白天或晚上保持恆定的光線環境。 監視器底座由CSS：The Definitive Guide，2017和Cocoa Programming，2002提供。是的，這張桌子一團糟，對不起，我沒有將其完美地準備成可分享到Instagram的照片 錄製完成後，我使用Screenflow去除噪音，因為它具有噪音降低功能。 基本上就是這樣。我花了很多時間進行實驗，找出了細節和完美的設備，現在我可以快速錄製視頻，且品質在我標準下非常好。 這是燈光+ iPhone + Camo背景模糊的示例效果 雖然在屏幕錄像中，我通常會顯示如下：

最近我開始使用 Vite，它被譽為 “新一代的 create-react-app"。 那什麼是 Vite？ 有時候這可能令人困惑，因為有很多工具都在以不同的方式做同樣的事情，比如 Parcel、esbuild、Rollup、Rome、webpack、Turbopack（對，我正在努力將它的大小寫寫對）… 我傾向於認為它們基本上是在做同樣的事情，儘管它們實際上並不相同。 但是當人們開始在很多地方使用 Vite，並且我在 Twitter 上不斷看到它的介紹時，我也變得很好奇。 我試用了一下，我喜歡它。 Vite自稱是“下一代的前端工具”。 它基本上就像一個模塊打包工具，例如 Webpack 或 Turbopack，但有趣的是它並不表現得像一個打包工具。它不像以前一樣創建一個JavaScript捆綁文件並將其發送到瀏覽器，通常是一個大的JavaScript文件，然後由瀏覽器進行處理。相反，Vite 使用本地瀏覽器的 ES 模塊支持直接將模塊發送到瀏覽器。 因此，如果你在開發者工具中檢查網站，你將看到所有應用程序文件都被發送到瀏覽器，而不是看到一個大的JavaScript文件。 我認為這是 Vite 速度的首要原因，這是構建工具行為上的根本改變。 以下是 Vite 提供的一些功能： 用於許多熱門庫和框架（如 React）的脚手架工具 具有熱模塊替換（HMR）的開發服務器 用於創建代碼生產版本的構建工具 有趣的是，Vite 在內部使用 Rollup，所以它不是 Rollup 的替代品 - 它是在其上構建的。 它還使用了 SWC，它是下一代更快的 Babel。 基本上，你的應用程式代碼被編譯成單獨的 ES 模塊並發送到瀏覽器。有趣的是，Vite 不是一個捆綁工具。我們習慣於使用捆綁工具來創建我們代碼的最終版本，但 Vite 不這樣做。 相反，它“直接將每個模塊發送到瀏覽器。這意味著瀏覽器會處理模塊之間的依賴關係。” 這是我在Turbopack 比較頁面上找到的。 我覺得 Vite 非常用戶友好，這對其廣泛的應用起到了推動作用。 我最喜歡使用它的情況是初始化一個新的 JavaScript 或 React 應用程序。它也內置了對 Svelte、SvelteKit 和其他框架的集成。 你可以使用以下命令使用 Vite 初始化一個新項目： npm create [[email protected]](/cdn-cgi/l/email-protection) 這將開始一個新的...

這篇文章將解釋如何設定一個讓 React 開發容易且簡潔的 VS Code 環境，並且擁有程式碼檢查的提示和保存時自動格式化的功能。 ESLint 首先，我們將安裝 ESLint。ESLint 是一個非常棒的工具，可以幫助您保持程式碼整潔並符合規範。 使用 ESLint 延伸套件 安裝 ESLint 到 VS Code 的擴充套件商店。 然後，在終端機中執行以下 Yarn 命令（如果尚未安裝 Yarn，請參考我的教學鏈接獲取簡短的指南）： yarn add babel-eslint yarn add eslint-config-airbnb yarn add eslint-plugin-jsx-a11y yarn add eslint-plugin-react 接下來，在專案的根目錄中建立一個 .eslintrc.json 檔案，並添加以下內容以設定適用於 React 開發的基本 ESLint 配置，包括 JSX 支援： { "parser": "babel-eslint", "extends": "airbnb", "plugins": ["react", "jsx-a11y", "import"] } Prettier 接下來，我們建議安裝 Prettier。Prettier 是一個 JavaScript 的文風一致性格式化工具。它是一個很棒的工具，可以幫助您統一程式碼風格，即使只有您獨自開發也非常有用。在團隊合作中，它更是非常有用，可以避免程式碼風格的差異。請按照 Prettier 建議的方式來使用。 您可以使用 Prettier 的 VS Code 擴充套件 來安裝 Prettier，使用 npm 命令：...

在 VS Code 中，你可以自訂空格和 Tab 偏好，就像在任何編輯器中一樣，同時你也可以選擇 Tab 佔用幾個空格。 然而，不同的語言可能需要不同的設定。 例如，我喜歡在 HTML 中使用 4 個空格，但在 CSS 和 JavaScript 中只使用 2 個。 而 Go 則要求 8 個空格。 那麼該怎麼處理呢？ 你可以將語言特定的設定添加到 VS Code 的偏好設定檔中（用 cmd+, 打開）。 以下是一個在 JS、CSS、HTML 和 Go 檔案中使用不同設定的範例： "[javascript]": { "editor.insertSpaces": true, "editor.tabSize": 2 }, "[css]": { "editor.insertSpaces": true, "editor.tabSize": 2 }, "[html]": { "editor.insertSpaces": true, "editor.tabSize": 4 }, "[go]": { "editor.insertSpaces": false, "editor.tabSize": 8 }

如何使用Vue Router，這是Vue應用程式中必不可少的一部分之一 簡介 在JavaScript網頁應用程式中，路由器是將目前顯示的視圖與瀏覽器地址欄內容同步的部分。 換句話說，它是當你在頁面上點擊某個元素時，使URL改變並顯示正確視圖的部分。 傳統上，網頁是基於URL構建的。當你訪問特定的URL時，會顯示特定的頁面。 隨著在瀏覽器內運行並改變使用者所見的應用程式的引入，許多應用程式打破了這種交互方式，你必須手動使用瀏覽器的History API更新URL。 當你需要將URL與應用程式中的視圖同步時，你就需要一個路由器。這是一個非常常見的需求，現代的主要框架現在都允許你進行路由管理。 Vue Router庫是Vue.js應用程式開發時的首選。Vue並不強制使用這個庫。你可以使用任何通用的路由庫，或者自己創建和History API集成，但是使用Vue Router的好處是它是官方的。 這意味著它是由維護Vue的同一群人維護的，所以你可以在框架中得到更一致的整合，並且保證它將始終與未來的版本兼容，無論是什麼版本。 安裝 Vue Router可以通過npm的vue-router包來獲取。 如果你使用script標籤引入Vue，可以使用以下方式引入Vue Router。 <script src="https://unpkg.com/vue-router"></script> unpkg.com是一個非常方便的工具，可以通過一個簡單的鏈接在瀏覽器中提供每個npm包 如果你使用Vue CLI，可以使用以下方式安裝 npm install vue-router 一旦你安裝了vue-router並使其可用，可以在你的應用程序中導入它。 你需要在vue之後導入它，並調用Vue.use(VueRouter)將其安裝在應用程序中。 import Vue from 'vue' import VueRouter from 'vue-router' Vue.use(VueRouter) 在調用Vue.use()並傳遞路由器對象之後，在應用程式的任何組件中都可以訪問這些對象： this.$router是路由器對象 this.$route是當前路由對象 路由器對象 當在將Vue Router安裝到根Vue組件時，可以使用this.$router從任何組件中訪問路由器對象，它提供了許多不錯的功能。 我們可以使用以下方法導航至新路由： this.$router.push() this.$router.replace() this.$router.go() 這類似於History API的pushState，replaceState和go方法。 push()用於切換到新的路由，將新項目添加到瀏覽器的歷史記錄中。replace()類似，只是它不會將新狀態推送到歷史記錄中。 使用示例： this.$router.push('about') //命名路由，稍後查看 this.$router.push({ path: 'about' }) this.$router.push({ path: 'post', query: { post_slug: 'hello-world' } }) //使用查詢參數（post?post_slug=hello-world） this.$router.replace({ path: 'about' }) go()可以前進和後退，接受一個可能為正或負的數字來倒退或前進歷史記錄：...

Vue.js 提供了三種方法來處理內容：方法 (methods)、監聽器 (watchers) 和計算屬性 (computed properties)。該如何選擇使用哪一種方法呢？ 使用方法 (methods) 的時機： 當需要對 DOM 中的某些事件做出反應時。 當某些事情在組件中發生時調用函數。你可以從計算屬性 (computed properties) 或監聽器 (watchers) 中調用方法。 使用計算屬性 (computed properties) 的時機： 需要根據現有的數據來生成新的數據。 你在模板中使用的變量是由一個或多個數據屬性構建的。 你希望將一個複雜的、嵌套的屬性名稱簡化為更易讀、更易使用的名稱，同時當原始屬性更改時更新它。 需要從模板中引用一個值。在這種情況下，創建一個計算屬性是最好的選擇，因為它會被緩存。 需要監聽多個數據屬性的變化。 使用監聽器 (watchers) 的時機： 當需要監聽某個數據屬性的變化並執行一些操作時。 當需監聽 prop 的值變化時。 當只需要監聽單個特定屬性時（同時不能監聽多個屬性）。 當需要監聽某個數據屬性直到達到某個特定值，然後執行相應操作時。