JavaScript库之Lodash常用方法

Lodash 中文文档https://www.lodashjs.com/docs/lodash.omit/


以下总结了在项目中常用的方法,其他的慢慢更新

语言:

cloneDeep

这个方法类似_.clone,除了它会递归拷贝 value。(注:也叫深拷贝)

参数
  1. value (*): 要深拷贝的值。

返回

(*): 返回拷贝后的值。

例子
var objects = [{ 'a': 1 }, { 'b': 2 }]; var deep = _.cloneDeep(objects);console.log(deep[0] === objects[0]);

isArray

检查 value 是否是 Array 类对象。就是Array.isArray()

添加版本

0.1.0

参数
  1. value (*): 要检查的值。

返回

(boolean): 如果value是一个数组返回 true,否则返回 false。

例子
_.isArray([1, 2, 3]);
// => true
 _.isArray(document.body.children);
// => false 
_.isArray('abc');
// => false 
_.isArray(_.noop);
// => false

_.isObject(value)

检查 value 是否为 Object 的language type(例如: arrays, functions, objects, regexes,new Number(0), 以及 new String(''))

添加版本

0.1.0

参数
  1. value (*): 要检查的值。

返回

(boolean): 如果 value 为一个对象,那么返回 true,否则返回 false。

例子
_.isObject({});
// => true
 _.isObject([1, 2, 3]);
// => true
 _.isObject(_.noop);
// => true
 _.isObject(null);
// => false
function isObject(value) {
  var type = typeof value;
  return value != null && (type == 'object' || type == 'function');
}

_.isPlainObject(value)

检查 value 是否是普通对象。 也就是说该对象由 Object 构造函数创建,或者 [[Prototype]] 为 null 。

添加版本

0.8.0

参数
  1. value (*): 要检查的值。

返回

(boolean): 如果 value 为一个普通对象,那么返回 true,否则返回 false。

例子
function Foo() {  
this.a = 1;
} 
_.isPlainObject(new Foo);
// => false 
_.isPlainObject([1, 2, 3]);
// => false 
_.isPlainObject({ 'x': 0, 'y': 0 });
// => true
 _.isPlainObject(Object.create(null));
// => true

源码:

function isPlainObject(value) {
  if (!isObjectLike(value) || baseGetTag(value) != '[object Object]') {
    return false;
  }
  var proto = getPrototype(value);
  if (proto === null) {
    return true;
  }
  var Ctor = hasOwnProperty.call(proto, 'constructor') && proto.constructor;
  return typeof Ctor == 'function' && Ctor instanceof Ctor &&
    funcToString.call(Ctor) == objectCtorString;
}

_.isElement(value)

检查 value 是否是可能是 DOM 元素。

isObjectLike

添加版本

0.1.0

参数
  1. value (*): 要检查的值。

返回

(boolean): 如果 value 是一个DOM元素,那么返回 true,否则返回 false。

例子
_.isElement(document.body);// => true _.isElement('<body>');// => false

isObjectLike(value) && value.nodeType === 1 && !isPlainObject(value);

满足类对象nodeType=1并且不是一个普通对象

isObjectLike(value) && value.nodeType === 1 && !isPlainObject(value);

_.isEmpty(value)

检查 value 是否为一个空对象,集合,映射或者set。 判断的依据是除非是有枚举属性的对象,length 大于 0 的 arguments object, array, string 或类jquery选择器。

对象如果被认为为空,那么他们没有自己的可枚举属性的对象。

类数组值,比如arguments对象,array,buffer,string或者类jQuery集合的length 为 0,被认为是空。类似的,map(映射)和set 的size 为 0,被认为是空。

添加版本

0.1.0

参数
  1. value (*): 要检查的值。

返回

(boolean): 如果 value 为空,那么返回 true,否则返回 false。

例子
_.isEmpty(null);
// => true 
_.isEmpty(true);
// => true 
_.isEmpty(1);
// => true 
_.isEmpty([1, 2, 3]);
// => false
 _.isEmpty({ 'a': 1 });
// => false
_.isEmpty(0);
// => true

使用场景:判断对象是否为空

源码:

var hasOwnProperty = objectProto.hasOwnProperty;
function isEmpty(value) {
  if (value == null) {
    return true;
  }
  if (isArrayLike(value) &&
      (isArray(value) || typeof value == 'string' || typeof value.splice == 'function' ||
        isBuffer(value) || isTypedArray(value) || isArguments(value))) {
    return !value.length;
  }
  var tag = getTag(value);
  if (tag == mapTag || tag == setTag) {
    return !value.size;
  }
  if (isPrototype(value)) {
    return !baseKeys(value).length;
  }
  for (var key in value) {
    if (hasOwnProperty.call(value, key)) {
      return false;
    }
  }
  return true;
}

_.isEqual(value, other)

执行深比较来确定两者的值是否相等。

**注意: **这个方法支持比较 arrays, array buffers, booleans, date objects, error objects, maps, numbers, Object objects, regexes, sets, strings, symbols, 以及 typed arrays. Object 对象值比较自身的属性,不包括继承的和可枚举的属性。 支持函数和DOM节点比较。

添加版本

0.1.0

参数
  1. value (*): 用来比较的值。

  1. other (*): 另一个用来比较的值。

返回

(boolean): 如果 两个值完全相同,那么返回 true,否则返回 false。

例子
var object = { 'a': 1 };
var other = { 'a': 1 };
 _.isEqual(object, other);
// => true object === other;
// => false

_.isFunction(value)

检查 value 是否是 Function 对象。

添加版本

0.1.0

参数
  1. value (*): 要检查的值

返回

(boolean): 如果 value 是一个函数,那么返回 true,否则返回 false。

例子
_.isFunction(_);
// => true 
_.isFunction(/abc/);
// => false

对象

_.omit(object, [props]) 删除对象上的指定属性,返回一个新的对象

反向版_.pick; 这个方法一个对象,这个对象由忽略属性之外的object自身和继承的可枚举属性组成。(注:可以理解为删除object对象的属性

import { omit } from 'lodash';
var object = { 'a': 1, 'b': '2', 'c': 3 };
const result = omit(object, ['a', 'c']);
console.log(result,object)

打印

=> { 'b': '2' } { 'a': 1, 'b': '2', 'c': 3 }

使用场景:需要移除复杂对象的属性,返回一个新的对象,对原有对象不产生任何影响

_.pick(object, [props])

创建一个从 object 中选中的属性的对象

参数
  1. object (Object): 来源对象。

  1. [props] (...(string|string[])): 要被忽略的属性。(注:单独指定或指定在数组中。)

返回

(Object): 返回新对象。

var object = { 'a': 1, 'b': '2', 'c': 3 };
 
_.pick(object, ['a', 'c']);
// => { 'a': 1, 'c': 3 }

使用场景: 在页面传参较多的时候使用,代码会看起来很简洁

例如:

// 使用前
const saveparams={param1:baseInfo?.param1,...param10:baseInfo?.param10 }
await saveApi(saveparams);
// 使用后
saveApi(pick(baseInfo,['param1',...'param10']))

提醒:若param9在baseInfo中没有这个属性,pick生成的对象也不会有这个属性

数组

_.compact(array)

创建一个新数组,包含原数组中所有的非假值元素。例如false, null,0, "", undefined, 和 NaN 都是被认为是“假值”。

引入版本

0.1.0

参数
  1. array (Array): 待处理的数组

返回值

(Array): 返回过滤掉假值的新数组。

例子
_.compact([0, 1, false, 2, '', 3]);
// => [1, 2, 3]

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值