Underscore.js 教程

Underscore.js 是一个 JavaScript 实用函数库，提供了一系列常用的函数，包括数组操作、函数式编程、对象操作、模板引擎等，可以节省编写 JavaScript 代码的时间。

安装

可以通过 npm 安装：

npm install underscore

也可以直接在 HTML 页面中引入：

<script src="https://cdn.jsdelivr.net/underscorejs/1.9.1/underscore-min.js"></script>

使用

数组操作

Underscore.js 提供了许多数组操作的函数，包括过滤、查找、排序等等。下面是一些常用的函数：

filter

过滤数组中符合条件的元素，并返回一个新的数组。

const numbers = [1, 2, 3, 4, 5];
const evenNumbers = _.filter(numbers, num => num % 2 === 0);
// evenNumbers => [2, 4]

find

在数组中查找符合条件的第一个元素，并返回该元素。

const numbers = [1, 2, 3, 4, 5];
const firstEvenNumber = _.find(numbers, num => num % 2 === 0);
// firstEvenNumber => 2

sortBy

按指定属性对数组进行排序。

const users = [
  { name: 'Alice', age: 22 },
  { name: 'Bob', age: 30 },
  { name: 'Charlie', age: 26 }
];
const sortedUsers = _.sortBy(users, 'age');
// sortedUsers => [{ name: 'Alice', age: 22 }, { name: 'Charlie', age: 26 }, { name: 'Bob', age: 30 }]

函数式编程

Underscore.js 中的函数式编程函数可以让编写 JavaScript 代码更加简洁。

partial

创建一个带有部分参数的函数，并返回一个新的函数。

function greet(greeting, name) {
  return `${greeting}, ${name}!`;
}
const sayHello = _.partial(greet, 'Hello');
const helloAlice = sayHello('Alice');
// helloAlice => 'Hello, Alice!'

compose

将多个函数组合成一个新的函数，并依次执行，在函数式编程中常用。

const add = x => x + 1;
const square = x => x * x;
const addAndSquare = _.compose(square, add);
const result = addAndSquare(2);
// result => 9

对象操作

Underscore.js 中有许多方便处理对象的函数。

mapObject

对对象中的每个属性进行操作，返回一个新的对象。

const user = { name: 'Alice', age: 22 };
const userWithGreetings = _.mapObject(user, value => `Hello, ${value}!`);
// userWithGreetings => { name: 'Hello, Alice!', age: 'Hello, 22!' }

extend

将一个对象的属性拷贝到另一个对象中。

const obj1 = { a: 1, b: 2 };
const obj2 = { b: 3, c: 4 };
const mergedObj = _.extend(obj1, obj2);
// mergedObj => { a: 1, b: 3, c: 4 }

模板引擎

Underscore.js 中内置了一个简单的模板引擎。

const template = _.template('Hello, <%= name %>!');
const result = template({ name: 'Alice' });
// result => 'Hello, Alice!'

以上只是 Underscore.js 的一部分功能，其它函数及用法请查看官方文档。