JavaScript 函数及开发技巧

生成一周时间

function getWeekTime(){
  return [...new Array(7)].map((j,i)=> new Date(Date.now()+i*8.64e7).toLocaleDateString())
}
getWeekTime();
// 输出效果 ["2020/7/21", "2020/7/22", "2020/7/23", "2020/7/24", "2020/7/25", "2020/7/26", "2020/7/27"]

判断空对象

let a = {}
JSON.stringify(a) == '{}';

类型判断

/**
* @param {any} target
* @param {string} type
* @return {boolean}
*/
function isType(target, type) {
  let targetType = Object.prototype.toString.call(target).slice(8, -1).toLowerCase()
  return targetType === type.toLowerCase()
}
isType([], 'Array') // true
isType(/\d/, 'RegExp') // true
isType(new Date(), 'Date') // true
isType(function(){}, 'Function') // true
isType(Symbol(1), 'Symbol') // true

对象属性剔除

/**
* @param {object} object
* @param {string[]} props
* @return {object}
*/
function omit(object, props=[]){
  let res = {}
  Object.keys(object).forEach(key=>{
    if(props.includes(key) === false){
      res[key] = typeof object[key] === 'object' && object[key] !== null ?
        jsON.parse(jsON.stringify(object[key])):
        object[key]
    }
  })
  return res
}
let data = {
  id: 1,
  title: 'xxx',
  comment: []
}
omit(data, ['id']) // {title: 'xxx', comment: []}

日期格式化

/**
* @param {string} format
* @param {number} timestamp - 时间戳
* @return {string}
*/
function formatDate(format='Y-M-D h:m', timestamp=Date.now()){
  let date = new Date(timestamp)
  let dateInfo = {
    Y: date.getFullYear(),
    M: date.getMonth()+1,
    D: date.getDate(),
    h: date.getHours(),
    m: date.getMinutes(),
    s: date.getSeconds()
  }
  let formatNumber = (n) => n > 10 ? n : '0' + n
  let res = format
    .replace('Y', dateInfo.Y)
    .replace('M', dateInfo.M)
    .replace('D', dateInfo.D)
    .replace('h', formatNumber(dateInfo.h))
    .replace('m', formatNumber(dateInfo.m))
    .replace('s', formatNumber(dateInfo.s))
  return res
}
formatDate() // "2020-2-24 13:44"
formatDate('M月D日 h:m') // "2月24日 13:45"
formatDate('h:m Y-M-D', 1582526221604) // "14:37 2020-2-24"

性能分析

window.onload = function(){
  setTimeout(()=>{
    let t = performance.timing,
        m = performance.memory
    console.table({
      'DNS查询耗时': (t.domainLookupEnd - t.domainLookupStart).toFixed(0),
      'TCP链接耗时': (t.connectEnd - t.connectStart).toFixed(0),
      'request请求耗时': (t.responseEnd - t.responseStart).toFixed(0),
      '解析dom树耗时': (t.domComplete - t.domInteractive).toFixed(0),
      '白屏时间': (t.responseStart - t.navigationStart).toFixed(0),
      'domready时间': (t.domContentLoadedEventEnd - t.navigationStart).toFixed(0),
      'onload时间': (t.loadEventEnd - t.navigationStart).toFixed(0),
      'js内存使用占比': m ? (m.usedjsHeapSize / m.totaljsHeapSize * 100).toFixed(2) + '%' : undefined
    })
  })
}

防抖

/**
* @param {function} func - 执行函数
* @param {number} wait - 等待时间
* @param {boolean} immediate - 是否立即执行
* @return {function}
*/
function debounce(func, wait = 300, immediate = false){
  let timer, ctx;
  let later = (arg) => setTimeout(()=>{
    func.apply(ctx, arg)
    timer = ctx = null
  }, wait)
  return function(...arg){
    if(!timer){
      timer = later(arg)
      ctx = this
      if(immediate){
        func.apply(ctx, arg)
      }
    }else{
      clearTimeout(timer)
      timer = later(arg)
    }
  }
}
let scrollHandler = debounce(function(e){
  console.log(e)
}, 500)
window.onscroll = scrollHandler

节流

