前端開發中經常使用的工具函數

輪子仍是得造

/** * @description 獲取cookie * @param name * @returns {*} */ export function getCookie(name) { var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)"); if (arr = document.cookie.match(reg)) return (arr[2]); else
    return null; } /** *@description 設置cookie * @param c_name * @param value * @param expiredays */ export function setCookie(c_name, value, expiredays) { var exdate = new Date(); exdate.setDate(exdate.getDate() + expiredays); document.cookie = c_name + "=" + escape(value) + ((expiredays == null) ? "" : ";expires=" + exdate.toGMTString()); }; /** * @description 刪除cookie * @param name */ export function delCookie(name) { var exp = new Date(); exp.setTime(exp.getTime() - 1); var cval = getCookie(name); if (cval != null) document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString(); };

搭橋過河，才能走的穩

/** * Created by zhengyi.fu on 2018/2/28. */

/** * @description 根據數組對象的某一個屬性分組 * @param {String} key * @param {Array} arr */ let groupTwo = function (key, arr) { if(arr instanceof Array) { let map = {}, dest = []; for (let i = 0; i < arr.length; i++) { if (!map[arr[i][key]]) { dest.push({ [key]: arr[i][key], data: [arr[i]] }); map[arr[i][key]] = arr[i]; } else { for (let j = 0; j < dest.length; j++) { var dj = dest[j]; if (dj[key] == arr[i][key]) { dj.data.push(arr[i]); break; } } } } return dest; }else { throw "noRepeat expect an array as param"; } }; /** * @description 重複數組去重 * @param arr * @returns {Array} */ let noRepeat =  function(arr) { if (arr instanceof Array) { var newArr = []; for (let i = 0, len = arr.length; i < len; i++) { let flag = false; for (let j = 0, len2 = newArr.length; j < len2; j++) { if (JSON.stringify(newArr[j]) == JSON.stringify(arr[i])) { flag = true; break; } } if (flag == false) { newArr.push(arr[i]); } } return newArr; } else { throw "noRepeat expect an array as param"; } } /** * * @description url參數轉對象 * @param {String} url default: window.location.href * @return {Object} */ let parseQueryString = function(url) { url = url == null ? window.location.href : url var search = url[0] === '?' ? url.substr(1) : url.substring(url.lastIndexOf('?') + 1) if (search === '') return {} search = search.split('&'); var query = {}; for (var i = 0; i < search.length; i++) { var pair = search[i].split('='); query[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1] || ''); } return query; } /** * * @description 對象序列化(對象轉成url參數) * @param {Object} obj * @return {String} */ let stringfyQueryString = function(obj) { if (!obj) return ''; var pairs = []; for (var key in obj) { var value = obj[key]; if (value instanceof Array) { for (var i = 0; i < value.length; ++i) { pairs.push(encodeURIComponent(key + '[' + i + ']') + '=' + encodeURIComponent(value[i])); } continue; } pairs.push(encodeURIComponent(key) + '=' + encodeURIComponent(obj[key])); } return pairs.join('&'); } /** * * @description 格式化如今距${endTime}的剩餘時間 * @param {Date} endTime * @return {String} */ let formatRemainTime = function(endTime) { var startDate = new Date(); //開始時間
  var endDate = new Date(endTime); //結束時間
  var t = endDate.getTime() - startDate.getTime(); //時間差
  var d = 0, h = 0, m = 0, s = 0; if (t >= 0) { d = Math.floor(t / 1000 / 3600 / 24); h = Math.floor(t / 1000 / 60 / 60 % 24); m = Math.floor(t / 1000 / 60 % 60); s = Math.floor(t / 1000 % 60); } return doubleNum(d)+ "天 " + doubleNum(h) + "小時 " + doubleNum(m) + "分鐘 " + doubleNum(s) + "秒"; } /** * @description 補全兩位數 * @param n * @returns {*} */ let doubleNum = function (n) { if(n.length > 2 || n > 100){ return n; } n = parseInt(n); return n >= 10 ? n : `0${n}`; } /** * * @description 現金額轉大寫 * @param {Number} n * @return {String} */ let digitUppercase = function(n) { var fraction = ['角', '分']; var digit = [ '零', '壹', '貳', '叄', '肆', '伍', '陸', '柒', '捌', '玖' ]; var unit = [ ['元', '萬', '億'], ['', '拾', '佰', '仟'] ]; var head = n < 0 ? '欠' : ''; n = Math.abs(n); var s = ''; for (var i = 0; i < fraction.length; i++) { s += (digit[Math.floor(n * 10 * Math.pow(10, i)) % 10] + fraction[i]).replace(/零./, ''); } s = s || '整'; n = Math.floor(n); for (var i = 0; i < unit[0].length && n > 0; i++) { var p = ''; for (var j = 0; j < unit[1].length && n > 0; j++) { p = digit[n % 10] + unit[1][j] + p; n = Math.floor(n / 10); } s = p.replace(/(零.)*零$/, '').replace(/^$/, '零') + unit[0][i] + s; } return head + s.replace(/(零.)*零元/, '元') .replace(/(零.)+/g, '零') .replace(/^整$/, '零元整'); }; /** * * @desc 判斷是否爲郵箱地址 * @param {String} str * @return {Boolean} */ let isEmail = function(str) { return /\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/.test(str); } /** * * @description 判斷是否爲身份證號 * @param {String|Number} str * @return {Boolean} */ let isIdCard = function(str) { return /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/.test(str) } /** * * @description 判斷是否爲手機號 * @param {String|Number} str * @return {Boolean} */ let isPhoneNum = function(str) { return /^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/.test(str) } /** * * @description 判斷是否爲URL地址 * @param {String} str * @return {Boolean} */ let isUrl = function(str) { return /[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/i.test(str); } /** * * @description 隨機生成顏色 * @return {String} */ let randomColor = function() { return '#' + ('00000' + (Math.random() * 0x1000000 << 0).toString(16)).slice(-6); } /** * * @description 生成指定範圍[min, max]的隨機數 * @param {Number} min * @param {Number} max * @return {Number} */ let randomNum = function(min, max) { return Math.floor(Math.random() * (max-min+1) )+ min; } /** * @description 深拷貝，支持常見類型 * @param {Any} values */ let deepClone = function(values) { var copy; // Handle the 3 simple types, and null or undefined
  if (null == values || "object" != typeof values) return values; // Handle Date
  if (values instanceof Date) { copy = new Date(); copy.setTime(values.getTime()); return copy; } // Handle Array
  if (values instanceof Array) { copy = []; for (var i = 0, len = values.length; i < len; i++) { copy[i] = deepClone(values[i]); } return copy; } // Handle Object
  if (values instanceof Object) { copy = {}; for (var attr in values) { if (values.hasOwnProperty(attr)) copy[attr] = deepClone(values[attr]); } return copy; } throw new Error("Unable to copy values! Its type isn't supported."); } /** * * @description 判斷`obj`是否爲空 * @param {Object} obj * @return {Boolean} */ let isEmptyObject = function(obj) { if (!obj || typeof obj !== 'object' || Array.isArray(obj)) return false
  return !Object.keys(obj).length } /** * * @description 獲取滾動條距頂部的距離 */ let getScrollTop = function() { return (document.documentElement && document.documentElement.scrollTop) || document.body.scrollTop; } /** * * @description H5軟鍵盤縮回、彈起回調 * 當軟件鍵盤彈起會改變當前 window.innerHeight，監聽這個值變化 * @param {Function} downCb 當軟鍵盤彈起後，縮回的回調 * @param {Function} upCb 當軟鍵盤彈起的回調 */ let windowResize = function(downCb, upCb) { var clientHeight = window.innerHeight; downCb = typeof downCb === 'function' ? downCb : function () {} upCb = typeof upCb === 'function' ? upCb : function () {} window.addEventListener('resize', () => { var height = window.innerHeight; if (height === clientHeight) { downCb(); } if (height < clientHeight) { upCb(); } }); } /** * * @desc 獲取瀏覽器類型和版本 * @return {String} */ let getExplore = function() { var sys = {}, ua = navigator.userAgent.toLowerCase(), s; (s = ua.match(/rv:([\d.]+)\) like gecko/)) ? sys.ie = s[1]: (s = ua.match(/msie ([\d\.]+)/)) ? sys.ie = s[1] : (s = ua.match(/edge\/([\d\.]+)/)) ? sys.edge = s[1] : (s = ua.match(/firefox\/([\d\.]+)/)) ? sys.firefox = s[1] : (s = ua.match(/(?:opera|opr).([\d\.]+)/)) ? sys.opera = s[1] : (s = ua.match(/chrome\/([\d\.]+)/)) ? sys.chrome = s[1] : (s = ua.match(/version\/([\d\.]+).*safari/)) ? sys.safari = s[1] : 0; // 根據關係進行判斷
  if (sys.ie) return ('IE: ' + sys.ie) if (sys.edge) return ('EDGE: ' + sys.edge) if (sys.firefox) return ('Firefox: ' + sys.firefox) if (sys.chrome) return ('Chrome: ' + sys.chrome) if (sys.opera) return ('Opera: ' + sys.opera) if (sys.safari) return ('Safari: ' + sys.safari) return 'Unkonwn' } /** * * @description 獲取操做系統類型 * @return {String} */ let getOS = function() { var userAgent = 'navigator' in window && 'userAgent' in navigator && navigator.userAgent.toLowerCase() || ''; var vendor = 'navigator' in window && 'vendor' in navigator && navigator.vendor.toLowerCase() || ''; var appVersion = 'navigator' in window && 'appVersion' in navigator && navigator.appVersion.toLowerCase() || ''; if (/iphone/i.test(userAgent) || /ipad/i.test(userAgent) || /ipod/i.test(userAgent)) return 'ios'
  if (/android/i.test(userAgent)) return 'android'
  if (/win/i.test(appVersion) && /phone/i.test(userAgent)) return 'windowsPhone'
  if (/mac/i.test(appVersion)) return 'MacOSX'
  if (/win/i.test(appVersion)) return 'windows'
  if (/linux/i.test(appVersion)) return 'linux' } let utis = { groupTwo, noRepeat, parseQueryString, stringfyQueryString, formatRemainTime, doubleNum, digitUppercase, isEmail, isIdCard, isPhoneNum, isUrl, randomColor, randomNum, deepClone, isEmptyObject, getScrollTop, windowResize, getExplore, getOS } export default utis