lodash-实用库及常用方法

在项目开发中,用的比较多的是lodash的JavaScript实用库

lodash是一个强大的JavaScript库,提供了许多实用方法,可以处理数组、对象和字符串等数据类型。它具有模块化、性能高效、稳定可靠、灵活易用等特点。

以下是lodash库中比较常用的方法:

  1. chunk():将数组(array)拆分成多个指定长度的区块,并将这些区块组成一个新数组。例如:

    let array = [1, 2, 3, 4, 5, 6];
    let chunked = _.chunk(array, 2); 
    // [[1, 2], [3, 4], [5, 6]]
    
  2. debounce():在执行回调函数之前,延迟执行该函数。常用于处理重复的实时事件,防止回调函数的频繁触发。

    function savePreferences() {  
        // code to save preferences
    }
    let save = _.debounce(savePreferences, 1000);
    // Set the preference and debounced function is called after 1 second with the preference value.save('my preference');
    
  3. isObject():判断某个值是否为对象。

    let isObject = _.isObject({}); // true
    let isNotObject = _.isObject('string'); // false
    
  4. isNaN():判断某个值是否为NaN。

    isNaN函数用于检查一个值是否为“非数字”值。这意味着它可以用来检测一个值是否是NaN(Not a Number),或者是一个可以被解释为有效数字的其他非数字值。

    const _ = require('lodash');
    
    console.log(_.isNaN(NaN));               // 输出: true
    console.log(_.isNaN(0));                  // 输出: false
    console.log(_.isNaN(''));                 // 输出: false
    console.log(_.isNaN('123'));               // 输出: false
    console.log(_.isNaN([1, 2, 3]));           // 输出: false
    console.log(_.isNaN({ a: 1, b: 2 }));      // 输出: false
    console.log(_.isNaN(null));               // 输出: false
    console.log(_.isNaN(undefined));          // 输出: false
    
  5. isUndefined():判断某个值是否为undefined。

    const _ = require('lodash');
    
    let value1, value2, value3;
    
    console.log(_.isUndefined(value1));  *// 输出: true*
    console.log(_.isUndefined(value2));  *// 输出: false*
    console.log(_.isUndefined(value3));  *// 输出: true*
    
  6. map():创建一个新数组,数组中的元素是通过调用提供的函数在原始数组上产生的结果。

    let array = [1, 2, 3];
    let doubled = _.map(array, function(num) { return num * 2; }); 
    // [2, 4, 6]
    
  7. get():获取对象指定属性的值。

    它允许你通过指定的路径获取对象的属性。如果路径不存在,则返回undefined

    const _ = require('lodash');
    
    let object = {
      a: {
        b: {
          c: 3
        }
      }
    };
    
    console.log(_.get(object, 'a.b.c')); // 输出 3
    console.log(_.get(object, 'a.b.d')); // 输出 undefined
    console.log(_.get(object, 'a.e')); // 输出 undefined
    
  8. set():设置对象指定属性的值。

    set函数是用于在对象中设置指定路径的属性值。如果路径不存在,则会自动创建。

    const _ = require('lodash');
    
    let object = {
      a: {
        b: {
          c: 3
        }
      }
    };
    
    _.set(object, 'a.b.c', 4); // 设置路径'a.b.c'的属性值为4
    console.log(object); // 输出 { a: { b: { c: 4 } } }
    
    _.set(object, 'a.b.d', 5); // 设置路径'a.b.d'的属性值为5,如果不存在会创建路径
    console.log(object); // 输出 { a: { b: { c: 4, d: 5 } } }
    
  9. isEqual():深度比较两个对象是否相等。

    isEqual函数用于比较两个对象或值是否相等。它使用严格比较(deep comparison)来检查对象和数组中的值,并且会处理循环引用。

    const _ = require('lodash');
    
    let object1 = { a: 1, b: { c: 2 } };
    let object2 = { a: 1, b: { c: 2 } };
    let object3 = { a: 1, b: { c: 3 } };
    
    console.log(_.isEqual(object1, object2));  // 输出: true
    console.log(_.isEqual(object1, object3));  // 输出: false
    
  10. isEmpty():判断一个对象是否为空。

    isEmpty函数用于检查一个对象(数组、字符串、对象等)是否为空。

    const _ = require('lodash');
    
    let array1 = [];
    let array2 = [1, 2, 3];
    let object1 = {};
    let object2 = { a: 1, b: 2 };
    let string1 = '';
    let string2 = 'abc';
    
    console.log(_.isEmpty(array1));      // 输出: true
    console.log(_.isEmpty(array2));      // 输出: false
    console.log(_.isEmpty(object1));     // 输出: true
    console.log(_.isEmpty(object2));     // 输出: false
    console.log(_.isEmpty(string1));     // 输出: true
    console.log(_.isEmpty(string2));     // 输出: false
    
  1. sortBy(): 方法可以按照指定的条件对数组进行排序。

    let people = [ 
        { 'name': 'John', 'age': 30 }, 
        { 'name': 'Jane', 'age': 25 }, 
        { 'name': 'Mike', 'age': 35 }
    ];
    let sortedPeople = _.sortBy(people, ['age', 'name']);
    console.log(sortedPeople);
    // [{ name: 'Jane', age: 25 }, { name: 'John', age: 30 }, { name: 'Mike', age: 35 }]
    

    在上面的例子中,我们首先定义了一个people数组,然后使用sortBy方法按照agename进行排序。sortBy方法接受两个参数,第一个参数是需要排序的数组,第二个参数是一个字符串或数组,用于指定排序的条件。如果第二个参数是字符串,则按照该字符串代表的属性进行排序;如果第二个参数是数组,则先按照第一个元素指定的属性进行排序,然后按照第二个元素指定的属性进行排序。

    需要注意的是,sortBy方法默认按照升序排序,如果需要按照降序排序,可以传入第三个参数为true

  2. union()函数用于合并多个数组,并去除重复项

    // 导入lodash库
    const _ = require('lodash');
    
    // 创建数组
    const array1 = [1, 2, 3];
    const array2 = [3, 4, 5];
    const array3 = [5, 6, 7];
    
    // 使用union函数合并数组并去除重复项
    const result = _.union(array1, array2, array3);
    
    // 输出结果
    console.log(result); // [1, 2, 3, 4, 5, 6, 7]
    
  3. intersection()函数用于获取数组的交集

    // 导入lodash库
    const _ = require('lodash');
    
    // 创建数组
    const array1 = [1, 2, 3];
    const array2 = [3, 4, 5];
    const array3 = [5, 6, 7];
    
    // 使用intersection函数获取数组的交集
    const result = _.intersection(array1, array2, array3);
    
    // 输出结果
    console.log(result); // [3]
    
  4. difference()函数用于从第一个数组中移除所有在其他数组中的元素

    // 导入lodash库
    const _ = require('lodash');
    
    // 创建数组
    const array1 = [1, 2, 3, 4, 5];
    const array2 = [3, 4];
    const array3 = [4, 5];
    
    // 使用difference函数从array1中移除所有在array2和array3中的元素
    const result = _.difference(array1, array2, array3);
    
    // 输出结果
    console.log(result); // [1]
    
  5. pluck()从对象中获取给定键的值

    const people = [{'name': 'Bob', 'age': 36}, {'name': 'Alice', 'age': 30}];
    const names = _.pluck(people, 'name'); // ['Bob', 'Alice']
    
  6. invoke()这个函数用于调用对象中的方法。这对于处理包含方法的对象非常有用。

    const person = {
      name: 'John',
      age: 30,
      greet: function() {
        console.log('Hello!');
      }
    };
    _.invoke(person, 'greet'); // "Hello!"
    
  7. assign()这个函数用于将对象的属性复制到另一个对象。这是一个非常有用的函数,用于合并对象。

    const obj1 = { a: 1 };
    const obj2 = { b: 2 };
    const merged = _.assign({}, obj1, obj2); // { a: 1, b: 2 }
    
  8. cloneDeep()这个函数用于深度克隆一个对象。这对于处理复杂对象和避免引用问题非常有用

    const obj = { a: 1, b: { c: 2 } };
    const cloned = _.cloneDeep(obj); // { a: 1, b: { c: 2 } }
    

以上仅是 Lodash 的一些常用库和函数示例,还有很多其他的实用工具和函数可以帮助开发人员解决各种编程问题。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,456评论 5 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,370评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,337评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,583评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,596评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,572评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,936评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,595评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,850评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,601评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,685评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,371评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,951评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,934评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,167评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 43,636评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,411评论 2 342

推荐阅读更多精彩内容