XJQ124 / Some-notes

本仓库记录一些电脑方面的小技巧,包含各个方面
0 stars 0 forks source link

学习Lodash的第三天(Day:15) #19

Open XJQ124 opened 10 months ago

XJQ124 commented 10 months ago

Lodash这部分函数太多了,今天还剩最后4个部分


1、今日内容部分展示,剩下的周末解决掉

//11.24日内容

  //21、_.throttle(func, [wait=0], [options=])
  //创建一个节流函数,用于限制某个函数在一定时间间隔内的执行频率。
  // 避免在滚动时过分的更新定位
  jQuery(window).on('scroll', _.throttle(updatePosition, 100));

  // 点击后就调用 `renewToken`,但5分钟内超过1次。
  var throttled = _.throttle(renewToken, 300000, { 'trailing': false });
  jQuery(element).on('click', throttled);

  // 取消一个 trailing 的节流调用。
  jQuery(window).on('popstate', throttled.cancel);

  //22、_.unary(func)
  //创建一个最多接受一个参数的函数,忽略多余的参数
  _.map(['6', '8', '10'], _.unary(parseInt));
  // => [6, 8, 10]

  //23、_.wrap(value, [wrapper=identity])
  //创建一个函数。提供的 value 包装在 wrapper 函数的第一个参数里。 任何附加的参数都提供给 wrapper 函数。 被调用时 this 绑定在创建的函数上。
  var p = _.wrap(_.escape, function (func, text) {
    return '<p>' + func(text) + '</p>';
  });

  p('fred, barney, & pebbles');
  // => '<p>fred, barney, & pebbles</p>'

  //语言函数部分
  //1、_.castArray(value)
  //强制转换为数组
  _.castArray(1);
  // => [1]

  _.castArray({ 'a': 1 });
  // => [{ 'a': 1 }]

  _.castArray('abc');
  // => ['abc']

  _.castArray(null);
  // => [null]

  _.castArray(undefined);
  // => [undefined]

  _.castArray();
  // => []

  var array = [1, 2, 3];
  console.log(_.castArray(array) === array);
  // => true

  //2、_.clone(value)
  //浅拷贝
  var objects = [{ 'a': 1 }, { 'b': 2 }];

  var shallow = _.clone(objects);
  console.log(shallow[0] === objects[0]);
  // => true

  //3、_.cloneDeep(value)
  //深拷贝
  var objects = [{ 'a': 1 }, { 'b': 2 }];

  var deep = _.cloneDeep(objects);
  console.log(deep[0] === objects[0]);
  // => false

  //4、_.cloneDeepWith(value, [customizer])
  //这个方法类似_.clone,除了它接受一个 customizer 定制返回的克隆值。 如果 customizer 返回 undefined 将会使用拷贝方法代替处理。 customizer 调用4个参数: (value[, index | key, object, stack])。
  function customizer(value) {
    if (_.isElement(value)) {
      return value.cloneNode(false);
    }
  }

  var el = _.cloneWith(document.body, customizer);

  console.log(el === document.body);
  // => false
  console.log(el.nodeName);
  // => 'BODY'
  console.log(el.childNodes.length);
  // => 0

  //5、_.conformsTo(object, source)
  //通过调用断言source的属性与 object 的相应属性值,检查 object是否符合 source。当source偏应用时,这种方法和_.conforms函数是等价的。
  var object = { 'a': 1, 'b': 2 };

  _.conformsTo(object, { 'b': function (n) { return n > 1; } });
  // => true

  _.conformsTo(object, { 'b': function (n) { return n > 2; } });
  // => false

  //6、_.eq(value, other)
  //比较是否相等。返回true或false
  var object = { 'a': 1 };
  var other = { 'a': 1 };

  _.eq(object, object);
  // => true

  _.eq(object, other);
  // => false

  _.eq('a', 'a');
  // => true

  _.eq('a', Object('a'));
  // => false

  _.eq(NaN, NaN);
  // => true

  //7、_.gt(value, other)
  //检查 value是否大于 other。
  _.gt(3, 1);
  // => true

  _.gt(3, 3);
  // => false

  _.gt(1, 3);
  // => false

  //8、_.gte(value, other)
  //检查 value是否大于或者等于 other。同样返回布尔值

  //9、_.isArguments(value)
  //检查 value 是否是一个类 arguments 对象。
  _.isArguments(function () { return arguments; }());
  // => true

  _.isArguments([1, 2, 3]);
  // => false

  //10、_.isArray(value)
  //检查 value 是否是 Array 类对象。
  _.isArray([1, 2, 3]);
  // => true

  _.isArray(document.body.children);
  // => false

  _.isArray('abc');
  // => false

  _.isArray(_.noop);
  // => false

  //11、_.isArrayBuffer(value)
  //检查 value 是否是 ArrayBuffer 对象。
  _.isArrayBuffer(new ArrayBuffer(2));
  // => true

  _.isArrayBuffer(new Array(2));
  // => false

  //13、_.isArrayLike(value)
  //检查 value 是否是类数组。 如果一个值被认为是类数组,那么它不是一个函数,并且value.length是个整数,大于等于 0,小于或等于 Number.MAX_SAFE_INTEGER。
  _.isArrayLike([1, 2, 3]);
  // => true

  _.isArrayLike(document.body.children);
  // => true

  _.isArrayLike('abc');
  // => true

  _.isArrayLike(_.noop);
  // => false

  //14、_.isArrayLikeObject(value)
  //检查value是否为对象
  _.isArrayLikeObject([1, 2, 3]);
  // => true

  _.isArrayLikeObject(document.body.children);
  // => true

  _.isArrayLikeObject('abc');
  // => false

  _.isArrayLikeObject(_.noop);
  // => false

  //15、_.isBoolean(value)
  //检查是否为布尔值

  //16、_.isBuffer(value)
  //检查 value 是否是个 buffer。
  _.isBuffer(new Buffer(2));
  // => true

  _.isBuffer(new Uint8Array(2));
  // => false

  //17、_.isDate(value)
  //检查 value 是否是 Date 对象。
  _.isDate(new Date);
  // => true

  _.isDate('Mon April 23 2012');
  // => false

  //18、_.isElement(value)
  //检查 value 是否是可能是 DOM 元素。
  _.isElement(document.body);
  // => true

  _.isElement('<body>');
  // => false

  //19、_.isEmpty(value)
  //检查 value 是否为一个空对象,集合,映射或者set。 判断的依据是除非是有枚举属性的对象,length 大于 0 的 arguments object, array, string 或类jquery选择器。
  _.isEmpty(null);
  // => true

  _.isEmpty(true);
  // => true

  _.isEmpty(1);
  // => true

  _.isEmpty([1, 2, 3]);
  // => false

  _.isEmpty({ 'a': 1 });
  // => false

  //20、_.isEqual(value, other)
  //执行深比较来确定两者的值是否相等。适合大多数情况
  var object = { 'a': 1 };
  var other = { 'a': 1 };

  _.isEqual(object, other);
  // => true

  object === other;
  // => false

  //21、_.isEqualWith(value, other, [customizer])
  //和上面方法类似,多了一个函数来比较定制值

这里内容太多了,我就不全部贴出来了

2、学习js基础语法

五点开始学习js基础的语法,还是有不少的收获,这部分我争取在下周二之前利用零碎时间结束掉。