編程

Glitch是一個非常棒的平台，可以用來學習和實驗程式碼。本文將向您介紹Glitch，並讓您從零到一成為Glitch的高手。 Glitch是一個很好的學習編程的平台。 我在許多教程中使用Glitch，我認為它是一個展示概念並允許人們使用您的項目並在其基礎上建立的很棒的工具。 以下是我在Glitch上使用React和React Router創建的示例項目：https://glitch.com/edit/#!/flaviocopes-react-router-v4-2 使用Glitch，您可以輕鬆地創建JavaScript編寫的應用程序的演示和原型，從簡單的網頁到React或Vue等高級框架，以及支持服務器端的Node.js應用程序。 它基於Node.js構建，您可以安裝任何 npm包，運行webpack等等。 它是由一些非常成功的產品開發人員共同打造的，包括Trello和Stack Overflow，所以它在這方面具有很高的可信度。 我為什麼認為Glitch很棒呢？ Glitch在如何呈現自己的方面“打動了”我，它介面有趣，但又不簡化。 您可以訪問日誌，控制台和許多內部內容。 此外，接口中非常突出的重新混音的概念使我更有可能在那裡創建許多項目，因為我永遠不需要從一個空白項目開始。 您可以開始直接進入代碼，而無需花時間設置環境、版本控制等等，並專注於您的想法，並獲得自動HTTPS URL和用於媒體資源的CDN。 此外，它完全沒有鎖定，只需使用Node.js（或者如果您不使用服務器端Javascript，只需使用HTML，JS和CSS）。 它是免費的嗎？ 是的，它是免費的，將來他們可能會在付費計劃上添加更多功能，但他們聲明目前的Glitch將永遠免費。 有合理的限制，例如： 您有128MB的空間（不包括npm包），此外還有512MB的媒體資源空間。 您每小時可以處理4000個請求。 如果5分鐘內不訪問應用程序且應用程序不接收任何HTTP請求，則應用程序將停止，長時間運行的應用程序將在12小時後停止運行。只要有HTTP請求進來，它們就會重新啟動。 Glitch概述 這是Glitch的主頁，它顯示了一些因為很酷而被認為值得展示的項目，以及一些入門項目： 創建帳戶非常簡單，只需點擊“登錄”並選擇Facebook或GitHub作為您的“進入點”（我建議選擇GitHub）： 您將被重定向到GitHub以進行授權： 登錄後，主頁也會顯示您的項目： 點擊“您的項目”將帶您轉到您的個人資料頁面，URL中包含您的姓名。我的是https://glitch.com/@flaviocopes。 您可以將項目設為“固定”，以便在有很多項目時更容易找到它們。 重新混音的概念 當您剛開始時，當然沒有自己的項目。 Glitch使得非常容易開始，您從不需要從空白項目開始。您始終是從另一個項目重新混音。 您可以重新混音您喜歡的項目，也可以重新混音您在Twitter上找到的項目或在Glitch主頁上展示的項目，或者您可以從一個作為啟動項目的項目開始： 一個簡單的網頁 Node.js Express應用程序 Node.js控制台 Create-React-App應用程序 Nuxt入門應用程序 這些合集中還有許多其他啟動項目： Hello World項目 構建塊 如果您現在正在學習編碼，那麼Learn to Code Glitch合集非常不錯。 我創建了一些作為我的演示和測試組態應用的啟動應用，它們是： 簡單的HTML + CSS + JS Glitch React + webpack創建的啟動項目 Glitch Glitch使創建自己的構建塊變得非常容易，通過將它們固定在個人資料中，您可以始終將它們保持在頂部，以便更容易找到。 重新混音一個項目 一旦您要開始對一個項目進行修改，您只需點擊它，然後出現一個窗口： 有3個按鈕： 預覽：項目是代碼，代碼應該做一些事情。這將顯示項目的結果。 編輯項目：顯示項目的源代碼，並且您可以開始編輯它 重新混音：將項目克隆為一個新項目 每次重新混音一個項目時，都會創建一個新的項目，並隨機生成一個名稱。 以下是剛創建和重新混音另一個項目後的項目示例： Glitch將其命名為guttural-noodle。點擊名字可以更改它： 您還可以更改描述。...

＃如何設置URL的片段部分 了解如何設置URL的片段部分的值 我有一次需要以編程方式更改URL的片段部分的需求 那是在#數字符號之後的部分 我當時在index.html上，我想要將URL更改為index.html#second這樣的形式 這是因為我有一個目錄，但是鏈接的工作方式並不符合我的期望 以下是我的解決方法： window.location.hash = 'second'

