JavaScript經常使用工具方法

通用日期時間類方法

function dateFormat(val, format) {
  let date = new Date(val)
  let o = {
    'M+': date.getMonth() + 1, // 月份
    'd+': date.getDate(), // 日
    'h+': date.getHours(), // 小時
    'm+': date.getMinutes(), // 分
    's+': date.getSeconds(), // 秒
    'q+': Math.floor((date.getMonth() + 3) / 3), // 季度
    'S': date.getMilliseconds(), // 毫秒
  }
  if (/(y+)/.test(format)) {
    format = format.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length))
  }
  for (var k in o) {
    if (new RegExp(`(${k})`).test(format)) {
      format = format.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length)))
    }
  }
  return format
}

測試

var datetime = new Date().getTime()
var date1 = dateFormat(datetime, 'yyyy.MM.dd hh:mm:ss')
var date2 = dateFormat(datetime, 'yyyy-MM-dd hh:mm:ss')
var date3 = dateFormat(datetime, 'yyyy-MM-dd')
console.log(date1) // 2018.04.27 16:38:35
console.log(date2) // 2018-04-27 16:38:35
console.log(date3) // 2018-04-27

重寫console.log

console.log = (function(oriLogFunc){
    return function(str)
    {
        oriLogFunc.call(console,"hello:"+str);
    }
})(console.log);
console.log("userName")

函數防抖

export function debounce(func, delay) {
  let timer

  return function (...args) {
    if (timer) {
      clearTimeout(timer)
    }
    timer = setTimeout(() => {
      func.apply(this, args)
    }, delay)
  }
}

函數節流

var throttle = function(delay, action){
  var last = 0
  return function(){
    var curr = +new Date()
    if (curr - last > delay){
      action.apply(this, arguments)
      last = curr 
    }
  }
}

點擊頁面隨機顯示字符串

/* 鼠標點擊特效 */
var a_idx = 0;
jQuery(document).ready(function($) {
    $("body").click(function(e) {
function RndNum(n){
 var rnd="";
 for(var i=0;i<n;i++)
   rnd+=Math.floor(Math.random()*10);
 return rnd;
}
 let a_num=RndNum(6);
var a_color ="#"+a_num;
var a = new Array("富強", "民主", "文明", "和諧", "自由", "平等", "公正" ,"法治", "愛國", "敬業", "誠信", "友善", "吻我", "愛你");
var $i = $("<span></n>").text(a[a_idx]);
        a_idx = (a_idx + 1) % a.length;
var x = e.pageX,
        y = e.pageY;
        $i.css({
"z-index": 999,
"top": y - 30,
"left": x,
"position": "absolute",
"font-weight": "bold",
"color": a_color
        });
        $("body").append($i);
        $i.animate({
"top": y - 190,
"opacity": 0
        },
        1500,
function() {
            $i.remove();
        });
    });
});