Lodash tutorial

Lodash 教程涵盖了 Lodash JavaScript 库。在本介绍性 Lodash 教程中，我们在多个示例中介绍了 Lodash 函数。

Lodash

Lodash 是一个 JavaScript 库，它为常见的编程任务提供实用函数。它使用函数式编程范式。 Lodash 的灵感来自Underscore.js。

Lodash帮助程序员编写更简洁、更易维护的JavaScript代码。 Lodash 包含用于简化字符串、数字、数组、函数和对象编程的工具。

按照惯例，Lodash 模块映射到下划线字符。

Lodash 安装

首先，我们安装 Lodash 库。

$ npm init -y
$ npm i lodash

Lodash 库使用npm 在本地安装。

Lodash 版本

在第一个示例中，我们确定 Lodash 库的版本。

const _ = require("lodash");

const ver = _.VERSION;
console.log(ver);

该示例打印了 Lodash 库的版本。

const _ = require("lodash");

按照惯例，Lodash 库映射到下划线字符。

const ver = _.VERSION;
console.log(ver);

版本存储在VERSION 变量中。

$ node main.js
4.17.21

我们使用 Lodash 版本 4.17.21。

Lodash 第一个和最后一个数组元素

_.first/_.head函数返回第一个数组元素； _.last 函数返回最后一个数组元素。

const _ = require("lodash");

let words = ['sky', 'wood', 'forest', 'falcon',
    'pear', 'ocean', 'universe'];

let fel = _.first(words);
let lel = _.last(words);

console.log(`First element: ${fel}`);
console.log(`Last element: ${lel}`);

该示例输出单词数组的第一个和最后一个元素。

$ node main.js
First element: sky
Last element: universe

Lodash 第 n 个数组元素

_.nth 函数获取数组索引 n 处的元素。如果 n 为负数，则返回倒数第 n 个元素。

const _ = require("lodash");

let nums = [1, 2, 3, 4, 5, 6, 7, 8];

console.log(_.nth(nums, 3));
console.log(_.nth(nums, -3));

例子中，我们获取了从头到尾的第四个元素。索引从零开始。

$ node main.js
4
6

Lodash 分块数组

_.chunk 函数创建一个元素数组，将元素分成指定大小的组。

const _ = require("lodash");

let nums = [1, 2, 3, 4, 5, 6, 7, 8, 9];

let c1 = _.chunk(nums, 2);
console.log(c1);

let c2 = _.chunk(nums, 3);
console.log(c2);

该示例将 nums 数组分块为两个和三个元素子数组的数组。

$ node main.js
[ [ 1, 2 ], [ 3, 4 ], [ 5, 6 ], [ 7, 8 ], [ 9 ] ]
[ [ 1, 2, 3 ], [ 4, 5, 6 ], [ 7, 8, 9 ] ]

获取数组切片

_.slice 方法从数组中获取切片。它需要两个索引：起始索引和结束索引，其中起始索引是包含的，结束索引是不包含的。

const _ = require("lodash");

let nums = [1, 2, 3, 4, 5, 6, 7, 8, 9];

let c1 = _.slice(nums, 2, 6);
console.log(c1);

let c2 = _.slice(nums, 0, 8);
console.log(c2);

该示例从 nums 数组创建两个切片。

$ node main.js
[ 3, 4, 5, 6 ]
[ 1, 2, 3, 4, 5, 6, 7, 8 ]

Lodash 随机数

_.random 函数生成介于下限和上限之间的随机值。

const _ = require("lodash");

let r = _.random(10);
console.log(r);

r = _.random(5, 10);
console.log(r);

该示例打印两个随机值。

let r = _.random(10);

我们生成 0 到 10 之间的随机值。

r = _.random(5, 10);

这里我们生成一个 5 到 10 之间的随机值。

Lodash 随机数组元素

使用_.sample 函数，我们可以从数组中选择一个随机元素。

const _ = require("lodash");

let words = ['sky', 'wood', 'forest', 'falcon',
    'pear', 'ocean', 'universe'];

let word = _.sample(words);
console.log(word);

该示例使用_.sample 从数组中随机选择一个单词。