/**
* @param {function} func - 执行函数
* @param {number} delay - 延迟时间
* @return {function}
*/
function throttle(func, delay){
  let timer = null
  return function(...arg){
    if(!timer){
      timer = setTimeout(()=>{
        func.apply(this, arg)
        timer = null
      }, delay)
    }
  }
}
let scrollHandler = throttle(function(e){
  console.log(e)
}, 500)
window.onscroll = scrollHandler

base64数据导出文件下载

/**
* @param {string} filename - 下载时的文件名
* @param {string} data - base64字符串
*/
function downloadFile(filename, data){
  let downloadLink = document.createElement('a');
  if ( downloadLink ){
    document.body.appendChild(downloadLink);
    downloadLink.style = 'display: none';
    downloadLink.download = filename;
    downloadLink.href = data;
    if ( document.createEvent ){
      let downloadEvt = document.createEvent('MouseEvents');
      downloadEvt.initEvent('click', true, false);
      downloadLink.dispatchEvent(downloadEvt);
    } else if ( document.createEventObject ) {
      downloadLink.fireEvent('onclick');
    } else if (typeof downloadLink.onclick == 'function' ) {
      downloadLink.onclick();
    }
    document.body.removeChild(downloadLink);
  }
}

检测是否为PC端浏览器

function isPCBroswer() {
  let e = window.navigator.userAgent.toLowerCase()
    , t = "ipad" == e.match(/ipad/i)
    , i = "iphone" == e.match(/iphone/i)
    , r = "midp" == e.match(/midp/i)
    , n = "rv:1.2.3.4" == e.match(/rv:1.2.3.4/i)
    , a = "ucweb" == e.match(/ucweb/i)
    , o = "android" == e.match(/android/i)
    , s = "windows ce" == e.match(/windows ce/i)
    , l = "windows mobile" == e.match(/windows mobile/i);
  return !(t || i || r || n || a || o || s || l)
}

识别浏览器及平台

function getPlatformInfo(){
  //运行环境是浏览器
  let inBrowser = typeof window !== 'undefined';
  //运行环境是微信
  let inWeex = typeof WXEnvironment !== 'undefined' && !!WXEnvironment.platform;
  let weexPlatform = inWeex && WXEnvironment.platform.toLowerCase();
  //浏览器 UA 判断
  let UA = inBrowser && window.navigator.userAgent.toLowerCase();
  if(UA){
    let platforms = {
      IE: /msie|trident/.test(UA),
      IE9: UA.indexOf('msie 9.0') > 0,
      Edge: UA.indexOf('edge/') > 0,
      Android: UA.indexOf('android') > 0 || (weexPlatform === 'android'),
      IOS: /iphone|ipad|ipod|ios/.test(UA) || (weexPlatform === 'ios'),
      Chrome: /chrome\/\d+/.test(UA) && !(UA.indexOf('edge/') > 0),
    }
    for (const key in platforms) {
      if (platforms.hasOwnProperty(key)) {
        if(platforms[key]) return key
      }
    }
  }
}

加入收藏、设为首页、保存到桌面

//设为首页
function SetHome(obj,url){
  try{
    obj.style.behavior='url(#default#homepage)';
    obj.setHomePage(url);
  }catch(e){
    if(window.netscape){
      try{
        netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
      }catch(e){
        alert("抱歉，此操作被浏览器拒绝！\n\n请在浏览器地址栏输入“about:config”并回车然后将[signed.applets.codebase_principal_support]设置为'true'");
      }
    }else{
      alert("抱歉，您所使用的浏览器无法完成此操作。\n\n您需要手动将【"+url+"】设置为首页。");
    }
  }
}
//收藏本站
function AddFavorite(title, url) {
  try {
    window.external.addFavorite(url, title);
  }
  catch (e) {
    try {
      window.sidebar.addPanel(title, url, "");
    }
    catch (e) {
      alert("抱歉，您所使用的浏览器无法完成此操作。\n\n加入收藏失败，请使用Ctrl+D进行添加");
    }
  }
}
//保存到桌面
function toDesktop(sUrl,sName){
  try {
    var WshShell = new ActiveXObject("WScript.Shell");
    var oUrlLink =          WshShell.CreateShortcut(WshShell.SpecialFolders("Desktop")     + "\\" + sName + ".url");
    oUrlLink.TargetPath = sUrl;
    oUrlLink.Save();
  }
  catch(e)  {
    alert("当前IE安全级别不允许操作！");
  }
}

