這是 JavaScript 中所有的關鍵字和保留字列表。這些詞彙不能用作變數標識符。 await break case catch class const continue debugger default delete do else enum export extends false finally for function if implements import in instanceof interface let new null package private protected public return super switch static this throw try True typeof var void while with yield

快速列出撰寫 JavaScript 程式碼時應避免的事情。 避免使用 new Object() 來建立新物件，改用物件字面語法 {}。 陣列也一樣，優先使用 [] 而非 new Array()。 除了在 if、switch、迴圈、try 等語句需要的情況下，盡量避免使用區塊。 永遠不要在 if 或 while 語句的條件部分進行賦值。 永遠不要使用 == 和 !=，改用 === 和 !==。 永遠不要使用 eval。為什麼？它會導致效能問題（執行解譯器／編譯器）、安全問題（若與使用者輸入一起使用，可能會造成代碼注入）和調試困難。 永遠不要使用 with，因為它會修改作用域鏈並導致混淆。 總是將函式傳遞給 setTimeout 和 setInterval。 永遠不要將 Array 用作關聯陣列，改用 Object。提供該功能的部分實際上是由 Object 的原型提供的，所以你實際上可以使用 Date 物件來達到同樣的目的。 不要在字串的末尾使用 \ 來建立多行字串，這不是 ECMAScript 的一部分。改用字串串接 ' string1 ' + ' string2 ' 代替。 永遠不要修改內建物件 Object 和 Array 的原型。修改其他物件的原型（例如 Function）時要小心，因為這可能導致難以調試的錯誤。

最近，我在 JavaScript 中發現了一個奇怪但可能很有用的用法，與逗號運算子有關。 我通常使用逗號來分隔對象中的屬性或數組中的項目。 然而，我從未對在表達式內部使用逗號給予太多注意。 舉個例子： ('a', 'b') 這兩個表達式（在本例中為字符串）都會被求值，並且返回最後一個元素，即逗號之後的表達式。在這個例子中，它返回 'b'。 你可以將值賦給一個變量，像這樣： const letter = ('a', 'b') letter === 'b' // true

一個關於新的 JavaScript 公開類字段的簡單教程 在過去，要創建一個公開的類字段，我們會使用這樣的語法，在構造函數中實例化字段： class Counter { constructor() { this.count = 0 } } 新的類字段提案可以在 Chrome 72 和 Node 12 中使用，我們可以使用以下的語法： class Counter { count = 0 } 簡單得多！

在JavaScript中使用日期可能很复杂。学习所有的技巧以及如何使用它们。 处理日期可以很“复杂”。无论使用什么技术，开发人员都会感到痛苦。 JavaScript提供了一个通过强大的内置对象Date来处理日期的功能。 提示：当处理日期时，您可能希望使用一个库。Moment.js和date-fns是最流行的两个。 日期对象 一个日期对象实例表示一个时间点。 尽管名字是Date，它也处理时间。 初始化日期对象 我们使用以下方式初始化一个日期对象。 new Date() 这将创建一个指向当前时间点的日期对象。 在内部，日期以从1970年1月1日（UTC）以来的毫秒表示。这个日期很重要，因为在计算机看来，一切都是在那一天开始的。 您可能对UNIX时间戳很熟悉：它代表了自那个著名日期以来经过的秒数。 如果我们有一个UNIX时间戳，我们可以使用以下方式实例化一个JavaScript日期对象： const timestamp = 1530826365; new Date(timestamp * 1000); 除非时间戳是由JS生成的，否则它已经在正确的比例上。 确保传递一个数字（字符串将得到一个“无效的日期”结果 - 如有疑问请使用parseInt()） 如果我们传递0，我们将得到一个代表1970年1月1日（UTC）时间的日期对象： new Date(0) 如果我们传递一个字符串而不是数字，那么日期对象将使用parse方法来确定您传递的日期。例如： new Date('2018-07-22') new Date('2018-07') // 2018年7月1日，00:00:00 new Date('2018') // 2018年1月1日，00:00:00 new Date('07/22/2018') new Date('2018/07/22') new Date('2018/7/22') new Date('July 22, 2018') new Date('July 22, 2018 07:22:13') new Date('2018-07-22 07:22:13') new Date('2018-07-22T07:22:13') new Date('25 March 2018') new Date('25 Mar 2018') new Date('25 March, 2018') new Date('March 25, 2018') new Date('March 25 2018') new Date('March 2018') // 2018年3月1日，00:00:00 new Date('2018 March') // 2018年3月1日，00:00:00 new Date('2018 MARCH') // 2018年3月1日，00:00:00 new Date('2018 march') // 2018年3月1日，00:00:00 这里有很大的灵活性。您可以在月份或日期中添加或省略前导零。...

