摘要:獲取中傳參的值判斷變量的數(shù)據(jù)類(lèi)型深度克隆對(duì)象或數(shù)組多個(gè)對(duì)象或數(shù)組嵌套節(jié)流函數(shù)生成隨機(jī)字符串判斷對(duì)象是否為空判斷是否有該改增加生成隨機(jī)整數(shù)打亂數(shù)組順序,洗牌算法深拷貝數(shù)組判斷是否為純粹的對(duì)象,由或者創(chuàng)建的不是掛在原型上的沒(méi)有原型對(duì)象的對(duì)象通
1. 獲取url中傳參的值
function getParam (name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); var r=window.location.search.substr(1).replace(new RegExp(/(amp;)/g),"").match(reg); if (r != null) { return r[2]; } return null; };2. 判斷變量的數(shù)據(jù)類(lèi)型
function typeOf(obj) { const toString = Object.prototype.toString; const map = { "[object Boolean]" : "boolean", "[object Number]" : "number", "[object String]" : "string", "[object Function]" : "function", "[object Array]" : "array", "[object Date]" : "date", "[object RegExp]" : "regExp", "[object Undefined]": "undefined", "[object Null]" : "null", "[object Object]" : "object" }; return map[toString.call(obj)]; },3. 深度克隆對(duì)象或數(shù)組,多個(gè)對(duì)象或數(shù)組嵌套
deepCopy(data) { const t = this.typeOf(data); let o; if (t === "array") { o = []; } else if ( t === "object") { o = {}; } else { return data; } if (t === "array") { for (let i = 0; i < data.length; i++) { o.push(this.deepCopy(data[i])); } } else if ( t === "object") { for (let i in data) { o[i] = this.deepCopy(data[i]); } } return o; },4. 節(jié)流函數(shù)
debounce(func, delay) { let timer; return function (...args) { if (timer) { clearTimeout(timer); } timer = window.setTimeout(() => { func.apply(this, args); }, delay); } },5. 生成隨機(jī)字符串
function randomStr (len) { len = len || 32; var chars = "ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678"; var maxPos = chars.length; var pwd = ""; for (let i = 0; i < len; i++) { pwd += chars.charAt(Math.floor(Math.random() * maxPos)); } return pwd; };6. 判斷對(duì)象是否為空
function isEmptyObject (obj) { var name; for (name in obj) { return false; } return true; },7. 判斷是否有該class
export function hasClass(el, className){ let reg = new RegExp("(^|S)"+className+"(s|$)"); return reg.test(el.className); }8. 改dom增加class
export function addClass(el, className){ if(hasClass(el, className)){ return; } let newClass=el.className.split(" "); newClass.push(className); el.className=newClass.join(" "); }9. 生成隨機(jī)整數(shù)
function getRandomInt(min, max) { return Math.floor(Math.random() * (max - min + 1) + min); }10. 打亂數(shù)組順序, 洗牌算法
function shuffle(arr) { let _arr = arr.slice(); //深拷貝數(shù)組 for (let i = 0; i<_arr.length; i++) { let j = getRandomInt(0, i); let t = _arr[i]; _arr[i] = _arr[j]; _arr[j] = t; } return _arr; }11. 判斷是否為純粹的對(duì)象,由 new Object 或者 {} 創(chuàng)建的
function isPlainObject ( obj ) { var proto, Ctor; var toString = Object.prototype.toString; var getProto = Object.getPrototypeOf; // 不是掛在原型上的 var hasOwn = Object.prototype.hasOwnProperty; var fnToString = hasOwn.toString; var ObjectFunctionString = fnToString.call(Object); if ( !obj || toString.call( obj ) !== "[object Object]" ) { return false; } proto = getProto( obj ); // 沒(méi)有原型對(duì)象的對(duì)象 (`Object.create( null )`) if ( !proto ) { return true; } // 通過(guò) new Object 出來(lái)的對(duì)象 Ctor = hasOwn.call( proto, "constructor" ) && proto.constructor; return typeof Ctor === "function" && fnToString.call( Ctor ) === ObjectFunctionString; }12. 移動(dòng)端多次點(diǎn)擊事件
var times = 0; // 記錄點(diǎn)擊次數(shù) var timer; const CLICK_TIME = 5; // 比如連續(xù)點(diǎn)擊5此就觸發(fā) document.body.onclick = function () { if (timer) { clearTimeout(timer); timer = null; } if (times >= CLICK_TIME) { // do something } times++; timer = setTimeout(function () { times = 0; }, 200) }---
const REWARD_TICKET = 100 function getRandomArray(count) { let arr = []; let remainTicket = 0; for (let i = 1; i < count; i++) { if (i === 1) { remainTicket = REWARD_TICKET; } else { remainTicket = REWARD_TICKET - arr.reduce((prev, curr) => { return prev + curr; }); } if (remainTicket < 11) { arr.push(remainTicket); break; } const randomNumber = parseInt(Math.random() * remainTicket, 10); arr.push(randomNumber > 10 ? randomNumber : 10); } // make sure every number >= 10 if (arr[arr.length - 1] < 10) { const cut = arr.splice(arr.length - 2, 2); arr.push(cut[0] + cut[1]); } return arr; }
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://m.hztianpu.com/yun/107651.html
摘要:介紹一款模塊加載工具的入門(mén),并且重點(diǎn)介紹其優(yōu)化工具。發(fā)布目錄項(xiàng)目源代碼工具目錄,例如構(gòu)建工具等。另外,前端代碼發(fā)布前都會(huì)進(jìn)行壓縮,使文件足夠小。原來(lái)是因?yàn)槔锪?,所以?yōu)化工具把也合并進(jìn)來(lái)了。而優(yōu)化工具要用好,要多嘗試他們的配置選項(xiàng)。 前端變化太快,如今RequireJS已經(jīng)無(wú)法吸引眼球了。介紹一款模塊加載工具:RequireJS的入門(mén),并且重點(diǎn)介紹其優(yōu)化工具。 一、RequireJS簡(jiǎn)介...
摘要:什么是單頁(yè)面應(yīng)用單頁(yè)面應(yīng)用是指用戶在瀏覽器加載單一的頁(yè)面,后續(xù)請(qǐng)求都無(wú)需再離開(kāi)此頁(yè)目標(biāo)旨在用為用戶提供了更接近本地移動(dòng)或桌面應(yīng)用程序的體驗(yàn)。流程第一次請(qǐng)求時(shí),將導(dǎo)航頁(yè)傳輸?shù)娇蛻舳?,其余?qǐng)求通過(guò)獲取數(shù)據(jù)實(shí)現(xiàn)數(shù)據(jù)的傳輸通過(guò)或遠(yuǎn)程過(guò)程調(diào)用。 什么是單頁(yè)面應(yīng)用(SPA)? 單頁(yè)面應(yīng)用(SPA)是指用戶在瀏覽器加載單一的HTML頁(yè)面,后續(xù)請(qǐng)求都無(wú)需再離開(kāi)此頁(yè) 目標(biāo):旨在用為用戶提供了更接近本地...
摘要:什么是單頁(yè)面應(yīng)用單頁(yè)面應(yīng)用是指用戶在瀏覽器加載單一的頁(yè)面,后續(xù)請(qǐng)求都無(wú)需再離開(kāi)此頁(yè)目標(biāo)旨在用為用戶提供了更接近本地移動(dòng)或桌面應(yīng)用程序的體驗(yàn)。流程第一次請(qǐng)求時(shí),將導(dǎo)航頁(yè)傳輸?shù)娇蛻舳?,其余?qǐng)求通過(guò)獲取數(shù)據(jù)實(shí)現(xiàn)數(shù)據(jù)的傳輸通過(guò)或遠(yuǎn)程過(guò)程調(diào)用。 什么是單頁(yè)面應(yīng)用(SPA)? 單頁(yè)面應(yīng)用(SPA)是指用戶在瀏覽器加載單一的HTML頁(yè)面,后續(xù)請(qǐng)求都無(wú)需再離開(kāi)此頁(yè) 目標(biāo):旨在用為用戶提供了更接近本地...
摘要:以戰(zhàn)爭(zhēng)與和平為藍(lán)本回顧了歷史,也給出了非常贊的觀察視角,程序員應(yīng)該務(wù)實(shí),而不是教條,更重要的是保持好奇心。初版于年前發(fā)布的,作者重寫(xiě)整個(gè)倉(cāng)庫(kù)從到之后,最近發(fā)布了版本,新版最大變化是升級(jí)到。 showImg(https://segmentfault.com/img/remote/1460000009584813); 不知道大家是否注意到,社區(qū)中出現(xiàn)的 CSS 尤其是 CSS-IN-JS...
閱讀 3053·2021-09-23 11:32
閱讀 3009·2021-09-22 15:12
閱讀 1774·2019-08-30 14:07
閱讀 3538·2019-08-29 16:59
閱讀 1721·2019-08-29 11:11
閱讀 2378·2019-08-26 13:50
閱讀 2482·2019-08-26 13:49
閱讀 2676·2019-08-26 11:49