JS的集合遍历能力(es6新增for-of)


一,for-of 可遍历的集合

1,数组

2,字符串

3,伪数组(很多类似数组的对象)(需要部署部署数组的Symbol.iterator方法)


let iterable = {


0: 'a',


1: 'b',


2: 'c',


length: 3,


[Symbol.iterator]: Array.prototype[Symbol.iterator]


};


for (let item of iterable) {


console.log(item); // 'a', 'b', 'c'


}


4,Map 和 Set 对象(ES6中新增的数据结构)

例如:DOM NodeList,函数的参数列表

for-of并不适用于处理原有的原生对象(注意,普通对象部署数组的Symbol.iterator方法,并无效果)

for-of通过方法调用来实现集合的遍历。数组、Maps、Sets 以及其他我们讨论过的对象之间有个共同点:有迭代器方法。

当然,任何对象都可以添加迭代器方法。

就像你可以给任意对象添加myObject.toString()方法,使之可以将对象转换为字符串,你可以将myObject[Symbol.iterator]()方法添加到任意对象,这样对象就可以被遍历了。

这个类似数组的对象默认没有迭代器,调用的数组的迭代器




二,遍历对象的属性  用 for-in 或者  内置的Object.keys()


for-in 专门用来遍历对象的

function fn(){

    for(var i in o){

        console.log(o[i],i)

    }

};fn()

//1 "a"  2 "b"



Object.keys 返回数组的索引 或者对象的key值 或  类数组 对象 的key

var o =[1,2,3]; //0,1,2

var o = {a:1,b:2};//["a", "b"]

Object.keys(o,function(v){

  console.log(v)

})

//["a", "b"]

/* getFoo 是个不可枚举的属性 */

var my_obj=Object.create({},

{getFoo:{value:function(){returnthis.foo}}});

my_obj.foo=1;

console.log(Object.keys(my_obj));//["foo"]

三,  for 与 forEach (es5) 

var arr = [1,2,3];

for(var i=0;i<arr.length;i++){

      if(i==1){break;}

    if(i==1){continue;}

      console.log(arr[i]); 

  }

在forEach中使用break,continue会报语法错误

arr.forEach(function(v,i){

        console.log(v,i)

        if(i==1){break;}

})


四,es6的map适用于数组


总结与思考

1,为什么forEach中不能使用break或continue

2,函数式例如ramdajs 内部是如何遍历对象的?用到了of .

其他集合可以用递归,但是,对象貌似不行。

只能用for-in 或者for-of  ?

3,为什么 for-in 可以做,还要用for-of 来遍历对象,而且还需要把对象转换为可迭代对象

建议用前端函数式的库,比如underscore,ramda, lodash等,比如ramda中的map可以处理数组或者对象,当然这只是它的基本功能其中的一个API.它的优势特点,之后会有文章发布到简书。

疑问 与 思考:

1> ,for循环语句在使用时,需要定义好遍历的结束条件。

i <data.length

2> for-in专为遍历对象,  

var o = {"a":1,"b":2,"c":{"c1":33}};//o.length;//undefined

对象没有length的情况,又不是通过迭代器来实现遍历?那是如果知道是否结束遍历?

3> forEach  与 map 在 ECMAScript 中提供遍历数组的,并且是挂在了数组的原型上。但是在使用时,并没有明确定义遍历结束条件?

map  “映射”,也就是原数组被“映射”成对应新数组。

es6中的map与FP中的map的区别?(处理的数据类型更多)

前者 为点语法 data.map();//并且只能处理数组

后者 可以处理数组与对象,伪数组没做测试。

后者语法为 let fn = R.map(fn)(数据集合);//FP的柯里化优势就不多说了





end of JS的集合处理能力


能工摹形,巧匠窃意。 -- 毕加索


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,744评论 6 502
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,505评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 163,105评论 0 353
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,242评论 1 292
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,269评论 6 389
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,215评论 1 299
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,096评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,939评论 0 274
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,354评论 1 311
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,573评论 2 333
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,745评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,448评论 5 344
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,048评论 3 327
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,683评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,838评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,776评论 2 369
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,652评论 2 354

推荐阅读更多精彩内容