了解如何使用Node進行HTTP POST請求 在Node中進行HTTP POST請求有很多方法，具體取決於你想使用的抽象級別。 在Node中執行HTTP請求最簡單的方法是使用Axios庫： const axios = require('axios') axios .post('/todos', { todo: '買牛奶', }) .then((res) => { console.log(`statusCode: ${res.statusCode}`) console.log(res) }) .catch((error) => { console.error(error) }) 另一種方法是使用Request庫： const request = require('request') request.post( '/todos', { json: { todo: '買牛奶', }, }, (error, res, body) => { if (error) { console.error(error) return } console.log(`statusCode: ${res.statusCode}`) console.log(body) } ) 到目前為止介紹的2種方法需要使用第三方庫。 使用Node標準模塊也可以進行POST請求，雖然比前面兩種選項更冗長： const https = require('https') const data = JSON.stringify({ todo: '買牛奶', }) const options = { hostname: 'yourwebsite....

通過這篇簡短的指南，您可以學習關於JavaScript正則表達式的所有內容，了解最重要的概念並通過示例展示。 正則表達式介紹 困難但有用 正則表達式是什麼樣子 工作原理 錨定 匹配範圍內的項目 多次匹配範圍項目 否定模式 元字符 正則表達式選項 量詞 + * {n} {n,m} 可選項目 分組 捕獲分組 可選分組 引用匹配的分組 命名捕獲分組 不使用分組的匹配和執行 非捕獲分組 標誌 檢查正則表達式 轉義 字符串邊界 使用正則表達式替換 貪婪模式 先行斷言：根據後面的字符串進行匹配 後行斷言：根據前面的字符串進行匹配 正則表達式和Unicode Unicode屬性逃逸 示例 從字符串中提取數字 匹配電子郵件地址 捕獲雙引號之間的文本 獲取HTML標籤內的內容 正則表達式介紹 正則表達式（也稱為regex）是一種以非常高效的方式處理字符串的方法。 通過使用特殊的語法來定義正則表達式，您可以： 在字符串中搜索文本 在字符串中替換子字符串 從字符串中提取信息 幾乎每一種編程語言都實現了正則表達式。每種實現之間有一些小差異，但是基本概念幾乎都是通用的。 正則表達式可以追溯到20世紀50年代，那時它被正式作為字符串處理算法的一種概念搜索模式。 它在grep、sed等UNIX工具中得到了實現，以及在流行的文本編輯器中使用，在Perl編程語言中引入了正則表達式，隨後在許多其他編程語言中引入。 JavaScript與Perl一起是具有內置的正則表達式支持的編程語言之一。 困難但有用 對於初學者來說，正則表達式可能完全看不懂，但很多時候即使對專業開發人員來說也是如此，除非他們願意投入必要的時間去理解它們。 由於寫出易於理解、易於閱讀和易於維護/修改的正則表達式非常困難，所以使用正則表達式是唯一明智的方法來執行某些字符串操作，因此它是一個非常有價值的工具。 本教程旨在以簡單的方式介紹JavaScript正則表達式，並提供閱讀和創建正則表達式所需的所有信息。 經驗法則是，簡單的正則表達式容易閱讀且易於撰寫，而複雜的正則表達式如果你不深入了解基礎知識，很快就會變得混亂不堪。 正則表達式是什麼樣子 在JavaScript中，正則表達式是一個對象，可以用兩種方式定義。 第一種方式是使用構造函數通過實例化一個新的RegExp對象來定義： const re1 = new RegExp('hey') 第二種方式是使用正則字面量形式： const re1 = /hey/ 您知道JavaScript有對象字面量和數組字面量嗎？它還有正則字面量。 在上面的示例中，hey被稱為模式。在字面形式中，它由斜杠分隔，而使用對象構造函數時則不是。 這是兩種形式之間的第一個重要差異，但我們稍後會看到其他差異。...

在JavaScript中，如何交換數組中的2個元素？ 假設我們有一個包含5個字母的數組a。 const a = ['a', 'b', 'c', 'e', 'd'] 我們想要將索引為4的元素（在這個例子中是’d’）和索引為3的元素（在這個例子中是’e’）進行交換。 我們可以使用一個暫存變量tmp來存儲索引為4的元素的值，然後將索引為3的元素放到索引為4的位置，最後將暫存變量賦值給索引為3的位置： const tmp = a[4] a[4] = a[3] a[3] = tmp 另一種方法，不需要聲明一個暫存變量，可以使用以下語法： const a = ['a', 'b', 'c', 'e', 'd']; [a[3], a[4]] = [a[4], a[3]] 現在數組a的順序將會按我們的要求進行正確排序。 a //[ 'a', 'b', 'c', 'd', 'e' ]