想知道如何在 JavaScript 中获取数组的最后一个元素吗？让我们来找答案吧。 假设你有一个数组，像这样： const colors = ['red', 'yellow', 'green', 'blue'] 在这个例子中，数组有4个元素。 你知道可以使用 colors[0] 获取第一个元素，使用 colors[1] 获取第二个元素，以此类推。 要获取最后一个元素而不事先知道它包含多少个元素，你可以使用 length 属性来确定它，而且由于数组索引从0开始，你可以通过引用 <array>.length - 1 来选择最后一个元素。 以下是一个简单的示例： const lastItem = colors[colors.length - 1] 这是一个简单的解释，教你如何在 JavaScript 中获取数组的最后一个元素！
了解如何在 JavaScript 中添加類型而不使用 TypeScript。 如果你不是住在岩石下，你應該對 TypeScript 有所了解。這是一種由微軟推出的新語言，基本上它是 JavaScript 加上了類型（並編譯成 JavaScript 在瀏覽器中運行）。 雖然我在一些測試專案中使用過 TypeScript，但是我傾向於避免使用 TypeScript 來編寫我的教程，原因有很多。 首先，我主要編寫初學者教程，而 TypeScript 通常不是初學者開始的東西。 另外，我認為如果我開始使用 TypeScript 來編寫文章，就會引起混亂，不知道我在談論什麼。 TypeScript 的愛好者仍然可以參考 JavaScript 教程，因為 JavaScript 可以很好地適應他們的 TypeScript 文件，而反之則不行。 所以，我堅持學習網頁平台的基本知識而不是建立在其之上的技術。 儘管如此… 有時候在 JavaScript 中擁有類型將是有益的。它們是有幫助的。 感謝 Paul Lewis 的這個視頻，我發現我們實際上可以在 JavaScript 中擁有類型，並使用 VS Code 實現！ 首先，如果你還沒有安裝 TypeScript，你需要進行安裝： npm install -g typescript 然後在你的項目根目錄中添加一個 tsconfig.json 文件。假設你的 JavaScript 文件在 src 文件夾中，以下是你在該文件中所需的最小配置： { "compilerOptions": { "outFile": "../../built/local/tsc.js", "checkJs": true, "allowJs": true }, "include": [ "src/*" ] } 你可以選擇排除文件夾，例如排除 node_modules 是一個好主意：...
這是非常常見的任務：在 JavaScript 中遍歷對象的屬性。 如果你有一個對象，你不能只使用 map()、forEach() 或 for..of 循環來遍歷它。 你會得到錯誤： const items = { 'first': new Date(), 'second': 2, 'third': 'test' } map() 會給出 TypeError: items.map is not a function： items.map(item => {}) forEach() 會給出 TypeError: items.forEach is not a function： items.forEach(item => {}) for..of 會給出 TypeError: items is not iterable： for (const item of items) {} 那麼，你可以做些什麼來進行遍歷呢？ for..in 是一種更簡單的方式： for (const item in items) { console.log(item) } 你還可以調用 Object.entries() 來生成一個包含所有可枚舉屬性的數組，然後使用上述任意一種方法遍歷它：...
使用 JavaScript 物件時，你可以使用 in 運算子來檢查是否存在特定的鍵。 假設有一個 car 物件： const car = { color: 'blue' } 我們可以使用下面的語句來檢查 color 屬性是否存在，並且會返回 true： 'color' in car 我們可以將其用於條件判斷式中： if ('color' in car) { } 另一種方法是使用物件的 hasOwnProperty() 方法： car.hasOwnProperty('color') 當繼承在應用程式結構中扮演重要角色時，不同之處在於 in 運算子即使對於從父物件繼承的屬性也會返回 true，而 hasOwnProperty() 則不會。只有在物件直接擁有該屬性時，它才會返回 true，而不是其祖先物件之一。 如果你想要取得一個屬性，並且如果該屬性不存在則返回預設值，可以使用後備機制： car.brand || 'Ford' 如果物件上不存在 brand 屬性鍵，則該語句會返回字串 Ford。
下面是根據值在 JS 陣列中檢索項目索引的方法。 假設您有一個包含在陣列中的項目的值，並且您想獲取其索引。 您該如何做到這一點？ 如果項目是原始值，例如字符串或數字，您可以使用陣列的 indexOf 方法： const letters = ['a', 'b', 'c'] const index = letters.indexOf('b') //index 是 `1` 請記住，索引從數字 0 開始。 如果項目是物件，您無法使用這種方式，因為如果您嘗試這樣做： const letters = [ { letter: 'a', }, { letter: 'b', }, { letter: 'c', }, ] const index = letters.indexOf({ letter: 'b', }) index 將是 -1，這意味著未找到該項目。因為物件是按參考進行比較的，而不是按值進行比較（與原始類型不同）。傳遞給 indexOf 的物件是一個完全不同的物件，而不是陣列中的第二個項目。 您可以像這樣使用 findIndex 方法，它會遍歷陣列中的每個項目，並將元素和索引傳遞給運行的函式。從該函式返回的值將賦值給 findIndex 的返回值： const letters = [ { letter: 'a', }, { letter: 'b', }, { letter: 'c', }, ] const index = letters....
Netlify 有一個很棒的功能，稱為 rewrites，可以讓我創建許多重複的頁面。但是有個限制。 在 Netlify 中，我們可以通過將這些頁面添加到專案的公共根目錄下的 _redirects 文件（例如在 Hugo 中是 public/_redirects）來進行重寫。 我將它用於一些網站。 假設我在 content/original 下有一堆頁面，我可以透過以下方法進行重寫： /copy/\* /original/:splat 200 這樣，當我訪問網址 /copy 時，內容實際上是儲存在 https://mysite.com/original，但網址並不會改變。雖然 _redirects 命名中有「導向」的意思，但實際上它是一個重寫，因為我使用的是 200 狀態碼。如果我使用了 301 狀態碼，那麼這就是一個 301 導向。 無論如何，我遇到的問題是：沒有辦法自動在網址末尾添加尾斜線。因此，如果你訪問 /copy 和 /copy/，並且在圖片和連結中使用相對 URL，沒有尾斜線的 URL 會導致 404 錯誤和圖片無法正常顯示。 我在靜態網站生成器中尋找解決方案，看看是否可以以其他方式實現重寫，但最終我找到的解決方案在客戶端實現。 而且非常簡單。 我只需在頁面底部添加以下 JavaScript 代碼： <script> (function() { if (!location.href.endsWith('/')) { window.location = location.href + '/'; } }()); </script> 這樣，如果網址末尾沒有尾斜線，頁面會立即重新載入，並在末尾添加尾斜線。 這個過程非常迅速，對使用者來說幾乎是不可見的。
在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' ]
如何从字符串中删除最后一个字符呢？ 最简单的解决方案是使用字符串的 slice() 方法，传递两个参数。第一个参数是0，表示起点位置。第二个参数是要删除的字符数量。传递一个负数将从末尾开始删除。这是解决方案： const text = 'abcdef' const editedText = text.slice(0, -1) //'abcde' 请注意，slice() 方法不会修改原始字符串。 它会创建一个新的字符串，所以在上面的示例中，我将其赋值给一个新的变量。
JavaScript有一些內建的類型，包括數字、字符串、布爾值和對象。 使用typeof運算符，我們可以檢查變量賦值的值的類型。 例如： typeof 'test' 注意它不是一個函數，而是一個運算符，所以不需要使用括號。 使用它，我們將得到一個字符串，返回以下值之一： 'number' 'string' 'boolean' 'undefined' 'bigint' 'symbol' 'object' 'function' 請注意，沒有null類型，而且 typeof null 將返回'object'。 數組也會返回'object'： typeof [1, 2, 3] //'object' 函數是一種特殊類型的對象，因為我們可以向函數添加屬性和方法： const talk = () => {} talk.test = true 但如果我們使用typeof運算符，它們將返回自己的值'function'。
假設您有一個字符串，並且想要刪除其中的第一個字符，該怎麼做呢？ 一種簡單的方法是使用slice()方法，並將1作為參數傳遞： const text = 'abcdef' const editedText = text.slice(1) //'bcdef' 請注意，slice()方法不會修改原始字符串。它會創建一個新的字符串，這就是為什麼在上面的示例中我將其賦值給一個新變量的原因。