$ node main.js
falcon

Lodash 洗牌数组元素

_.shuffle 函数打乱一个集合。

const _ = require("lodash");

let words = ['sky', 'wood', 'forest', 'falcon',
    'pear', 'ocean', 'universe'];

console.log(_.shuffle(words));
console.log(_.shuffle(words));
console.log(_.shuffle(words));
console.log(words);

该示例根据初始单词数组创建了三个随机重组的新数组。

$ node main.js
[ 'sky', 'ocean', 'universe', 'falcon', 'pear', 'wood', 'forest' ]
[ 'wood', 'ocean', 'falcon', 'forest', 'sky', 'universe', 'pear' ]
[ 'forest', 'ocean', 'sky', 'wood', 'falcon', 'universe', 'pear' ]
[ 'sky', 'wood', 'forest', 'falcon', 'pear', 'ocean', 'universe' ]

这是输出。原数组没有修改； _.shuffle 函数创建一个新数组。

Lodash _.times 函数

_.times 执行函数 n 次。

const _ = require("lodash");

_.times(4, () => {

    console.log("brave");
})

在示例中，我们执行了四次内部函数。该函数将单词打印到控制台。

$ node main.js
brave
brave
brave
brave

Lodash _.delay 函数

_.delay 函数将函数的执行延迟指定的毫秒数。

const _ = require("lodash");

function message()
{
    console.log("Some message");
}

_.delay(message, 150);
console.log("Some other message");

该示例输出两条消息。第一个延迟 150 毫秒。

$ node main.js
Some other message
Some message

Lodash 判断数据类型

Lodash 包含确定值的数据类型的函数。

const _ = require("lodash");

let vals = [1, 2, 'good', [1, 2], {name: 'Peter', age: 32}];

vals.forEach( (e) => {

    if (_.isNumber(e)) {
        console.log(`${e} is a number`);
    }

    if (_.isString(e)) {
        console.log(JSON.stringify(e) + ' is a string');
    }

    if (_.isArray(e)) {
        console.log(JSON.stringify(e) + ' is an array');
    }

    if (_.isObject(e)) {
        console.log(JSON.stringify(e) + ' is an object');
    }

});

在示例中，我们确定数组元素的数据类型。

let vals = [1, 2, 'good', [1, 2], {name: 'Peter', age: 32}];

我们有一个值数组，包括数字、字符串、数组和对象。

if (_.isNumber(e)) {
    console.log(`${e} is a number`);
}

_.isNumber 函数检查一个值是否为数字。

if (_.isString(e)) {
    console.log(JSON.stringify(e) + ' is a string');
}

_.isString 函数检查一个值是否为字符串。

if (_.isArray(e)) {
    console.log(JSON.stringify(e) + ' is an array');
}

_.isArray 函数检查一个值是否为数组。

if (_.isObject(e)) {
    console.log(JSON.stringify(e) + ' is an object');
}

_.isObject 函数检查一个值是否是一个对象。

$ node main.js
1 is a number
2 is a number
"good" is a string
[1,2] is an array
[1,2] is an object
{"name":"Peter","age":32} is an object

Lodash _.range 函数

Lodash _.range 函数创建一个数字数组。该函数接受start、end 和step 参数。

const _ = require("lodash");

let vals = _.range(10);
console.log(vals);

let vals2 = _.range(0, 15);
console.log(vals2);

let vals3 = _.range(0, 15, 5);
console.log(vals3);

在代码示例中，我们创建了三个值范围。

let vals = _.range(10);

此行创建一个值数组 0..9。 end 值是必需的，start 和step 是可选的。end 是非包含的；因此，不包括值 10。

let vals2 = _.range(0, 15);

这里我们指定start 和step 参数。我们创建一个值数组0..14。

let vals3 = _.range(0, 15, 5);

最后，我们提供所有三个参数。创建一个包含 0、5 和 10 值的数组。

$ node main.js
[
  0, 1, 2, 3, 4,
  5, 6, 7, 8, 9
]
[
   0,  1,  2, 3,  4,  5,
   6,  7,  8, 9, 10, 11,
  12, 13, 14
]
[ 0, 5, 10 ]

