12 個(gè)你可能還未使用的 JS 技巧
英文 | https://levelup.gitconnected.com/12-javascript-features-youve-probably-never-used-db932c413cdd
翻譯 | 楊小二
1 、短循環(huán)
var names = ["John", "Trevor", "Steve", "Jacob"]// long methodfor(var i = 0; i < names.length; i++) {console.log(names[i])}//short single line methodfor(let name of names) console.log(name)
2、調(diào)整一個(gè)數(shù)組的長(zhǎng)度
你知道我們可以使用 JavaScript length方法調(diào)整數(shù)組的大小嗎？長(zhǎng)度不僅用于獲取數(shù)組的大小。如果我們將數(shù)組的長(zhǎng)度設(shè)置為任意數(shù)字，它將對(duì)數(shù)組進(jìn)行切片。
var array1 = [1, 2, 3, 4, 5, 6]var array2 = ["Python", "JavaScript", "C++", "Dart"]array1.length=3array2.length=1console.log(array1) // [1, 2, 3]console.log(array2) // ["Python"]
3、函數(shù)參數(shù)
你不需要定義函數(shù)參數(shù)，你可以將函數(shù)參數(shù)用作數(shù)組對(duì)象，而無(wú)需在函數(shù)實(shí)現(xiàn)時(shí)聲明參數(shù)。
function add() // no paramter is defined{var sum = 0for(var i=0; i < arguments.length; i++){sum=sum + arguments[i]}console.log("Total Sum : ", sum) // Total Sum : 9}// calling functionadd(1, 3, 5)
4、 JavaScript 中的時(shí)間戳
你知道在 JavaScript 中我們有很多方法可以使用 Date 方法來(lái)獲取日期嗎？查看下面的代碼示例。
// original methodvar date = new Date()timestamp = date.getDate()console.log(timestamp)// shorter methodtimestamp = new Date().getDate()console.log(timestamp)// shortest methodtimestamp += new Date();console.log(timestamp)
5、刪除數(shù)組中的一個(gè)值
通常，我們使用 delete 方法從數(shù)組中刪除一個(gè)項(xiàng)目。但這就是在陣列中打孔的方法。它將 undefined 放在刪除項(xiàng)目索引上。
我們可以使用該splice方法做一些工作，但它會(huì)從數(shù)組中完全刪除索引，而不會(huì)留下任何漏洞。
// synatax : splice(array index, number of value to delete )var array = [1, 2, 3, 4, 5, 6]//delete methoddelete array[4]//splice methodarray.splice(4,1)console.log(array) // [1, 2, 3, 4, 6]
6、JavaScript 中的 IN 運(yùn)算符
通過(guò)使用in運(yùn)算符，你可以檢查對(duì)象中是否存在鍵。當(dāng)你檢查對(duì)象中是否存在特定鍵時(shí)，這個(gè)技巧就會(huì)派上用場(chǎng)。
var a = 4var b = 5var list = {1:7, 3:9, 4:0, 2:9}console.log(a in list) //trueconsole.log(b in list) // false
7、JavaScript 字符串填充
JavaScript 填充用在字符串文本中添加。我們可以在字符串的開(kāi)頭或結(jié)尾添加填充。這是padStartand的語(yǔ)法padEnd。
padStart(targetLength, padString(optional))padEnd(targetLength, padString(optional))
PadString 是兩種 Padding 方法中的可選參數(shù)。下面是理解他們工作的代碼示例。
console.log("123".padStart(5)) // 123console.log("123".padStart(5, "0")) // 00123console.log("123".padEnd(5, "0")) // 12300console.log("123".padEnd(10, "0")) // 1230000000
8、Power ** 運(yùn)算符
此功能將為你節(jié)省大量數(shù)學(xué)計(jì)算時(shí)間。你可能使用Math.pow()函數(shù)來(lái)計(jì)算數(shù)字的冪。但我們可以使用 ** 運(yùn)算符代替它。
// old methodvar p = Math.pow(2,5)console.log(p) // 32// new methodvar p = 2**5console.log(p) // 32
你會(huì)認(rèn)為Math.pow()仍然是最好的方法。那么使用這種方法的長(zhǎng)數(shù)學(xué)方程呢？
// old methodvar p = Math.pow(2,5) + Math.pow(2,5) + Math.pow(2,1) + Math.pow(2,3) + Math.pow(2,4) + Math.pow(2,9)console.log(p) // 602// new methodvar p = 2**5 + 2**5 + 2**1 + 2**3 + 2**4 + 2**9console.log(p) // 602
嗯，它比使用Math.pow()函數(shù)更清晰易懂。
9、includes()
我敢打賭，你們中的大多數(shù)人都用來(lái)indexOf在數(shù)組中查找元素。不要使用那個(gè)方法。因?yàn)槲覀冇懈玫姆椒▉?lái)做同樣的工作。使用include方法而不是indexOf返回布爾值的結(jié)果。
var array = ["Python", "JavaScript", "C++", "Dart", "JAVA"]console.log(array.includes("JavaScript")) //Trueconsole.log(array.includes("C#")) // false
10、重定向到 URL
JavaScript 有一些方法可以在你執(zhí)行代碼后，將你重定向到瀏覽器中的網(wǎng)站。當(dāng)用戶(hù)在網(wǎng)站上執(zhí)行任何操作并且 JavaScript 將用戶(hù)重定向到另一個(gè) URL 時(shí)，這個(gè)就會(huì)派上用場(chǎng)。
const Redirect = (url, asLink = true) => asLink ? (window.location.href = url) : window.location.replace(url);redirect('https://medium.com/@codedev101')
11、一元運(yùn)算符 (+)
一元運(yùn)算符可以方便地將字符串?dāng)?shù)字轉(zhuǎn)換為數(shù)字格式并將日期轉(zhuǎn)換為毫秒?？纯聪旅娴拇a示例。
var strnum = "324.5"var num = +strnumconsole.log(num) // 324.5var currentDate = new Date();var millisSince = +currentDate;console.log(millisSince)
12、將浮點(diǎn)數(shù)轉(zhuǎn)換為整數(shù)（快速方法）
要將浮點(diǎn)數(shù)轉(zhuǎn)換為整數(shù)，你必須使用Math.floor()、Math.round()和Math.ceil()方法，但你可以使用|按位 OR 運(yùn)算符以更快的方式進(jìn)行轉(zhuǎn)換。查看下面的代碼示例。
// old wayconsole.log(Math.floor(23.56))// Quick wayconsole.log(23.56 | 0)
最后的想法
我希望你會(huì)發(fā)現(xiàn) JavaScript 的這些特性和技巧有用且有趣，并且你發(fā)現(xiàn)了任何新技巧，請(qǐng)?jiān)诹粞詤^(qū)與我分享它們。
如果你覺(jué)得這篇文章有幫助，請(qǐng)點(diǎn)一個(gè)贊。
感謝你的閱讀，編程愉快！
學(xué)習(xí)更多技能
請(qǐng)點(diǎn)擊下方公眾號(hào)
