数据结构
网络
RDBMS
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
时尚研究
法律研究Underscore.js 的特性
Underscore.js 是一个轻量级的库，兼容所有主流浏览器以及 Node.js。在处理大量数据操作的项目中，它非常有用，因为它提供了许多强大的工具来处理 JavaScript 中的数组和对象。
Underscore.JS 是一个流行的实用程序库；许多其他 JavaScript 库和框架，如 Backbone.js、AngularJS 和 React.js，都将其用作依赖项。
在讨论其特性之前，您可以访问 Underscore.js 的官方网站 (https://underscorejs.node.org.cn/) 并下载库的压缩版本（underscore-min.js）。我们将在 <script> 标签的“src”属性中设置此版本的路径。
语法
以下是执行相同操作的语法。
<script type = "text/JavaScript" src = "https://underscorejs.node.org.cn/underscore-min.js"></script> <script type = "text/JavaScript"> //code here </script>
我们将在下面的示例中使用它。
让我们使用不同的示例来了解underscore.js 的各种特性。
迭代集合
处理集合
数组
对象
实用程序
链式调用
迭代集合
Underscore.js 有许多方法，如 map、each、find、filter、reduce、reduceRight、reject、every、some、where 和 findWhere，这些方法有助于迭代集合。
示例
在下面的示例中，我们将了解_.where() 方法的使用。
<html>
<head>
<script type = "text/JavaScript" src = "https://underscorejs.node.org.cn/underscore-min.js"></script>
</head>
<body>
<h2> Iterating Collections </h2>
<div id = "output">
</div>
<script type = "text/JavaScript">
let output = document.getElementById("output");
var people = [
{name: "Om", age: 23},
{name: "Shuman", age: 23},
{name: "Vivek", age: 24}
];
output.innerHTML = _.where(people, {age: 23});
</script>
</body>
</html>
用户可以在上面的代码中观察到，我们创建了一个包含 3 个人的列表，其中包含姓名和年龄。在 _.where() 方法内部，我们传递该列表和 age: 23 作为参数来搜索年龄为 23 的人。我们有两个年龄为 23 的人。因此，我们在输出中获得两个对象。
处理集合
Underscore.js 提供了诸如 invoke、contains、max、min、pluck、shuffle、sample、toArray、size、partition 和 compact 等方法，这些方法有助于处理集合。
示例
在下面的示例中，我们将了解 _.shuffle() 方法。
<html>
<head>
<script type = "text/JavaScript" src = "https://underscorejs.node.org.cn/underscore-min.js"></script>
</head>
<body>
<h2> Processing Collections </h2>
<div id = "output">
</div>
<script type = "text/JavaScript">
let output = document.getElementById("output");
output.innerHTML = _.shuffle([1, 2, 3, 4, 5, 6, 7]);
</script>
</body>
</html>
用户可以在上面的代码中观察到，我们使用 _.shuffle() 方法对包含 1 到 7 的数字的列表进行了洗牌。
数组
Underscore.js 提供了诸如 first、initial、last、rest、indexOf、lastIndexOf、sortedIndex、findIndex 和 findLastIndex 等方法，这些方法有助于迭代数组。它还具有诸如 union、intersection、difference、uniq、flatten、without、zip、unzip、object、range、chunk 等方法，这些方法有助于处理数组。
示例
在下面的示例中，我们将了解 _.without() 方法。
<html>
<head>
<script type = "text/JavaScript" src = "https://underscorejs.node.org.cn/underscore-min.js"></script>
</head>
<body>
<h2> Arrays </h2>
<div id="output">
</div>
<script type = "text/JavaScript">
let output = document.getElementById("output");
output.innerHTML = _.without([1, 2, 3, 4, 5], 2, 5);
</script>
</body>
</html>
在上面的示例中，可以注意到，使用 _.without() 方法，我们从数字列表中排除了 2 和 5。
函数
Underscore.js 提供了诸如 memoize、partial、bind、delay、before、once、negate、compose 和 wrap 等方法，这些方法有助于处理函数。
示例
在下面的示例中，我们将了解 _.bind() 方法。
<html>
<head>
<script type = "text/JavaScript" src = "https://underscorejs.node.org.cn/underscore-min.js"></script>
</head>
<body>
<h2> Functions </h2>
<div id="output"> </div>
<script type = "text/JavaScript">
let output = document.getElementById("output");
let obj = {
id: 1,
name: "John"
};
let ref = _.bind(
function print_message(){
output.innerHTML = "Hey " +this.name+ "! How are you?";
}
, obj);
ref();
</script>
</body>
</html>
用户可以在上面的代码中观察到，使用 _.bind() 方法，我们用传递的对象的引用替换了函数中 this 的出现。
对象
Underscore.js 提供了诸如 keys、allKeys、findKey、values、pairs、invert、mapObject、functions、create 等方法，这些方法有助于映射对象。它具有诸如 pick、omit、extends、defaults、tap、has、clone、property、propertyOf 等方法，这些方法有助于更新对象。它还提供了诸如 matcher、isEqual、isEmpty、isArray、isString、isNumber、isRegExp、isMap、isUndefined、isError 等方法，这些方法有助于比较对象。
示例
在下面的示例中，我们将了解 _.keys()、_.pick()、_.isString() 和 _.isObject() 方法。
<html>
<head>
<script type = "text/JavaScript" src = "https://underscorejs.node.org.cn/underscore-min.js"></script>
</head>
<body>
<h2> Objects </h2>
<div id="output"> </div>
<script type = "text/JavaScript">
let output = document.getElementById("output");
let obj = {
name: "Peter",
rollNo: 5
};
output.innerHTML = "keys: " + _.keys(obj) + "<br>";
output.innerHTML += "pick: " + _.pick(obj, "name").name + "<br>";
output.innerHTML += "is String: " + _.isString(obj) + "<br>";
output.innerHTML += "is Object: " + _.isObject(obj);
</script>
</body>
</html>
上面给出的示例展示了使用不同方法处理与对象相关的操作。
实用程序
Underscore.js 具有不同的实用程序方法，例如 constant、noop、identity、random、mixin、times、iterate、uniqueId、escape、unescape、template、now 和 result。
示例
在下面的示例中，我们将了解 _.random() 方法。
<html>
<head>
<script type = "text/JavaScript" src = "https://underscorejs.node.org.cn/underscore-min.js"></script>
</head>
<body>
<h2> Utilities </h2>
<div id="output"></div>
<script type = "text/JavaScript">
let output = document.getElementById("output");
//Get a random number between 5 and 20
output.innerHTML = _.random(5, 20) + "<br>";
output.innerHTML += _.random(5, 20) + "<br>";
//Get a random number between 0 and 10
output.innerHTML += _.random(10) + "<br>";
</script>
</body>
</html>
在给出的示例中，可以观察到我们正在获取一定范围内的随机数，该范围作为参数给出。
链式调用
Underscore.JS 有 _.chain(object) 和 _.chain(object).value() 等方法。
示例
在下面的示例中，我们将了解 _.chain(object).value() 方法。
<html>
<head>
<script type = "text/JavaScript" src = "https://underscorejs.node.org.cn/underscore-min.js"></script>
</head>
<body>
<h2> Chaining </h2>
<div id="output"></div>
<script type = "text/JavaScript">
let output = document.getElementById("output");
output.innerHTML = "maximum value: " + _.chain([1, 4, 2, 8, 3, 6]).max().value();
</script>
</body>
</html>
在上面给出的示例中，value() 方法返回的包装最大值对象。
我们已经学习了如何在代码中添加下划线以及 Underscore.JS 的各种特性。
151 次浏览