Lodash 最大值和最小值

Lodash 允许计算数组的最大值和最小值。

const _ = require("lodash");

let vals = [-3, 4, 0, 12, 43, 9, -12];

let min = _.min(vals);
console.log(min);

let max = _.max(vals);
console.log(max);

max = _.max(_.range(5, 25));
console.log(max);

let obs = [{n: 12}, {n: -4}, {n: 4}, {n: -11}];

min = _.minBy(obs, 'n');
console.log(min);

max = _.maxBy(obs, 'n');
console.log(max);

该示例计算数组的最小值和最大值。

let min = _.min(vals);
console.log(min);

_.min 函数返回数组的最小值。

let max = _.max(vals);
console.log(max);

._max 函数返回数组的最大值。

min = _.minBy(obs, 'n');
console.log(min);

max = _.maxBy(obs, 'n');
console.log(max);

要计算对象属性的最小值和最大值，我们使用_.minBy 和.maxBy 函数。

$ node main.js
-12
43
24
{ n: -11 }
{ n: 12 }

Lodash _.sum 函数

_.sum 函数计算数组值的总和。

const _ = require("lodash");

let vals = [-2, 0, 3, 7, -5, 1, 2];

let sum = _.sum(vals);
console.log(sum);

在代码示例中，我们计算并打印数组值的总和。

$ node main.js
6

Lodash _.curry

柯里化是将具有多个参数的函数转换为具有单个参数的嵌套函数序列。柯里化允许执行函数专业化和组合。在 JavaScript 柯里化教程中了解有关柯里化的更多信息。

_.curry 函数将普通函数转换为柯里化函数。

const _ = require("lodash");

function multiply(a, b, c) {

    return a * b * c;
}

let curried = _.curry(multiply);

let ret = curried(2)(3)(4);
console.log(ret);

在示例中，我们将 multiply 函数转换为柯里化版本。

$ node main.js
24

Lodash 收集过滤器

_.filter 函数返回谓词函数返回 true 的元素数组。

const _ = require("lodash");

let nums = [4, -5, 3, 2, -1, 7, -6, 8, 9];

let pos_nums = _.filter(nums, (e) => e > 0);
console.log(pos_nums);

在代码示例中，我们过滤掉数组的正值。

let pos_nums = _.filter(nums, (e) => e > 0);

谓词是一个返回布尔值的函数。在我们的例子中，我们有一个匿名函数，它为大于 0 的值返回 true。

$ node main.js
[ 4, 3, 2, 7, 8, 9 ]

Lodash 集合查找

_.find 函数迭代集合的元素并返回谓词返回 true 的第一个元素。同样，_.findLast 返回最后一个元素。

const _ = require("lodash");

let users = [
  { name: 'John', age: 25 },
  { name: 'Lenny', age: 51 },
  { name: 'Andrew', age: 43 },
  { name: 'Peter', age: 81 },
  { name: 'Anna', age: 43 },
  { name: 'Albert', age: 76 },
  { name: 'Adam', age: 47 },
  { name: 'Robert', age: 72 }
];

let u1 = _.find(users, {name: 'Adam'});
console.log(u1);

let u2 = _.find(users, (u) => { return u.age > 60 });
console.log(u2);

let u3 = _.findLast(users, (u) => { return u.age > 60 });
console.log(u3);

在示例中，我们找到名为 Adam 的用户。然后我们找到第一个和最后一个超过 60 岁的用户。

$ node main.js
{ name: 'Adam', age: 47 }
{ name: 'Peter', age: 81 }
{ name: 'Robert', age: 72 }

Lodash 集合拉动

_.pull 函数从数组中删除所有给定的值。

const _ = require("lodash");

let nums = [1, 2, 3, 1, 2, 2, 4, 5, 7, 8];

_.pull(nums, 1, 2);
console.log(nums);

在示例中，我们有一个数字数组。我们从数组中删除所有数字 1 和 2。

$ node main.js
[ 3, 4, 5, 7, 8 ]

Lodash 集合拿