在使用对象时，我们可以创建一个代理对象来拦截和改变现有对象的行为。 我们使用在ES2015引入的Proxy原生对象来实现。 假设我们有一个car对象： const car = { color: 'blue' } 一个非常简单的例子是当我们尝试访问一个不存在的属性时返回一个‘Not found’字符串。 你可以定义一个代理对象，每当你尝试访问这个对象的属性时都会被调用。 你可以通过创建另一个对象来实现，这个对象具有一个get()方法，接收目标对象和属性作为参数： const car = { color: 'blue' } const handler = { get(target, property) { return target[property] ?? 'Not found' } } 然后我们可以通过调用new Proxy()来初始化我们的代理对象，传递原始对象和我们的处理程序： const proxyObject = new Proxy(car, handler) 现在尝试访问car对象中包含的属性，但是从proxyObject引用它： proxyObject.color //'blue' 这就像调用car.color一样。 但是当你尝试访问car上不存在的属性，比如car.test，你将得到undefined。使用代理，你将得到我们告诉它返回的'Not found'字符串。 proxyObject.test //'Not found' 我们在代理处理程序中不仅限于使用get()方法。这只是我们可以编写的最简单的例子。 我们还有其他可以使用的方法： apply当我们在对象上使用apply()时调用这个方法 construct当我们访问对象的构造函数时调用已经被执行 deleteProperty当我们尝试删除一个属性时被执行 defineProperty当我们在对象上定义一个新的属性时调用 set当我们尝试设置一个属性时被执行 等等。基本上我们可以创建一个受保护的门，来控制一个对象上发生的一切，并提供其他规则和控制来实现我们自己的逻辑。 我们还可以使用其他方法（也称为陷阱）: enumerate getOwnPropertyDescriptor getPrototypeOf has isExtensible ownKeys preventExtensions setPrototypeOf 所有这些都对应于相应的功能。...

可選鏈接運算符 (optional chaining operator) 是一個非常有用的運算符，我們可以用它來操作對象及其屬性或方法。 以前，你是否曾使用過 && 運算符作為備用方案呢？這是我最喜歡的 JavaScript 特性之一。 在 JavaScript 中，我們可以先檢查對象是否存在，然後嘗試獲取其屬性，就像這樣： const car = null const color = car && car.color 即使 car 為 null，也不會出現錯誤，color 將被賦予 null 的值。 你可以深入多層級： const car = {} const colorName = car && car.color && car.color.name 在其他一些語言中，使用 && 可能會返回 true 或 false，因為通常它是一個邏輯運算符。 但在 JavaScript 中不是這樣，這讓我們可以做一些很酷的事情。 現在這個新的可選鏈接運算符讓我們更加靈活： const color = car?.color const colorName = car?.color?.name 如果 car 為 null 或 undefined，結果將為 undefined。 不會出現錯誤（而使用 && 運算符時，如果 car 為 undefined，將出現 ReferenceError: car is not defined 錯誤）。

立即調用函數表達式（Immediately-invoked Function Expression，簡稱IIFE）是一種立即執行函數的方式，即在函數被創建的同時立即執行。 IIFE非常有用，因為它們不會污染全局對象，並且是一種簡單的方式來隔離變量聲明。 以下是定義IIFE的語法： (function() { /* code */ })() 也可以使用箭頭函數來定義IIFE： (() => { /* code */ })() 我們基本上在括號內定義了一個函數，然後附加 () 來執行該函數：(/* function */)()。 這些包裹括號實際上使我們的函數內部被視為表達式。否則，函數聲明將無效，因為我們沒有指定任何名稱： 函數聲明需要一個名稱，而函數表達式不需要。 您還可以將調用的括號放在表達式括號內部，這沒有區別，只是一種風格上的偏好： (function() { /* code */ }()) (() => { /* code */ }()) 使用一元運算符的替代語法 有一些更奇怪的語法可以用來創建IIFE，但在現實世界中很少使用，它依賴於使用任意一元運算符： -(function() { /* code */ })() + (function() { /* code */ })() ~(function() { /* code */ })() !(function() { /* code */ })() （對於箭頭函數不起作用） 命名的 IIFE IIFE 也可以是帶有名稱的常規函數（非箭頭函數）。這不會改變函數不會“洩漏”到全局作用域並且在執行後無法再次調用的事實：...

JavaScript 提供一個全域物件，它包含一組全域使用的屬性、函式和物件，無需使用命名空間。 這些屬性包括： Infinity NaN undefined 這些函式包括： decodeURI() decodeURIComponent() encodeURI() encodeURIComponent() eval() isFinite() isNaN() parseFloat() parseInt() 以下為這些物件： Array Boolean Date Function JSON Math Number Object RegExp String Symbol 以及以下錯誤類型： Error EvalError RangeError ReferenceError SyntaxError TypeError URIError 我在JavaScript 錯誤參考文章中描述了這些錯誤。 現在我們來介紹一下全域屬性和函式。 Infinity Infinity 在 JavaScript 中代表無窮大。 要獲得負無窮大，可使用-運算子：-Infinity。 這些值等同於 Number.POSITIVE_INFINITY 和 Number.NEGATIVE_INFINITY。 將任何數字加上 Infinity，或將 Infinity 乘以任何數字，結果仍為 Infinity。 NaN 全域的 NaN 值代表非數字。它通常由零除以零、無效的 parseInt() 執行或其他運算返回。 parseInt() //NaN parseInt('a') //NaN 0/0 //NaN 特別注意的是，NaN 值永遠不等於任何其他 NaN 值。必須使用 isNaN() 全域函式來檢查值是否為 NaN。...

學習 JavaScript 的回傳值基礎知識 每個函式都會回傳一個值，預設情況下為 undefined。 當函式的程式碼執行到結束或遇到 return 關鍵字時，函式即被終止。 當 JavaScript 遇到 return 關鍵字時，它會終止函式的執行並將控制權返回給呼叫者。 如果你傳入一個值，在函式中這個值會作為函式的結果返回： const dosomething = () => { return 'test' } const result = dosomething() // result === 'test' 你只能返回一個值。 為了模擬返回多個值，你可以返回一個物件文字或一個陣列，並在呼叫函式時使用解構賦值。 使用陣列： 使用物件：