<a href="JavaScript:void(0);" onclick="SetHome(this,'http://www.xyz.com');">设为首页</a>
<a href="JavaScript:void(0);" onclick="AddFavorite('我的网站',location.href)">收藏本站</a>
<a href="JavaScript:void(0);" onclick=" toDesktop(location.href,'我的网站')">保存到桌面</a>

实现隐藏手机号码中间4位数

//  正则
function geTel(tel){
    var reg = /^(\d{3})\d{4}(\d{4})$/;  
    return tel.replace(reg, "$1****$2");
}
//测试
var tel = "17326453333"; 
console.log(geTel(tel));//173****3333
//  通过长度截取

//  长度截取
function geTel(tel){
  return tel.substring(0, 3)+"****"+tel.substr(tel.length-4);
}
//测试
var tel = "17326453333";
console.log(geTel(tel));//173****3333

延迟函数delay

 const delay = ms => new Promise((resolve, reject) => setTimeout(resolve, ms))
 const getData = status => new Promise((resolve, reject) => {
   status ? resolve('done') : reject('fail')
 })
const getRes = async (data) => {
   try {
       const res = await getData(data)
       const timestamp = new Date().getTime()
       await delay(1000)
       console.log(res, new Date().getTime() - timestamp)
   } catch (error) {
       console.log(error)
   }
}
getRes(true) // 隔了1秒

分割指定长度的元素数组

const listChunk = (list, size = 1, cacheList = []) => {
  const tmp = [...list]
  if (size <= 0) {
    return cacheList
  }
  while (tmp.length) {
    cacheList.push(tmp.splice(0, size))
  }
  return cacheList
}

console.log(listChunk([1, 2, 3, 4, 5, 6, 7, 8, 9])) // [[1], [2], [3], [4], [5], [6], [7], [8], [9]]
console.log(listChunk([1, 2, 3, 4, 5, 6, 7, 8, 9], 3)) // [[1, 2, 3], [4, 5, 6], [7, 8, 9]]
console.log(listChunk([1, 2, 3, 4, 5, 6, 7, 8, 9], 0)) // []
console.log(listChunk([1, 2, 3, 4, 5, 6, 7, 8, 9], -1)) // []

字符串前面空格去除与替换

const trimStart = str => str.replace(new RegExp('^([\\s]*)(.*)$'), '$2')
console.log(trimStart(' abc ')) // abc  
console.log(trimStart('123 ')) // 123

字符串后面空格去除与替换

const trimEnd = str => str.replace(new RegExp('^(.*?)([\\s]*)$'), '$1')
console.log(trimEnd(' abc ')) //   abc  
console.log(trimEnd('123 ')) // 123

获取当前子元素是其父元素下子元素的排位

const getIndex = el => {
    if (!el) {
        return -1
    }
    let index = 0
    do {
        index++
    } while (el = el.previousElementSibling);
    return index
}

获取当前元素相对于document的偏移量

const getOffset = el => {
    const {
        top,
        left
    } = el.getBoundingClientRect()
    const {
        scrollTop,
        scrollLeft
    } = document.body
    return {
        top: top + scrollTop,
        left: left + scrollLeft
    }
}

获取元素类型

const dataType = obj => Object.prototype.toString.call(obj).replace(/^\[object (.+)\]$/, '$1').toLowerCase();

判断是否是移动端

const isMobile = () => 'ontouchstart' in window

fade动画

const fade = (el, type = 'in') {
  el.style.opacity = (type === 'in' ? 0 : 1)
  let last = +new Date()
  const tick = () => {
    const opacityValue = (type === 'in' 
      ? (new Date() - last) / 400
      : -(new Date() - last) / 400)
      el.style.opacity = +el.style.opacity + opacityValue
      last = +new Date()
      if (type === 'in'
        ? (+el.style.opacity < 1)
        : (+el.style.opacity > 0)) {
        requestAnimationFrame(tick)
      }
    }
  tick()
}

将指定格式的字符串解析为日期字符串

const dataPattern = (str, format = '-') => {
  if (!str) {
    return new Date()
  }
  const dateReg = new RegExp(`^(\\d{2})${format}(\\d{2})${format}(\\d{4})$`)
  const [, month, day, year] = dateReg.exec(str)
  return new Date(`${month}, ${day} ${year}`)
}

