lodashjs中的常用方法

官方地址:https://www.lodashjs.com/

优点

  • 参数可以为空
  • 功能更加强大
  • 兼容性更好

_.map

_.map([1, 2, 3], o => o * 2); // [2,4,6]
const list = [ { name: '孙悟空', age: 3000 }, { name: '猪八戒', age: 5000 } ];
// 提取字段
_.map(list, 'name'); // [ '孙悟空', '猪八戒' ]
// 等价于
_.map(list, o => o.name); // [ '孙悟空', '猪八戒' ]
// 第二个参数为key
_.map(list, (o, k) => ({ ...o, age: o.age + k })); // [ { name: '孙悟空', age: 3000 }, { name: '猪八戒', age: 5001 } ]
// 可以使用对象
const obj = { name: '孙悟空', age: 3000, position: '斗争圣佛' };
_.map(obj, (o, k)=>({ [k]: o })); // { 孙悟空: 'name', 3000: 'age', 斗争圣佛: 'position' }

_.each / _.forEach

_.each([1, 2, 3], (o, k)=>console.log(o, k));
 // 1 0
 // 2 1
 // 3 2

_.get / _.set

const obj = {};
_.set(obj, 'a.0.c.d', 10); // { a: [ { c: { d: 10 } } ] }
_.get(obj, 'a.0'); // { c: { d: 10 } }

_.cloneDeep (深拷贝) / … (浅拷贝)

// ======================= 直接赋值 =============================
let obj = { a: 1, b: { c: 1 } };
let obj1 = obj; // 直接赋值,指向同一个对象
obj1.a = 2;
console.log(obj1); // { a: 2, b: { c: 1 } };
console.log(obj); // { a: 2, b: { c: 1 } };
// ======================== 浅拷贝 ============================
obj = { a: 1, b: { c: 1 } }; // 还原
obj1 = { ...obj }; // 这是浅拷贝,只改变了一层的地址,深层次的还是指向同一个对象
obj1.a = 2;
console.log(obj1); // { a: 2, b: { c: 1 } };
console.log(obj); // { a: 1, b: { c: 1 } };
obj1.b.c = 3;
console.log(obj1); // { a: 2, b: { c: 3 } };
console.log(obj); // { a: 1, b: { c: 3 } };
// ======================== 深拷贝 ============================
obj = { a: 1, b: { c: 1 } }; // 还原
obj1 = _.cloneDeep(obj); // 这是深拷贝,任何一层都是独立的一份
obj1.a = 2;
console.log(obj1); // { a: 2, b: { c: 1 } };
console.log(obj); // { a: 1, b: { c: 1 } };
obj1.b.c = 3;
console.log(obj1); // { a: 2, b: { c: 3 } };
console.log(obj); // { a: 1, b: { c: 1 } };

_.keys / _.values

const obj = { a: 1, b: 2 };
_.keys(obj); // ['a', 'b']
_.values(obj); // [1, 2]

_.mapValues / _.mapKeys

const obj = { a: 1, b: 2 };
_.mapValues(obj, (v, k) => v * 2); // { a: 2, b: 4 }
// _.mapKeys 只是会替换key值,但是参数还是第一个是value,第二个是key
_.mapKeys(obj, (v, k) => v * 2); // { 2: 1, 4: 2 }
_.mapKeys(obj, (v, k) => k + 1); // { a1: 1, b1: 2 }

_.pick / _.omit / _.pickBy / _.omitBy

const obj = { a: 1, b: 2, c: 3, d: 4 };
_.pick(obj, 'a', 'c'); // { a: 1, c: 3 }
_.pick(obj, ['a', 'c']); // { a: 1, c: 3 }
_.omit(obj, 'a', 'c'); // { b: 2, d: 4 }
_.pickBy(obj, v => v > 2); // { c: 3, d: 4 }

_.includes

_.includes([1, 2, 3], 3); // true

_.every / _.some

const list = [ { name: '孙悟空', age: 3000 }, { name: '猪八戒', age: 5000 } ];
_.every(list, o => o.age > 4000); // false (必须每一个成立才返回真)
_.some(list, o => o.age > 4000); // true (只要有一个成立才返回真)

_.filter / _.reject

const list = [ { name: '孙悟空', age: 3000 }, { name: '猪八戒', age: 5000 } ];
_.filter(list, o => o.age > 4000); //  [ { name: '猪八戒', age: 5000 } ]
_.reject(list, o => o.age > 4000); //  [ { name: '孙悟空', age: 3000 } ]

_.find / _.fileLast

const list = [ { name: '孙悟空', age: 3000 }, { name: '猪八戒', age: 5000 } ];
_.find(list, o => o.age > 1000); //  { name: '孙悟空', age: 3000 }
_.fileLast(list, o => o.age > 1000); //  { name: '猪八戒', age: 5000 }

_.orderBy

const list = [ { name: '孙悟空', age: 3000 }, { name: '猪八戒', age: 5000 } ];
_.orderBy(list, 'age', 'asc'); //  [ { name: '孙悟空', age: 3000 }, { name: '猪八戒', age: 5000 } ]
_.orderBy(list, ['age', 'name'], ['desc', 'asc']); //  [ { name: '猪八戒', age: 5000 }, { name: '孙悟空', age: 3000 } ]

_.uniq / _.uniqBy

_.uniq([2, 1, 2]); // [2, 1]
_.uniqBy(list, o => Math.floor(o.age / 10000)); //  [ { name: '孙悟空', age: 3000 } ]

_.difference / _.differenceBy / _.without / _.intersection / _.intersectionBy / _.union / _.unionBy

_.difference([3, 2, 1], [4, 2]); // [3, 1]
_.without([3, 2, 1], 4, 2); // [3, 1]
_.without([3, 2, 1], ...[4, 2]); // [3, 1]
_.differenceBy([{ x: 2 }, { x: 1 }], [{ x: 1 }], 'x'); // [{ x: 2 }]
_.intersection([2, 1], [4, 2], [1, 2]);  // [2]
_.intersectionBy([{ x: 2 }, { x: 1 }], [{ x: 1 }], o => o.x); // [{ x: 1 }]
_.union([2], [1, 2]); // [ 2, 1 ]
_.unionBy([{ x: 2 }, { x: 1 }], [{ x: 1 }], 'x'); // [{ x: 2 }, { x: 1 }]

_.groupBy

const list = [ { name: '孙悟空', age: 3000 }, { name: '猪八戒', age: 5000 } ];
_.groupBy(list, o => Math.floor(o.age/1000)); // true
// {
//   '3': [ { name: '孙悟空', age: 3000 } ],
//   '5': [ { name: '猪八戒', age: 5000 } ]
// }

_.size

_.size([1, 2, 3]); // 3
_.size({ a: 1, b: 1 }); // 2

_.random

_.random(0, 100) // 包含0和100的随机整数
_.random(0, 100, true) // 包含0和100的随机浮点数

_.range

_.range(1, 5) // [ 1, 2, 3, 4 ]  (注意不包含5)
_.range(1, 5, 2) // [ 1, 3 ]   (2是步长)

_.startsWith (字符串)

_.startsWith('abcd', 'a') // true
_.startsWith('abcd', 'b') // false

_.isArray / _.isPlainObject / _.isNumber / _.isString / _.isInteger / _.isDate

_.isArray([1, 2, 3]); // true
_.isPlainObject({ a: 1 }); // true

你可能感兴趣的:(javascript,前端,vue.js)