我在孩子王的第二次分享

我在公司的第二次分享。分享前端一些基础知识；分享 node + express 做接口封装；分享 vue + typeScript 的实践。

浏览器兼容性

[
  "> 1%",
  "last 3 versions",
  "ie >= 9",
  "ios >= 8",
  "android >= 4.4"
]

防抖和节流

防抖和节流

防抖 debounce

lodash.debounce

const debounce = function(func, wait, immediate) {
  // immediate 默认为 false
  var timeout, args, context, timestamp, result;

  var later = function () {
    // 当 wait 指定的时间间隔期间多次调用 debounce 返回的函数，则会不断更新 timestamp 的值，导致 last < wait && last >= 0 一直为 true，从而不断启动新的计时器延时执行 func
    var last = +new Date() - timestamp;

    if (last < wait && last >= 0) {
      timeout = setTimeout(later, wait - last);
    } else {
      timeout = null;
      if (!immediate) {
        result = func.apply(context, args);
        if (!timeout) context = args = null;
      }
    }
  };

  return function() {
    context = this;
    args = arguments;
    timestamp = +new Date();
    // 第一次调用该方法时，且immediate为true，则调用func函数
    var callNow = immediate && !timeout;
    // 在wait指定的时间间隔内首次调用该方法，则启动计时器定时调用func函数
    if (!timeout) timeout = setTimeout(later, wait);
    if (callNow) {
      result = func.apply(context, args);
      context = args = null;
    }

    return result;
  };
}

节流 throttle

H5网页基础