console.log(dataPattern('12-25-1995')) // Mon Dec 25 1995 00:00:00 GMT+0800 (中国标准时间)

禁止网页复制粘贴

const html = document.querySelector('html') html.oncopy = () => false html.onpaste = () => false

input框限制只能输入中文

const input = document.querySelector('input[type="text"]')
const clearText = target => {
    const {
        value
    } = target
    target.value = value.replace(/[^\u4e00-\u9fa5]/g, '')
}
input.onfocus = ({target}) => {
    clearText(target)
}
input.onkeyup = ({target}) => {
    clearText(target)
}
input.onblur = ({target}) => {
    clearText(target)
}
input.oninput = ({target}) => {
    clearText(target)
}

去除字符串的html代码

const removehtml = (str = '') => str.replace(/<[\/\!]*[^<>]*>/ig, '')
console.log(removehtml('<h1>哈哈哈哈<呵呵呵</h1>')) // 哈哈哈哈<呵呵呵

将RGB模式下的颜色转换为十六进制

const RGBToHex = (r, g, b) => ((r << 16) + (g << 8) + b).toString(16).padStart(6, '0');
let hex = RGBToHex(255, 255, 255); // ffffff

获取数组交集

const intersection = (list, ...args) => list.filter(item => args.every(list => list.includes(item)))

console.log(intersection([2, 1], [2, 3])) // [2]
console.log(intersection([1, 2], [3, 4])) // []

类型强制转换

string 强制转换为数字

常用 *、+ 将 字符串转为数字

'32' * 1          // 32
'ds' * 1          // NaN
null * 1          // 0
undefined * 1     // NaN
+ '123'           // 123
+ 'ds'            // NaN
+ ''              // 0
+ null            // 0
+ undefined       // NaN

使用 Boolean 过滤数组中的所有假值

const compact = arr => arr.filter(Boolean)
compact([0, 1, false, 2, '', 3, 'a', 'e' * 23, NaN, 's', 34])             // [ 1, 2, 3, 'a', 's', 34 ]

取整

num | 0

1.3 | 0         // 1
-1.9 | 0        // -1

判断奇偶

&、%

!!(1 % 2)    // true  奇
!!(5 % 2)    // true  奇
!!(2 % 2)    // false 偶
!!(0 % 2)    // false 偶

!!(1 & 1)    // true  奇
!!(5 % 1)    // true  奇
!!(2 % 1)    // false 偶
!!(0 % 1)    // false 偶

函数

函数默认值

func = (l, m = 3, n = 4 ) => (l * m * n);
func(2)             //output: 24

强制参数

mandatory = ( ) => {
  throw new Error('Missing parameter!');
}
foo = (bar = mandatory( )) => {     // 这里如果不传入参数，就会执行manadatory函数报出错误
  return bar;
}

隐式返回值

function calcCircumference(diameter) {
  return Math.PI * diameter
}
// 简写为：
calcCircumference = diameter => (
  Math.PI * diameter;
)

一次性函数

var sca = function() {
    console.log('msg')
    sca = function() {
        console.log('foo')
    }
}
sca()        // msg
sca()        // foo
sca()        // foo

通过图片 url 获取文件大小

• 通过Ajax请求获取
• 通过Performance API

最好的方式就是，只对专门放置资源文件的服务器设置该响应头，或者在主服务器中，针对资源文件的请求加入该响应头，就可以避免这种漏洞了。

字符串

字符串比较时间先后

var a = "2014-08-08";
var b = "2014-09-09";

console.log(a>b, a<b); // false true
console.log("21:00"<"09:10");  // false
console.log("21:00"<"9:10");   // true   时间形式注意补0

在字符串中查找给定的单词，并替换为另一个单词

const findAndReplace = (string, wordToFind, wordToReplace) => string.split(wordToFind).join(wordToReplace);
let result = findAndReplace('I like banana', 'banana', 'apple'); // I like apple

数字

精确到指定位数的小数

const round = (n, decimals = 0) => Number(`${Math.round(`${n}e${decimals}`)}e-${decimals}`)
round(1.345, 2)                 // 1.35
round(1.345, 1)                 // 1.3

数字补0操作

const addZero1 = (num, len = 2) => (`0${num}`).slice(-len)
const addZero2 = (num, len = 2) => (`${num}`).padStart( len   , '0')
addZero1(3) // 03