_.take 函数创建一个数组的切片，其中 n 个元素从头开始。 _.takeRight 函数创建一个数组的切片，其中 n 个元素从末尾开始。

const _ = require("lodash");

let nums = [1, 2, 3, 4, 5, 6];

let nums2 = _.take(nums);
let nums3 = _.take(nums, 2);
let nums4 = _.takeRight(nums, 3)

console.log(nums2);
console.log(nums3);
console.log(nums4);

函数从整数数组中获取一些值并创建新数组。第二个可选参数指定要获取的值的数量。

$ node main.js
[ 1 ]
[ 1, 2 ]
[ 4, 5, 6 ]

Lodash 集合 takeWhile

_.takeWhile 函数创建一个数组的切片，其中的元素从头开始获取。取元素直到给定的谓词 returnfalse。以类似的方式，_.takeRightWhile 函数从末尾获取元素。

const _ = require("lodash");

let nums = [1, -2, 3, 4, -5, 6, 7, -8, -9]

let nums2 = _.takeWhile(nums, (n) => { return n < 0 });
let nums3 = _.takeRightWhile(nums, (n) => { return n < 0 });

console.log(nums2);
console.log(nums3);

在示例中，谓词对负值返回 true。

$ node main.js
[]
[ -8, -9 ]

Lodash 集合分区

分区操作将原始集合拆分为一对数组。第一个数组包含指定谓词产生 true 的元素，而第二个列表包含谓词产生 false 的元素。

const _ = require("lodash");

let nums = [4, -5, 3, 2, -1, 7, -6, 8, 9];
let [nums2, nums3] = _.partition(nums, (e) => e < 0);

console.log(nums2);
console.log(nums3);

使用_.partition 函数，我们将数组拆分为两个数组；第一个包含正值，第二个包含负值。

let [nums2, nums3] = _.partition(nums, (e) => e < 0);

_.partition 函数根据谓词函数创建两个数组。通过数组解构操作，我们将创建的数组分配给两个变量：nums2 和nums3。

$ node main.js
[ -5, -1, -6 ]
[ 4, 3, 2, 7, 8, 9 ]

Lodash 集合减少

Reduction 是一种终端操作，可将列表值聚合为单个值。 _.reduce 函数对累加器和数组中的每个元素（从左到右）应用一个函数，以将其减少为单个值。正在应用的函数称为reducer函数。

要更深入地了解缩减，请阅读 JavaScript 缩减教程。

const _ = require("lodash");

let nums = [4, 5, 3, 2, 1, 7, 6, 8, 9];

let sum = _.reduce(nums, (total, next) => { return total + next });
console.log(sum);

let colours = ["red", "green", "white", "blue", "black"];

let res = _.reduceRight(colours, (next, total) => { return `${total}-${next}` });
console.log(res);

在示例中，我们对整数和字符串列表使用归约操作。

let sum = _.reduce(nums, (total, next) => { return total + next });
console.log(sum);

我们计算值的总和。 total 是累加器，next 是列表中的下一个值。

let res = _.reduceRight(colours, (next, total) => { return `${total}-${next}` });

_.reduceRight 从最后一个元素开始累加一个值，并从右到左对每个元素和当前累加器值应用操作。

$ node main.js
45
red-green-white-blue-black

Lodash reduce – 出现次数

reducer 函数可用于统计数组中元素的出现次数。

const _ = require("lodash");


let words = ['sky', 'forest', 'wood', 'sky', 'rock', 'cloud',
    'sky', 'forest', 'rock', 'sky'];

let tally = _.reduce(words, (total, next) => {

  total[next] = (total[next] || 0) + 1 ;

  return total;
}, {});


console.log(tally);

单词数组，每一个单词都包含多次。初始值是一个空对象。 reducer 函数要么创建新属性，要么增加属性的值。

$ node main.js
{ sky: 4, forest: 2, wood: 1, rock: 2, cloud: 1 }

Lodash reduce – 按属性分组对象

以下示例按属性对数组中的对象进行分组。

const _ = require("lodash");

