Underscore.JS - 快速指南

Underscore.JS - 概述

Underscore.JS 是一个流行的基于 javascript 的库，它提供了 100 多个函数来促进 Web 开发。它提供了诸如 map、filter、invoke 以及函数绑定、javascript 模板、深度相等性检查、创建索引等辅助函数。Underscore.JS 可以直接在浏览器中使用，也可以与 Node.js 一起使用。

使用 JavaScript 处理对象可能非常具有挑战性，特别是如果您需要对它们进行大量操作时。 Underscore 具有许多功能，可简化您处理对象的工作。

Underscore.JS 是一个开源项目，您可以轻松地为库做出贡献并以插件的形式添加功能，并将其在 GitHub 和 Node.js 中提供。

功能

让我们详细了解 Underscore − 提供的所有重要功能

集合

Underscore.JS 为集合提供了各种函数，例如 each、map、reduce，用于对集合的每个项目应用操作。它提供了 groupBy、countBy、max、min 等方法来处理集合并简化许多任务。

数组

Underscore.JS 为数组提供了各种函数，如迭代和处理数组，如 first、initial、lastIndexOf、intersection、difference 等。

函数

Underscore.JS 提供 bind、delay、before、after 等函数。

对象

Underscore.JS 提供操作对象、映射对象和比较对象的函数。例如，keys、values、extends、extendsOwn、isEqual、isEmpty 等。

实用程序

Underscore.JS 提供各种实用程序方法，如 noConflict、random、iteratee、escape 等。

链接

Underscore.JS 还提供链接方法，如 chain、value。

在后续章节中，我们将介绍 Underscore.JS 的重要功能

Underscore.JS - 环境设置

在本章中，您将详细了解如何在本地计算机上设置 Underscore.JS 的工作环境。在开始使用 Underscore.JS 之前，您需要具有对该库的访问权限。您可以通过以下任何一种方法访问其文件 −

方法 1:在浏览器中使用 Underscore.JS 文件

在此方法中，我们将需要从其官方网站获取 Underscore.JS 文件，并将直接在浏览器中使用它。

步骤 1

首先，请访问 Underscore.JS 的官方网站 https://underscorejs.org/。

请注意，有一个可用的下载选项，可为您提供最新的 underscore-min.js 文件 UMD (Production)。右键单击链接并选择另存为。请注意，该文件在压缩和未压缩两种情况下均可用。

步骤 2

现在，在 script 标签内包含 underscore-min.js，并开始使用 Underscore.JS。为此，您可以使用下面给出的代码 −

<script type = "text/JavaScript" src = "https://underscorejs.org/underscore-min.js"></script>

为了更好地理解，这里给出了一个工作示例及其输出 −

Example

<html>
   <head>
      <title>Underscore.JS - Working Example</title>
      <script type = "text/JavaScript" src = "https://underscorejs.org/underscore-min.js"></script>
      <style>
         div {
            border: solid 1px #ccc;
            padding:10px;
            font-family: "Segoe UI",Arial,sans-serif;
            width: 50%;
         }
      </style>
   </head>
   <body>
      <div style = "font-size:25px" id = "list">
	  </div>
      <script type = "text/JavaScript">
         var numbers = [1, 2, 3, 4];
         var listOfNumbers = '';
         _.each(numbers, function(x) { listOfNumbers += x + ' ' });
         document.getElementById("list").innerHTML = listOfNumbers;
      </script>
   </body>
</html>

输出

方法 2:使用 Node.js

如果您选择此方法，请确保您的系统上安装了 Node.js 和 npm。您可以使用以下命令安装 Underscore.JS −

npm install underscore

成功安装 Underscore.JS 后，您可以观察到以下输出 −

+ underscore@1.10.2
added 1 package from 1 contributor and audited 1 package in 6.331s
found 0 vulnerabilities

现在，要测试 Underscore.JS 是否能与 Node.js 很好地配合使用，请创建文件 tester.js 并将以下代码添加到其中 −

var _ = require('underscore');
var numbers = [1, 2, 3, 4];
var listOfNumbers = '';
_.each(numbers, function(x) { listOfNumbers += x + ' ' });
console.log(listOfNumbers);

将上述程序保存在 tester.js 中。以下命令用于编译和执行此程序。

命令

\>node tester.js

输出

1 2 3 4

Underscore.JS - 迭代集合

Underscore.JS 有许多易于使用的方法，有助于迭代集合。本章将详细讨论这些方法。

Underscore.JS 提供了各种方法来迭代集合，如下所示 −

Sr.No.	方法和语法
1	each _.each(list, iteratee, [context])
2	map _.map(list, iteratee, [context])
3	reduce _.reduce(list, iteratee, [memo], [context])
4	reduceRight _.reduceRight(list, iteratee, [memo], [context])
5	find _.find(list, predicate, [context])
6	filter _.filter(list, predicate, [context])
7	where _.where(list, properties)
8	findWhere _.findWhere(list, properties)
9	reject _.reject(list, predicate, [context])
10	every _.every(list, [predicate], [context])
11	some _.some(list, [predicate], [context])

Underscore.JS - 处理集合

Underscore.JS 有许多易于使用的方法，有助于处理集合。本章将详细讨论这些方法。

Underscore.JS 提供了各种方法来处理集合，如下所示 −