addZero2(32,4)  // 0032

数组

reduce方法同时实现map和filter

const numbers = [10, 20, 30, 40];
const doubledOver50 = numbers.reduce((finalList, num) => {
  num = num * 2;
  if (num > 50) {
    finalList.push(num);
  }
  return finalList;
}, []);
doubledOver50;            // [60, 80]

统计数组中相同项的个数

var cars = ['BMW','Benz', 'Benz', 'Tesla', 'BMW', 'Toyota'];
var carsObj = cars.reduce(function (obj, name) {
  obj[name] = obj[name] ? ++obj[name] : 1;
  return obj;
}, {});
carsObj; // => { BMW: 2, Benz: 2, Tesla: 1, Toyota: 1 }

使用解构来交换参数数值

let param1 = 1;
let param2 = 2;
[param1, param2] = [param2, param1];
console.log(param1) // 2
console.log(param2) // 1

// 交换值
var temp = a; a = b; b = temp
b = [a, a = b][0]
a = a + b; b = a - b; a = a - b

接收函数返回的多个结果

async function getFullPost(){
  return await Promise.all([
    fetch('/post'),
    fetch('/comments')
  ]);
}
const [post, comments] = getFullPost();

将数组平铺到指定深度

const flatten = (arr, depth = 1) =>
  depth != 1
    ? arr.reduce((a, v) => a.concat(Array.isArray(v) ? flatten(v, depth - 1) : v), [])
    : arr.reduce((a, v) => a.concat(v), []);
flatten([1, [2], 3, 4]);                             // [1, 2, 3, 4]
flatten([1, [2, [3, [4, 5], 6], 7], 8], 2);           // [1, 2, 3, [4, 5], 6, 7, 8]

数组的对象解构

const csvFileLine = '1997,John Doe,US,john@doe.com,New York';
const { 2: country, 4: state } = csvFileLine.split(',');

country            // US
state            // New Yourk

获取数组中的最大数字

const maxItemOfArray = (arr) => arr.sort((a, b) => b - a)[0];
let maxItem = maxItemOfArray([3, 5, 12, 5]);

检查数组的所有项是否相等

const areAllEqual = array => array.every(item => item === array[0]);
let check1 = areAllEqual([3, 5, 2]); // false
let check2 = areAllEqual([3, 3, 3]); // true

求给定数字的平均值

const averageOf = (...numbers) => numbers.reduce((a, b) => a + b, 0) / numbers.length;
let average = averageOf(5, 2, 4, 7);

反转一个字符串

const reverseString = str => [...str].reverse().join('');
let a = reverseString('Have a nice day!'); // !yad ecin a evaH

求给定数字的和

const sumOf = (...numbers) => numbers.reduce((a, b) => a + b, 0);
let sum = sumOf(5, -3, 2, 1); // 5

对象

使用解构删除不必要属性

let {_internal, tooBig, ...cleanObject} = {el1: '1', _internal:"secret", tooBig:{}, el2: '2', el3: '3'};
console.log(cleanObject);                         // {el1: '1', el2: '2', el3: '3'}

正则校验

金额

export const isMoney  = (s) => {
  return /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/.test(s)
}

邮箱

export const isEmail = (s) => {
    return /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(s)
}

手机号码

export const isMobile = (s) => {
    return /^1[0-9]{10}$/.test(s)
}

export const isMobile = (s) => {
    return /^1(3|4|5|6|7|8|9)\d{9}$/.test(s)
}

电话号码

export const isPhone = (s) => {
    return /^([0-9]{3,4}-)?[0-9]{7,8}$/.test(s)
}

是否url地址

export const isURL = (s) => {
    return /^http[s]?:\/\/.*/.test(s)
}

判断类型

是否字符串

export const isString = (o) => {
    return Object.prototype.toString.call(o).slice(8, -1) === 'String'
}

是否数组

export const isArray = (o) => {
    return Object.prototype.toString.call(o).slice(8, -1) === 'Array'
}

Array.isArray([1, 2, 3]);  

是否数字

export const isNumber = (o) => {
    return Object.prototype.toString.call(o).slice(8, -1) === 'Number'
}

是否boolean

export const isBoolean = (o) => {
    return Object.prototype.toString.call(o).slice(8, -1) === 'Boolean'
}

