創(chuàng)建DOM

第一種：

for(let i=0;i<1000;i++){var el = document.createElement('p');el.innerHTML = i;document.body.appendChild(el); }

第二種：

let html =[]; for(let i=0;i<100;i++){html.push('<p>'+i+'</p>'); } document.body.innerHTML = html.join('');

if else優(yōu)化

const mod= new Map([['phone',100],['age',20],['time',899]] );const pric = (name)=>{return mod.get(name); } pric('age');

includes優(yōu)化

const arr= [1,2,3,4,5,6]; function verif(id){if(arr.includes(id)){return '包含'}else{return '不包含'} }verif(3);

數(shù)組去重

方法一：

function reap(arr) {let newArr=[];for(let i=0;i<arr.length;i++){if(newArr.indexOf(arr[i])=== -1){newArr.push(arr[i]); }}return newArr; } reap([1,2,3,4,1,2,3]);

方法二 ：

[...new Set([1,2,3,4,5,1,2,3])]

節(jié)流函數(shù)
持續(xù)觸發(fā) scroll 事件時，并不立即執(zhí)行 handle 函數(shù)，當(dāng) 1000 毫秒內(nèi)沒有觸發(fā) scroll 事件時，才會延時觸發(fā)一次 handle 函數(shù)。

function debounce(fn, wait) {let timeout = nullreturn function () {if (timeout !== null) clearTimeout(timeout)timeout = setTimeout(fn, wait)} } function handle() {console.log(Math.random()) } window.addEventListener('scroll', debounce(handle, 1000))

轉(zhuǎn)換成駝峰形式

css 中經(jīng)常有類似 background-image 這種通過 - 連接的字符，通過 javascript 設(shè)置樣式的時候需要將這種樣式轉(zhuǎn)換成 backgroundImage 駝峰格式

function toCamel(str) {let arr = str.split("-");let newstr ='';for (var i = 1; i < arr.length; i++) {var str = arr[i];var upper = str[0].toUpperCase();str = str.replace(str[0], upper);arr[i] = str;}for(let i=0;i<arr.length;i++){newstr += arr[i];}return newstr; }console.log(toCamel('font-size'));

RGB轉(zhuǎn)換成16進制

function colorRGBtoHex(color) {var rgb = color.split(',');var r = parseInt(rgb[0].split('(')[1]);var g = parseInt(rgb[1]);var b = parseInt(rgb[2].split(')')[0]);var hex = "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);return hex; } toHexString('rgb(100,200,100)');

總結(jié)

以上是生活随笔為你收集整理的前端算法1的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。