10個JavaScript代碼使用技巧速覽
更新時間:2023年12月26日 09:43:53 作者:慕仲卿
這篇文章主要為大家整理了10個JavaScript代碼使用技巧,文中的示例代碼講解詳細,具有一定的借鑒價值,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下
借助構(gòu)造函數(shù)和浮點數(shù)的誤差來做數(shù)學(xué)運算
Number((0.1 + 0.2).toFixed(1)) === 0.3; // true
使用“攤平參數(shù)”和“apply”做參數(shù)不固定的最值查找
const nums = [5, 3, 9, 1, 6]; const maxNum = Math.max.apply(null, nums); // 9 const minNum = Math.min.apply(null, nums); // 1
利用Array構(gòu)造函數(shù)創(chuàng)建長度固定但值未定義的數(shù)組
const arrayOfUndefined = Array(3); // [undefined, undefined, undefined]
使用位運算符進行整數(shù)的快捷操作
// 快速地求平方 let i = 2; let square = i << 1; // 等價于 i * 2 或 i ** 2 // 快速地從浮點數(shù)中丟棄小數(shù)部分取整 let floatNum = 3.15; let intNum = floatNum | 0; // 3
利用void運算符來執(zhí)行表達式且不返回結(jié)果
void function iife() { var localVar = 'I am not returned'; console.log(localVar); }(); console.log(typeof localVar); // undefined
使用逗號運算符鏈式執(zhí)行多個表達式
let x = 1; (x += 1, x *= 3); console.log(x); // 6
使用標簽?zāi)0逭Z法進行高級字符串操作
function highlight(strings, ...values) { return strings.reduce((acc, str, i) => `${acc}${str}<mark>${values[i] || ''}</mark>`, ''); } const name = "Alice"; const greeting = highlight`Hello there, ${name}`; console.log(greeting); // "Hello there,<mark>Alice</mark>"
利用 IIFE 和閉包保存狀態(tài)
var elems = document.querySelectorAll('select option:checked'); var values = Array.prototype.map.call(elems, function(obj){ return obj.value; });
使用數(shù)組解構(gòu)來交換變量的值
let a = 1, b = 2; [b, a] = [a, b]; console.log(a); // 2 console.log(b); // 1
使用邏輯或為函數(shù)參數(shù)提供默認值
function logName(name) { name = name || 'Unknown'; console.log(name); } logName(); // 'Unknown' logName('Alice'); // 'Alice'
到此這篇關(guān)于10個JavaScript代碼使用技巧速覽的文章就介紹到這了,更多相關(guān)JavaScript技巧內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
event.x,event.clientX,event.offsetX區(qū)別
event.x,event.clientX,event.offsetX區(qū)別,需要的朋友可以參考下。2006-11-11JavaScript實現(xiàn)支持過期時間的數(shù)據(jù)緩存功能
這篇文章主要為大家詳細介紹了如何使用JavaScript實現(xiàn)支持過期時間的數(shù)據(jù)緩存功能,文中的示例代碼講解詳細,感興趣的小伙伴可以參考下2025-01-01React Native JSI實現(xiàn)RN與原生通信的示例代碼
本文主要介紹了React Native JSI實現(xiàn)RN與原生通信的示例代碼,文中通過示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2021-08-08解析JavaScript中 querySelector 與 getElementById 方法的區(qū)別
這篇文章主要介紹了JavaScript中 querySelector 與 getElementById 方法的區(qū)別,本文給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2021-10-10