是否函数

export const isFunction = (o) => {
    return Object.prototype.toString.call(o).slice(8, -1) === 'Function'
}

是否为null

export const isNull = (o) => {
    return Object.prototype.toString.call(o).slice(8, -1) === 'Null'
}

取消双击后的文本选中

document.addEventListener('mousedown', (event) => {
  if (event.detail > 1) {
    event.preventDefault();
    // ...
  }
}, false);

去除字符串内的文件扩展名

fileName.replace(/\.[^/.]+$/, "");

Node 获取文件名

const path = require('path');
const filename = 'foo.txt';
path.parse(filename).name;

防止鼠标选中事件

<div class="mask" onselectstart="return false"></div>
<div class="link">
  <a href="javascrip;;">登录</a>
</div>

给元素添加了onslectstart=”return false”,就可以防止鼠标选中事件。

给动态添加的元素绑定事件

$(document).on("click", ".large", slide); //jq中的写法
//第一个参数表示的是对应事件，第二个是需要绑定事件的元素的id或class，第三个是绑定的对应的事件函数名

常用的全屏居中 JS 函数

//获取元素
function getElement(ele) {
  return document.getElementById(ele);
}
//自动居中函数
function autoCenter(el) {
  var bodyX = document.documentElement.offsetWidth || document.body.offsetWidth;
  var bodyY =
    document.documentElement.offsetHeight || document.body.offsetHeight;

  var elementX = el.offsetWidth;
  var elementY = el.offsetHeight;

  el.style.left = (bodyX - elementX) / 2 + "px";
  el.style.top = (bodyY - elementY) / 2 + "px";
}

在输入框输入完内容并按回车的时候进行判断

<input type="textbox" id="textbox1" onkeypress="CheckInfo" />
<script language="javascript" type="text/javascript">
  function CheckInfo (){
  if (event.keyCode==13) {
      alert(textbox1.text);
    }
  }
</script>

Video

var elevideo = document.getElementById("video");
elevideo.addEventListener(‘loadedmetadata‘, function () { //加载数据
  //视频的总长度  
  console.log(elevideo.duration);
});

elevideo.addEventListener(‘play‘, function () { //播放开始执行的函数
  console.log("开始播放");
});

elevideo.addEventListener(‘playing‘, function () { //播放中
  console.log("播放中");
});

elevideo.addEventListener(‘waiting‘, function () { //加载
  console.log("加载中");
});

elevideo.addEventListener(‘pause‘, function () { //暂停开始执行的函数
  console.log("暂停播放");
});

elevideo.addEventListener(‘ended‘, function () { //结束
  console.log("播放结束");
}, false);

将二进制流转为Blob转成文件 var blob = new Blob()

---

以上是我对下列视频及文章的归纳和总结。
10个非常实用的JS工具函数√
JS实现浏览器：加入收藏、设为首页、保存到桌面的方法功能√
【开发小技巧】022—如何通过JS方式实现隐藏手机号码中间4位数 √
JS 中可以提升幸福度的小技巧√
15条高效的JS技巧，你千万要收藏好了√
面试问题之——给你图片的url，你能知道它所占的字节空间吗？ √
12 个实用的前端开发技巧总结 √
JS判断视频Video的播放、暂停、结束完成及获取长度事件监听处理√

JS生成随机的由字母数字组合的字符串√

Html中换行符\n的传输、保存、显示？√

字符串转对象的三种方式√

js获取当天零点时间_yujin0213的博客-CSDN博客_js获取今天0点时间√

时间格式转换/时间戳的转换√

工作中常用js的整理
12种JS常用获取时间的方式
41个最新的JavaScript开发技巧，你必须要知道
15条值得收藏的高效JS技巧
15条JS技巧
JavaScript中的reduce()的5个用例
解锁各种js数组骚操作，总有你想要的！
7个处理JavaScript值为undefined的技巧
我和大佬之间差一个 JS 工具函数大全
前端常用 60 余种工具方法
完美版 js 金钱正则表达式校验
[译] JavaScript 技巧 —— 子代构造函数，文本选择，内联 Workers 等等
18个有用的JavaScript片段
前后端导出/下载excel方法
24个解决实际问题的ES6代码段

HTML5 file对象和blob对象的互相转换 - 简书 (jianshu.com)