您可能已經知道 JAVAScript 是世界上使用最廣泛的編程語言。它用于 Web、移動混合應用程序、服務器端 (NodeJS) 和各種其他應用程序。由于它可用于在 Web 瀏覽器中顯示以及使用 nodebot 或其他智能交互機器人，因此它可以作為許多新開發人員的編程入門。在就業市場上，精通 JavaScript 并能編寫干凈、高效代碼的開發人員需求量很大。

無論使用何種瀏覽器/引擎或 SSJS（Server Side JavaScript）解釋器，所有 JavaScript 開發人員都應該熟悉我將在本文中分享的提示、技巧和最佳實踐。

一直使用 === 替代 ==

如有必要，使用 ==（或！=）運算符自動執行類型轉換。使用 ===（或 !==）運算符時不會進行轉換。有人可能會爭辯說它比較值和類型比 == 更快。

[5] === 5   // is false
[5]  == 5    // is true
'5' == 5     // is true
'5' === 5    // is false
 []   == 0     // is true
 [] ===  0     // is false
 '' == false   // is true but true == "a" is false
 '' ===   false // is false

第一次聲明變量的值時，盡量避免使用 var 關鍵字

全局變量在分配給未聲明的變量時自動聲明。盡量防止使用全局變量。

使用 typeof、instanceof 和 constructor 時要小心。

typeof 操作符用于檢測變量的數據類型，它返回一個字符串，表示變量的類型。它可以檢測出所有類型，包括：

基本類型（number, string, boolean, undefined）
引用類型（object, function）

如果要檢測一個變量是否是基本類型，可以使用 typeof。

let x = 5;
console.log(typeof x); // "number"

instanceof 操作符用于檢測一個對象是否是某個類的實例。它返回一個布爾值，表示對象是否是類的實例。它只能用于檢測對象類型，因為基本類型沒有構造函數。

let x = new Date();
console.log(x instanceof Date); // true

constructor 屬性返回創建對象的構造函數。它也只能用于檢測對象類型。

let x = new Date();
console.log(x.constructor === Date); // true

它們之間的區別就是 typeof 操作符用于檢測類型，而 instanceof 和 constructor 都用于檢測類。 instanceof 操作符檢測對象是否是某個類的實例，而 constructor 檢測對象是由哪個類創建的。

另外，typeof 可以檢測出所有類型，而 instanceof 和 constructor 只能檢測對象

還有一點值得注意的是，instanceof 操作符在檢測繼承關系時也是有效的。比如，如果一個類 B 繼承自另一個類 A，那么一個 B 類的實例也是 A 類的實例。

class A {}
class B extends A {}
let x = new B();
console.log(x instanceof B); // true
console.log(x instanceof A); // true

而 constructor 屬性則只能檢測到對象是由哪個類直接創建的，并不能檢測繼承關系。

class A {}
class B extends A {}
let x = new B();
console.log(x.constructor === B); // true
console.log(x.constructor === A); // false

總結一下，typeof 操作符用于檢測變量的類型，instanceof 操作符用于檢測對象是否是某個類的實例，而 constructor 屬性用于檢測對象是由哪個類創建的。

typeof 和 instanceof 都只能檢測對象類型，但instanceof 不能檢測基本類型。 instanceof 可以檢測繼承關系，而 constructor 只能檢測直接創建的關系。

False 值包括 undefined、null、0、false、NaN 和“（空字符串）。

創建自調用函數（IIFE）

自調用匿名函數或立即調用函數表達式是此 (IIFE) 的通用名稱。它是以下形式的函數，在創建后立即運行：

(function(){
    // some private code to be executed automatically
})();  
(function(d,y){
    var result = d+y;
    return result;
})(20,20)

隨機數字數組

var numbers = [6, 650, 140 , -225 , 233 , 500 , 152300, -81451];
numbers = numbers.sort(function(){ return Math.random() - 0.5});

驗證給定的參數是一個數字

function isNumber(n){
    return !isNaN(parseFloat(n)) && isFinite(n);
}

將 arguments 對象轉換為數組

var argumentsArray = Array.prototype.slice.call(arguments);

清空數組

var newArray = [12 , 222 , 1000 ];  
newArray.length = 0; // newArray will be equal to [].

使用 map() 函數方法循環遍歷數組的項目

var squares = [1,4,6,2].map(function (val) {  
    return val * val;  
}); 
// squares will be equal to [1, 16, 26, 4]

結束語

由于文章篇幅問題，今天的介紹就到這里，下一篇文章繼續介紹剩下的10個小技巧，希望今天的分享對你有所幫助，感謝你的閱讀，如果你喜歡我的分享，別忘了點贊轉發，讓更多的人看到，最后別忘記點個關注，你的支持將是我分享最大的動力，后續我會持續輸出更多內容，敬請期待。

原文：
https://javascript.plAInenglish.io/my-20-most-useful-javascript-tips-tricks-and-best-practices-9ad8fe7f0c01

作者：Abdulazeez Sherif

非直接翻譯，有自行改編和添加部分。