let users = [
  { name: 'John', age: 25, occupation: 'gardener' },
  { name: 'Lenny', age: 51, occupation: 'programmer' },
  { name: 'Andrew', age: 43, occupation: 'teacher' },
  { name: 'Peter', age: 52, occupation: 'gardener' },
  { name: 'Anna', age: 43, occupation: 'teacher' },
  { name: 'Albert', age: 46, occupation: 'programmer' },
  { name: 'Adam', age: 47, occupation: 'teacher' },
  { name: 'Robert', age: 32, occupation: 'driver' }
];

let grouped = _.reduce(users, (result, user) => {

    (result[user.occupation] || (result[user.occupation] = [])).push(user);
    return result;
}, {});

console.log(grouped);

我们有很多用户。我们按用户的职业对用户进行分组。初始值是一个空对象。结果对象具有职业作为属性；每个属性都包含具有相应职业的用户列表。

let grouped = _.reduce(users, (result, user) => {

    (result[user.occupation] || (result[user.occupation] = [])).push(user);
    return result;
}, {});

reducer 要么创建一个带有空数组的新属性并推送第一个用户，要么将一个新的用户对象添加到已创建的数组中。

$ node main.js
{
  gardener: [
    { name: 'John', age: 25, occupation: 'gardener' },
    { name: 'Peter', age: 52, occupation: 'gardener' }
  ],
  programmer: [
    { name: 'Lenny', age: 51, occupation: 'programmer' },
    { name: 'Albert', age: 46, occupation: 'programmer' }
  ],
  teacher: [
    { name: 'Andrew', age: 43, occupation: 'teacher' },
    { name: 'Anna', age: 43, occupation: 'teacher' },
    { name: 'Adam', age: 47, occupation: 'teacher' }
  ],
  driver: [ { name: 'Robert', age: 32, occupation: 'driver' } ]
}

Lodash 字符串大小写

Locash 库包含几个处理单词大小写的函数。

const _ = require("lodash");

let words = ["sky", "Sun", "Blue Island"];

console.log(_.map(words, _.camelCase));
console.log(_.map(words, _.capitalize));
console.log(_.map(words, _.kebabCase));
console.log(_.map(words, _.lowerCase));
console.log(_.map(words, _.upperCase));

在示例中，我们将单词的大小写修改为_.camelCase、_.capitalize、._kebabCase、_lowerCase和_.upperCase。

$ node main.js
[ 'sky', 'sun', 'blueIsland' ]
[ 'Sky', 'Sun', 'Blue island' ]
[ 'sky', 'sun', 'blue-island' ]
[ 'sky', 'sun', 'blue island' ]
[ 'SKY', 'SUN', 'BLUE ISLAND' ]

Lodash 字符串 _.startsWith 和 _.endsWith

_.startsWith 函数确定字符串是否以指定字符串开头。 _.endsWith 函数确定字符串是否以指定字符串结尾。

const _ = require("lodash");

let words = ["tank", "boy", "tourist", "ten",
        "pen", "car", "marble", "sonnet", "pleasant",
        "ink", "atom"]

console.log("Starting with 't'");
words.forEach( e => {

    if (_.startsWith(e, 't')) {

        console.log(e);
    }
});

console.log("Ending with 'k'");
words.forEach( e => {

    if (_.endsWith(e, 'k')) {

        console.log(e);
    }
});

在示例中，我们打印以“t”开头并以“k”结尾的单词。

$ nodejs string_startend.js
Starting with 't'
tank
tourist
ten
Ending with 'k'
tank
ink

Lodash 字符串填充

如果字符串比指定数字短，则可以用字符填充。

const _ = require("lodash");

let nums = [657, 122, 3245, 345, 99, 18];

nums.forEach( e => {

    console.log(_.padStart(e.toString(), 20, '.'));
});

该示例使用 _.padStart 用点字符填充数字。

$ node main.js
.................657
.................122
................3245
.................345
..................99
..................18

Lodash 字符串修剪

可以使用_.trim、_.trimStart 和_.trimEnd 函数对字符串进行修整。要修剪的默认字符是空格。我们可以提供自己的字符进行裁剪。

const _ = require("lodash");

let word = '\tfalcon\t';

