首页 > 代码库 > underscore.js学习笔记

underscore.js学习笔记

最近项目需要,开始学习underscore.js,在css88网站上看到有中文API,边看边记录自己能理解的笔记;

以下内容,函数以及部分解释抄自css88愚人码头中文API

内容还在整理中,发出部分

/***@方法参数解释*iterator 为迭代器,该函数会获取前面数组或者对象的值作为参数传入,并且一个个进行处理* predicate 为真值检测,该函数会将前面数组或者对象的值作为参数传入,并根据函数内容进行判断,如果能匹配上则返回true,否则返回false* @函数参数解释* list 数组或对象本身* properties 对象部分,一般用于判断前面的对象或者数组是否含有该部分内容* memo 初始值,为空;用到的函数有reduce,reduceRight,多用于迭代器函数(iterator)* element 函数的使用对象为数组时,会使用到该参数,指数组的子项,多用于迭代器函数(iterator)* index 函数的使用对象为数组时,会使用到该参数,指的是使用的子项的排列位置(其实名字就很明显了),多用于迭代器函数(iterator)* value 函数使用对象为对象时,会用到该函数,指对象的某一属性的值,多用于迭代器函数(iterator)* key 函数使用对象为对象时,会用到该函数,指对象的某一属性,多用于迭代器函数(iterator)*//*集合函数*//*** each函数 _.each(list, iterator, [context])* each函数是将前面的参数进行迭代处理* 如果是数组的话,后续函数的参数为element(数组内容),index(对应排序号),list(数组本身)* 如果是对象的话,后续函数的参数为value(值),key(键),list(对象本身)* num @type {number}*/var num = 0;var eachResult = _.each([1, 2, 3],function(ele,index,list){//num += ele;//alert(ele);//alert(index);});_.each({one: 1, two: 2, three: 3}, function(val,key){//console.log(key+":"+val);});/*** map函数 .map(list, iterator, [context])* map函数通过迭代器将list中的每个element(or value)映射到新的数组上(自动构建新数组返回出来)*数组时函数参数为element,index,list*对象时函数参数为value,key,list*/_.map([1, 2, 3], function(ele,index,list){//console.log(ele);//console.log(index);//console.log(list);return ele * 3;});_.map({one: 1, two: 2, three: 3}, function(value, key,list){return value * 3;});/*reduce函数 _.reduce(list, iterator, memo, [context])* 将集合中每个元素放入迭代处理器, 并将本次迭代的返回值作为"memo"传递到下一次迭代, 一般用于累计结果或连接数据*数组时参数为memo,ele,index,list* 对象时参数为memo,value,key,list*/_.reduce([1, 2, 3], function(memo, num){//return memo + num;}, 0);//console.log(flat);/*reduceRight函数 _.reduceRight(list, iterator, memo, [context])* 与reduce函数一样,只是顺序从右往左*/var list = [[0, 1], [2, 3], [4, 5]];//concat链接数组var flat = _.reduceRight(list, function(a, b) { return a.concat(b); }, []);/*** find函数 _.find(list, predicate, [context])* 寻找数组中能通过函数匹配的内容,返回第一个数字并理解结束函数* find函数参数为list(数组)、函数*/var even = _.find([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });//=>2 返回2之后立刻结束函数/***filter函数 _.filter(list, predicate, [context])* 与find函数类似,区别是会返回全部能通过函数的值,并组成一个新的数组返回出来*/var evens = _.filter([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });//=> [2, 4, 6] 返回一个新函数/*** where函数 _.where(list, properties)*参数为list、properties(对象)* 返回list中含有properties部分的数据*/listOfPlays = [{title: "Cymbeline", author: "Shakespeare", year: 1611},{title: "The Tempest", author: "Shakespeare", year: 1611},{title: "The Tempest", author: "11", year: 1611}];var where = _.where(listOfPlays, {author: "Shakespeare", year: 1611});//console.log(where);/***findWhere函数 _.findWhere(list, properties)*参数为list、properties(对象)* 遍历list中的每一个值,返回匹配properties所列出的属性的所有的键 - 值对的第一个值。* 如果没有找到匹配的属性,或者list是空的,那么将返回undefined。*/var publicServicePulitzers= [{year: 1918, newsroom: "The New York Times",reason: "For its public service in publishing in full so many official reports,documents and speeches by European statesmen relating to the progress andconduct of the war."}];_.findWhere(publicServicePulitzers, {newsroom: "The New York Times"});/*=> {year: 1918, newsroom: "The New York Times",reason: "For its public service in publishing in full so many official reports,documents and speeches by European statesmen relating to the progress andconduct of the war."}*//***reject函数 _.reject(list, predicate, [context])*返回没有通过predicate真值检测的元素集合,与filter相反* 参数为list,predicate*/var odds = _.reject([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });//=> [1, 3, 5] 不通过检测的数据组成一个新数组返回/*** every函数 _.every(list, [predicate], [context])*如果list中的所有元素能通过predicate的真值检测就返回true* predicate函数内需要用return返回出检测真值的函数*/var result =_.every([1,2,3,4,5],function(ele,index,list){//console.log(ele);//console.log(index);//console.log(list);return ele >=1;});//console.log(result);/*** some函数 _.some(list, [predicate], [context])*如果list中有任何一个元素通过 predicate 的真值检测就返回true。一旦找到了符合条件的元素, 就直接中断对list的遍历.*/var someresult = _.some([null,0,‘yes‘,false],function(ele,index,list){//console.log(ele);//console.log(index);//console.log(list);return ele >=1;});//console.log(someresult);/*** contains_.contains(list, value)*如果list包含指定的value则返回true(愚人码头注:使用===检测)。如果list 是数组,内部使用indexOf判断。*/var containsResult1 = _.contains([1,2,3],2);var containsResult2 = _.contains({title:1,name:2,age:3},2);//console.log(containsResult1);//console.log(containsResult2);//todo 不能理解methodName从哪来的,目前理解为获取相同名字的函数并传参数进去/*** invoke函数 _.invoke(list, methodName, *arguments)* 在list的每个元素上执行methodName方法。 任何传递给invoke的额外参数,invoke都会在调用methodName方法的时候传递给它。*/var invokeResult = _.invoke([[5, 1, 7], [3, 2, 1]], ‘sort‘);//console.log(invokeResult);/*** pluck _.pluck(list, propertyName)* 获取对象数组中某个属性,获取所有该属性的值并形成一个新的数组返回*/var pluckStooges = [{name: ‘moe‘, age: 40}, {name: ‘larry‘, age: 50}, {name: ‘curly‘, age: 60}];_.pluck(pluckStooges, ‘name‘);// => ["moe", "larry", "curly"]/*** max _.max(list, [iterator], [context])* 返回list中的最大值。如果传递iterator参数,iterator将作为list排序的依据。* 如下例:判断最大值的根据是stooge.age,写在iterator函数中,原理可认为是将该属性的值进行排序后,取出最大的值并获取该对象*/var maxStooges = [{name: ‘moe‘, age: 40}, {name: ‘larry‘, age: 50}, {name: ‘curly‘, age: 60}];_.max(maxStooges, function(stooge){ return stooge.age; });//=> {name: ‘curly‘, age: 60};/*** min _.min(list, [iterator], [context])*/

 

 

underscore.js学习笔记