当前位置：首页 > news >正文

JavaScript库之Lodash常用方法

news 文章来源：https://blog.csdn.net/yalywq/article/details/129020976 2024/11/16 13:30:22

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

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

语言：

cloneDeep

这个方法类似_.clone，除了它会递归拷贝 value。（注：也叫深拷贝）

参数

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

参数

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

参数

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

参数

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

参数

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

参数

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

参数

value (*): 用来比较的值。

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

参数

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 中选中的属性的对象

参数

object (Object): 来源对象。

[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

参数

array (Array): 待处理的数组

返回值

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

例子

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

语言：

cloneDeep

参数

返回

例子

isArray

添加版本

参数

返回

例子

_.isObject(value)

添加版本

参数

返回

例子

_.isPlainObject(value)

添加版本

参数

返回

例子

_.isElement(value)

添加版本

参数

返回

例子

_.isEmpty(value)

添加版本

参数

返回

例子

_.isEqual(value, other)

添加版本

参数

返回

例子

_.isFunction(value)

添加版本

参数

返回

例子

对象

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

_.pick(object, [props])

参数

返回

数组

_.compact(array)

引入版本

参数

返回值

例子

相关文章：