15個有用的神奇JavaScript 技巧
英文 | https://levelup.gitconnected.com/15-magical-javascript-tips-for-every-web-developer-3301feb0b70c
翻譯 | 楊小二
在本文中，我們將分享15個有用的 JavaScript 技巧，為每個 Web 開發(fā)人員節(jié)省寶貴的開發(fā)時間。
技巧1、展平數(shù)組的數(shù)組
這個技巧將幫助你通過在 flat 中使用 Infinity 來展平深度嵌套的數(shù)組。
var array = [123, 500, [1, 2, [34, 56, 67, [234, 1245], 900]], 845, [30257]]//flatten array of arrayarray.flat(Infinity)// output:// [123, 500, 1, 2, 34, 56, 67, 234, 1245, 900, 845, 30257]
技巧 2、簡單的交換變量
你可能使用第三個變量 temp 交換兩個變量。但是這個技巧將向你展示一種使用解構(gòu)來交換變量的新方法。
//example 1var a = 6;var b = 7;[a,b] = [b,a]console.log(a,b) // 7 6
技巧 3、 按字母順序排序
排序是編程中的一個常見問題，這個技巧將通過編寫長代碼，按字母順序?qū)ψ址M行排序，從而來節(jié)省你的寶貴時間。
//sort alphabeticallyfunction alphabetSort(arr){return arr.sort((a, b) => a.localeCompare(b));}let array = ["d", "c", "b", "a"]console.log(alphabetSort(array)) // ["a", "b", "c", "d"]
技巧 4、生成數(shù)字范圍
假設(shè)你想在特定范圍之間生成一個數(shù)字。你將使用的第一種方法是循環(huán)。但是這個技巧將通過簡單的方法為你節(jié)省寶貴的時間。
let Start = 1000, End = 1500;//Generating[...new Array(End + 1).keys()].slice(Start);Array.from({length: End - Start + 1}, (_,i) => Start + i)// [1000, 1001 .... 1500]
技巧 5、縮短控制臺日志
厭倦了一遍又一遍地編寫 console.log() 嗎？這個技巧將展示如何縮短控制臺日志并加快編碼速度。
var c = console.log.bind(document)c(455)c("hello world")
技巧 6、以簡單的方式縮短數(shù)組
對于 Web 開發(fā)人員來說，這是一個很棒的技巧，可以以簡單的方式縮短數(shù)組。你只需要通過使用length 方法來傳遞一個表示新數(shù)組大小的數(shù)字 。
let array = ["A", "B", "C", "D", "E", "F"]array.length=2console.log(array) // ["A", "B"]
技巧 7、使用 isNumber
這個技巧主要是檢查一個值或變量是否包含一個數(shù)字（整數(shù)、浮點數(shù)等）。
function isNumber(n) { return !isNaN(parseFloat(n)) && isFinite(n); }console.log(isNumber(900)) // trueconsole.log(isNumber(23.98)) // trueconsole.log(isNumber("JavaScript")) // false
技巧 8、 使用 isString
這個技巧主要是檢查值或數(shù)據(jù)是否為字符串格式。當(dāng)你從服務(wù)器請求數(shù)據(jù)并想要檢查數(shù)據(jù)類型時，這會派上用場。
const isString = vaue => typeof value === 'string';isString('JavaScript'); // trueisString(345); // falseisString(true); // false
技巧 9、檢查 Null
在編程中，有時我們需要檢查結(jié)果或數(shù)據(jù)是否為空。
const CheckNull= value => value === null || value === undefined;CheckNull(null) // trueCheckNull() // trueCheckNull(123) // falseCheckNull("J") // false
技巧 10、將數(shù)組合二為一
當(dāng)你需要將任意大小的兩個數(shù)組合并為一個時，此技巧將非常有用。為此，你需要使用 JavaScript concate 方法。
//Example Codelet arr1 = ["JavaScript", "Python", "C++"]let arr2 = ["Dart", "Java", "C#"]const mergeArr = arr1.concat(arr2)console.log(mergeArr) // ["JavaScript", "Python", "C++", "Dart", "Java", "C#"]
技巧 11、快速計算性能
這個技巧是我個人最常用的，主要用于計算我的 JavaScript 程序的性能。
const starttime = performance.now();//some programconst endtime = performance.now();const totaltime = startTime - endTimeconsole.log("function takes "+totaltime +" milisecond");
技巧 12、 刪除重復(fù)項
你可能會遇到一個包含重復(fù)數(shù)據(jù)的數(shù)組，并使用循環(huán)方式去除這些重復(fù)數(shù)據(jù)。這個技巧將幫助你在不使用任何循環(huán)的情況下，以簡單的方式刪除重復(fù)項。
const ReDuplicates = array => [...new Set(array)];console.log(ReDuplicates([200,200,300,300,400,500,600,600])) // [200,300,400,600]
技巧 13、將數(shù)字轉(zhuǎn)換為二進制
當(dāng)你需要將數(shù)字轉(zhuǎn)換為二進制時，此技巧很有用。看看下面的示例代碼。
var num = 200console.log(num.toString(2)) // 11001000num = 300console.log(num.toString(2)) //100101100
技巧 14、字符“e”表示過多的零
這技巧將為你節(jié)省時間，你可以通過將所有零替換為字符“e”來擺脫在 JavaScript 中編寫大量的零。
//normal wayvar num = 20000000//good wayvar num2 = 2e7console.log(num2) //20000000
技巧 15、 清空數(shù)組
這個技巧將幫助你節(jié)省清空數(shù)組的時間。我將向你介紹使用 JavaScript 長度方法清空數(shù)組的快速方法。
let array = ["A", "B", "C", "D", "E", "F"]array.length=0console.log(array) // []
學(xué)習(xí)更多技能
請點擊下方公眾號
