依赖库Underscore系列（1）--集合

来源：互联网发布：js 添加li 编辑：程序博客网时间：2024/05/16 05:01

Underscore库–集合系列

1、each()函数
(1)调用格式：

 _.each(list,iterator,[context])

(2) 函数功能：
　　根据iterator迭代器提供的过滤条件，遍历list列表中的每一个元素，每遍历一次，产生一个迭代函数。此外，iterator迭代器还可以与可选项context上下文对象绑定。
(3)示例如下：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>each()</title>    <script src="js/underscore-min.js" type="text/javascript"></script></head><body><script type="text/javascript">    _.each([1, 2, 3, 4, 5, 6], function (n) {        if (!(n % 2)) console.log(n);    });</script></body></html>

(4)执行结果：
　 Collections_each()_result
　
2、map()函数
(1)调用格式：

_.map(list,　iterator,　[context])

(2)函数功能：
　　根据iterator迭代器中的函数，遍历list列表中的每一个元素，在完成列表元素遍历之后，该函数将返回一个数组对象。
(3)示例如下：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>map()</title>    <script src="js/underscore-min.js" type="text/javascript"></script></head><body><script type="text/javascript">    var arr = _.map([1, 2, 3, 4, 5, 6], function (n) {        if (!(n % 2)) return n;    });    for (var i = 0; i < arr.length; i++) {        if (arr[i] != undefined)            console.log(i + "->" + arr[i]);    }</script></body></html>

(4)执行结果：
　 Collections_map()_result

3、reduce()函数
(1)调用格式：

_.reduce(list，iterator，[memo]，[context])

(2)函数功能：
　　根据iterator迭代器中的函数，遍历list列表中的每一个元素，在完成列表元素遍历之后，该函数将返回一个数值。如果没有memo，iterator不会被第一个元素调用。第一个元素将取代memo。
(3)示例如下：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>reduce()</title>    <script src="js/underscore-min.js" type="text/javascript"></script></head><body><script type="text/javascript">    var sum = _.reduce([1, 2, 3, 4, 5, 6], function (memo, num) {        return memo + num;    });    console.log(sum);</script></body></html>

(4)执行结果：
　 Collections_reduce()_result
　
4、reduceRight()函数
(1)调用格式：

_.reduceRight(list，iterator，memo，[context])

(2)函数功能：
　　reducRight是从右侧开始组合的元素的reduce函数。
(3)示例如下：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>reduceRight()</title>    <script src="js/underscore-min.js" type="text/javascript"></script></head><body><script type="text/javascript">    var list = [[0, 1], [2, 3], [4, 5]];    var flat = _.reduceRight(list, function (a, b) {        return a.concat(b);    }, []);    var result = "";    for (var i = 0; i < flat.length; i++) {        if (i != flat.length - 1) {            result += flat[i] + ",";        } else {            result += flat[i];        }    }    console.log(result);</script></body></html>

(4)执行结果：
　　 Collections_reduce()_result
　　
5、find()
(1)调用格式：

_.find(list，iterator，[context])

(2)函数功能：
　　根据iterator迭代器中的自定义函数条件，在list列表中查找符合条件的第一个元素项，如果找到，返回第一个元素项，否则返回“undefined”。
(3)示例如下：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>find()</title>    <script src="js/underscore-min.js" type="text/javascript"></script></head><body><script type="text/javascript">    var blnfind = _.find([2, 4, 6, 8, 10, 12], function (n) {        return (!(n % 2 == 0));    })    console.log(blnfind != undefined ? blnfind : "未找到");</script></body></html>

(4)执行结果：
　 collections_find()_result
　　　　　　
6、filter()函数
(1)调用格式：

_.filter(list,iterator,[context])

(2)函数功能：
　　根据iterator迭代器的自定义函数条件，在list列表中过滤符合条件的元素项。如果找到，则返回含有元素项的数组；如果没有找到，则返回一个空数组。
(3)示例如下：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>filter()</title>    <script src="js/underscore-min.js" type="text/javascript"></script></head><body><script type="text/javascript">    var arrfind = _.filter([1, 2, 3, 4, 5, 6, 7, 8], function (n) {        return (!(n % 2 == 0));    });    console.log(arrfind.length != 0 ? arrfind : "未找到");</script></body></html>

(4)执行结果：
Collections_filter()_result

7、max()函数
(1)调用格式：

_.max(list,[iterator],[context])

(2)函数功能：
　　返回list列表中最大值。如果有可选项iterator迭代器，先根据iterator迭代器中的自定函数过滤list列表中的每个元素，得到一个新的list列表，然后从这个新的list列表中返回最大值。
(3)示例如下：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>max()</title>    <script src="js/underscore-min.js" type="text/javascript"></script></head><body><script type="text/javascript">    var max = _.max([1, 13, 4, 6, 8, 10]);    console.log("max = " + max);</script></body></html>

(4)执行结果：
Collections_max()_result

8、min()函数
(1)调用格式：

_.min(list,[iterator],[context])

(2)函数功能：
　　返回list列表中的最小值。如果有可选项iterator迭代器，先根据iterator迭代器中的自定函数过滤list列表中的每个元素，得到一个新的list列表，然后从这个新的list列表中返回最小值。
(3)示例如下：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>min()</title>    <script src="js/underscore-min.js" type="text/javascript"></script></head><body><script type="text/javascript">    var stu = [        {name: '张三', score: 60},        {name: '李四', score: 40},        {name: '王五', score: 80}    ];    var min = _.min(stu, function (n) {        return n.score;    });    console.log("最小分数值姓名为：" + min.name);</script></body></html>

(4)执行结果：
Collections_min()_result

9、sortBy()函数
(1)调用格式：

_.sortBy(list,iterator,[context])

(2)函数功能：
　　返回一个按升序排列的副本列表。排列的规则科室是iterator迭代器中的自定义的安徽省农户，也可以是一个与元素属性相关的字符串。
(3)示例如下：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>sortBy()</title>    <script src="js/underscore-min.js" type="text/javascript"></script></head><body><script type="text/javascript">    var stu = [        {name: '张三', score: 60},        {name: '李四', score: 40},        {name: '王五', score: 80}    ];    var sort = _.sortBy(stu, function (n) {        return n.score;    });    for (var p in sort) {        console.log(sort[p].name + "->" + sort[p].score);    }</script></body></html>

(4)执行结果：
Collections_sortBy()_result

10、groupBy()函数
(1)调用格式：

_.groupBy(list,iterator,[context])

(2)函数功能：
　　将list列表按iterator迭代器中自定义的函数或一个与元素属性相关的字符串进行分组分割，分割后得到多个子列表。
(3)示例如下：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>groupBy()</title>    <script src="js/underscore-min.js" type="text/javascript"></script></head><body><script type="text/javascript">    var stu = [        {name: '张三', score: 60},        {name: '李四', score: 40},        {name: '王五', score: 80}    ];    var group = _.groupBy(stu, function (n) {        return n.score > 40;    });    console.log(group);</script></body></html>

(4)执行结果：
Collections_groupBy()_result1
Collections_groupBy()_result2

0 0