使用 JavaScript try...catch 來控制程式中的錯誤
程式中出現錯誤是必不可少的,有千萬個原因可能造成程式出現錯誤無法運行,這時候在 JavaScript 中就可以使用 try...catch 語法來處理錯誤情境,除了攔截錯誤也可以自行定義與拋出錯誤,讓程式中的錯誤更容易被理解與管理。
程式中出現錯誤是必不可少的,有千萬個原因可能造成程式出現錯誤無法運行,這時候在 JavaScript 中就可以使用 try...catch 語法來處理錯誤情境,除了攔截錯誤也可以自行定義與拋出錯誤,讓程式中的錯誤更容易被理解與管理。
流程控制是程式語言中基礎不可少的概念之一,除了使用 if、else 之外,JavaScript 還提供一個簡潔的寫法,就是條件(三元)運算子,顧名思義,由三個片段所組成,分別是:「條件、成功流程與失敗流程」。用更精簡的語法來撰寫流程控制,條件運算子是常見且必學的語法之一
在 JavaScript 中函式可以使用任意數量的參數與引數,如果參數沒有對應的引數將導致該變數成為未定義,參數(佔位符)代表一個值你期望函式所接收;引數(實際值)則是函式呼叫時所傳遞的值,讓我們用預設參數來解決這個問題吧!
在 JavaScript 中活用 ES6 帶來的加強版物件實字可以精簡程式片段,甚至還可以動態的計算創造物件內的項目!實字(Literal) 指的是代表它自己的數值,舉例來說數字 `25` 或 `你好世界` 而進階物件實字就是在物件中使用的值。
藉由解構語法可以快速取出目前陣列或物件的資料,是個常見且必學的語法糖。透過解構可以快速取出目前陣列或物件的資料,並且可以將取出的資料重新命名,讓程式碼更簡潔,是個簡單方便的語法,舉幾個實際例子就會發現它的用處很多且很好懂。
藉由學習 ES6 推出的展開與其餘運算子,在許多場合可以更直覺易讀的撰寫相同的程式碼,藉由動圖與實際案例來了解它們的用途吧。語法一模一樣都是三個點,但在不同的位置會有不同的效果,這篇文章也會介紹展開運算子 (Spread Operator) 與其餘運算子 (Rest Operator)之間的差異。
本篇文章將透過簡單易懂的辭彙介紹 JavaScript 中的 this,讓讀者能夠更深入理解 JavaScript 中 this 的使用方式與特性。`this` 會如此讓人混亂是因為它需要基於前後文來判斷,最簡單的原則就是:誰呼叫 `this`,`this` 就代表誰。
JavaScript 箭頭函式是 ES6 版本中新增的語法,能夠簡潔明瞭地定義函式,並且已經被廣泛的使用當中。於本篇文章中我們將會學習如何使用箭頭函式來簡化程式碼,並且了解這個語法的特性以及要注意的地方,以及它可以被使用在那些場合當中。
絕大多數時候你不會想要使用「鬆散比對」,嘗試使用「嚴謹的比對」將程式撰寫得嚴謹精確一些。在絕大多數的情況下,你不會想要使用鬆散比對,但是在某些情況下,可能會使用它會更為便利,本篇文章將介紹相關取捨,以及你可以在什麼時候使用不同的比較方式。
為了達成最佳化網頁加載的順序,本篇文章以實際案例說明為什麼應該使用 HTML 內建的 `defer` 和 `async` 屬性,先從問題點出發再來到三種解決方案與比對,透過原生的 HTML Script 標籤屬性及能規劃腳本的加載順序。
HTML 元素可以擁有自己的屬性,用於表達各種類的資訊,像是從外觀樣式到無障礙資訊到各式各樣的預設屬性,而 data 屬性是一個正式存儲資料於 HTML 元素的屬性,將資訊儲存在 HTML 標籤屬性上,使 JavaScript 與 CSS 都能讀取得到元素的資料。
學習可選串聯語法可以讓我們安全的存取某個嵌套的物件屬性,就算其屬性並不存在也不會導致錯誤。存取物件屬性對開發者來說是一件非常直覺且每天都在做的事,但當資料的來源不穩定,像是使用第三方來源的資料或用戶輸入,應該如何迴避因使用不存在的值而出現的錯誤呢?來試試看可選串聯語法。