Sr.No.	方法和语法
1	contains _.contains(list, value, [fromIndex])
2	invoke _.invoke(list, methodName, *arguments)
3	pluck _.pluck(list, propertyName)
4	max _.max(list, [iteratee], [context])
5	min _.min(list, [iteratee], [context])
6	sortBy _.sortBy(list, iteratee, [context])
7	groupBy _.groupBy(list, iteratee, [context])
8	indexBy _.indexBy(list, iteratee, [context])
9	countBy _.countBy(list, iteratee, [context])
10	shuffle _.shuffle(list)
11	sample _.sample(list, [n])
12	toArray _.toArray(list)
13	size _.size(list)
14	partition _.partition(list, predicate)
15	compact _.compact(list)

Underscore.JS - 迭代数组

Underscore.JS 有许多易于使用的方法，有助于迭代数组。本章将详细讨论这些方法。

Underscore.JS 提供了各种迭代数组的方法，如下所示 −

Sr.No.	方法和语法
1	first _.first(array, [n])
2	initial _.initial(array, [n])
3	last _.last(array, [n])
4	rest _.rest(array, [index])
5	indexOf _.indexOf(array, value, [isSorted])
6	lastIndexOf _.lastIndexOf(array, value, [fromIndex])
7	sortedIndex _.sortedIndex(array, value, [iteratee], [context])
8	findIndex _.findIndex(array, predicate, [context])
9	findLastIndex _.findLastIndex(array, predicate, [context])

Underscore.JS - 处理数组

Underscore.JS 有许多易于使用的方法，有助于处理数组。本章将详细讨论这些方法。

Underscore.JS 提供了各种方法来处理数组，如下所示 −

Sr.No.	方法和语法
1	flatten _.flatten(array, [shallow])
2	without _.without(array, *values)
3	union _.union(*arrays)
4	intersection _.intersection(*arrays)
5	difference _.difference(array, *others)
6	uniq _.uniq(array, [isSorted], [iteratee])
7	zip _.zip(*arrays)
8	unzip _.unzip(array)
9	object _.object(list, [values])
10	chunk _.chunk(array, length)
11	range _.range([start], stop, [step])

Underscore.JS - 函数

Underscore.JS 有许多易于使用的方法，有助于处理函数。本章将详细讨论这些方法。

Underscore.JS 提供了各种方法来处理函数，如下所示 −

Sr.No.	方法和语法
1	bind _.bind(function, object, *arguments)
2	partial _.partial(function, *arguments)
3	memoize _.memoize(function, [hashFunction])
4	delay _.delay(function, wait, *arguments)
5	once _.once(function)
6	before _.before(count, function)
7	wrap _.wrap(function, wrapper)
8	negate _.negate(predicate)
9	compose _.compose(*functions)

Underscore.JS - 映射对象

Underscore.JS 有许多易于使用的方法，有助于映射对象。本章将详细讨论这些方法。

Underscore.JS 提供了各种方法来处理对象映射，如下所示 −

Sr.No.	方法和语法
1	keys _.keys(object)
2	allKeys _.allKeys(object)
3	values _.values(object)
4	mapObject _.mapObject(object, iteratee, [context])
5	pairs _.pairs(object)
6	invert _.invert(object)
7	create _.create(prototype, props)
8	functions _.functions(object)
9	findKey _.findKey(object, predicate, [context])

Underscore.JS - 更新对象

Underscore.JS 有许多易于使用的方法，可帮助更新对象。本章将详细讨论这些方法。

Underscore.JS 提供各种方法来处理对象更新，如下所示 −

Sr.No.	方法和语法
1	extend _.extend(destination, *sources)
2	pick _.pick(object, *keys)
3	omit _.omit(object, *keys)
4	defaults _.defaults(object, *defaults)
5	clone _.clone(object)
6	tap _.tap(object, interceptor)
7	has _.has(object, key)
8	property _.property(path)
9	propertyOf _.propertyOf(object)

Underscore.JS - 比较对象

Underscore.JS 有许多易于使用的方法，有助于比较对象。本章将详细讨论这些方法。

Underscore.JS 提供了各种方法来处理对象比较，如下所示 −

Sr.No.	方法和语法
1	matcher _.matcher(attrs)
2	isEqual _.isEqual(object, other)
3	isMatch _.isMatch(object, properties)
4	isEmpty _.isEmpty(object)
5	isArray _.isArray(object)
6	isObject _.isObject(value)
7	isArguments _.isArguments(object)
8	isFunction _.isFunction(object)
9	isString _.isString(object)
10	isNumber _.isNumber(object)
11	isFinite _.isFinite(object)
12	isBoolean _.isBoolean(object)
13	isDate _.isDate(object)
14	isRegExp _.isRegExp(object)
15	isError _.isError(object)
16	isSymbol _.isSymbol(object)
17	isMap _.isMap(object)
18	isWeakMap _.isWeakMap(object)
19	isSet _.isSet(object)
20	isWeakSet _.isWeakSet(object)
21	isNaN _.isNaN(object)
22	isNull _.isNull(object)
23	isUndefined _.isUndefined(value)

Underscore.JS - 实用程序

Underscore.JS 有许多易于使用的实用方法。本章将详细讨论它们。

Underscore.JS 提供各种实用方法，如下所示 −

Sr.No.	方法和语法
1	identity _.identity(value)
2	constant _.constant(value)
3	noop _.noop()
4	times _.times(n, iteratee, [context])
5	random _.random(min, max)
6	mixin _.mixin(object)
7	iteratee _.iteratee(value, [context])
8	uniqueId _.uniqueId([prefix])
9	escape _.escape(string)
10	unescape _.unescape(string)
11	result _.result(object, property, [defaultValue])
12	now _.now()
13	template _.template(templateString, [settings])

Underscore.JS - 链式调用

Underscore.JS 具有创建方法链并检索其有效结果的方法。本章将详细讨论这些方法。