let trimmed = _.trim(word);
console.log(trimmed + 'owl');

let trimmed2 = _.trimStart(word);
console.log(trimmed2 + 'owl');

let trimmed3 = _.trimEnd(word);
console.log(trimmed3 + 'owl');

在示例中，我们从一个单词中删除空白字符。

let trimmed = _.trim(word);

_.trim 函数删除两边的空白字符。

let trimmed2 = _.trimStart(word);

_.trimStart 函数删除字符串开头的空白字符。

let trimmed3 = _.trimEnd(word);

_.trimEnd 函数删除字符串末尾的空白字符。

$ node main.js
falconowl
falcon  owl
        falconowl

const _ = require("lodash")

let words = ['_falcon', '-owl-', '_-sky-_'];
let trimmed = _.map(words, (word) => { return _.trim(word, '-_')});

console.log(trimmed);

在此示例中，我们从字符串数组中删除两个自定义字符。我们还使用了_.map 函数。

$ node main.js
[ 'falcon', 'owl', 'sky' ]

Lodash 对象键和值

_.keys 函数返回 JavaScript 对象的属性名称数组，_.values 函数返回属性值数组。

const _ = require("lodash");

let p = {age: 24, name: "Rebecca", occupation: "teacher"};

let keys = _.keys(p);
console.log(keys);

let values = _.values(p);
console.log(values);

在示例中，我们打印了一个人对象的键和值。

$ node main.js
[ 'age', 'name', 'occupation' ]
[ 24, 'Rebecca', 'teacher' ]

Lodash 对象拾取

_.pick 函数创建一个由选取的对象属性组成的对象。

const _ = require("lodash");

console.log(_.pick({ name: 'John', age: 25 }, 'name'));
console.log(_.pick({ name: 'John', age: 25 }, 'age'));

我们从一个简单的对象中挑选属性。

$ node main.js
{ name: 'John' }
{ age: 25 }

Lodash 对象在

_.at 函数返回给定对象路径处的值。

const _ = require("lodash");

let users = [
  { id: 1, name: 'John', about: { 'age': 25, 'colours': ['red', 'green'], } },
  { id: 2, name: 'Lenny', about: { 'age': 51, 'colours': ['blue'], } },
  { id: 3, name: 'Andy', about: { 'age': 43, 'colours': ['orange', 'steelblue'], } },
  { id: 4, name: 'Peter', about: { 'age': 52, 'colours': ['black'], } },
  { id: 5, name: 'Anna', about: { 'age': 43, 'colours': ['purple'], } },
];


let name = _.at(users[2], 'name');
console.log(name);

let colour = _.at(users[0], 'about.colours[0]');
console.log(colour);

我们有一个对象列表。我们通过指定给定属性的路径来获取值。

$ node main.js
[ 'Andrew' ]
[ 'red' ]

Lodash 对象获取和设置

_.set 函数在对象的路径处设置值。如果路径的一部分不存在，则创建它。 _.get函数获取对象路径处的值；如果该值不存在，我们可以提供一个默认值。

const _ = require("lodash");

let data = { user: { name: "John Doe", age: 34, occupation: "gardener"} };

_.set(data, "user.age", 36);
console.log(data);

console.log(_.get(data, "user.name", "unknown"));
console.log(_.get(data, "user.marital_status", "unknown"));

示例中，我们为用户设置了一个新的年龄，获取了他的姓名和婚姻状况。婚姻状况属性不存在，所以我们得到默认的unknown。

$ node main.js
{ user: { name: 'John Doe', age: 36, occupation: 'gardener' } }
John Doe
unknown

Lodash 迭代对象属性

_.forIn 函数可用于迭代对象属性。

const _ = require("lodash");

let p = {age: 24, name: "Rebecca", occupation: "teacher"};

_.forIn(p, (value, key) => {

    console.log(`${key}: ${value}`);
})

在示例中，我们使用_.forIn 遍历了一个人对象的属性。

$ node main.js
age: 24
name: Rebecca
occupation: teacher

在本文中，我们介绍了 Lodash JavaScript 库。

列出所有 JavaScript 教程。