眼看又要过年了,为了提高程序员的幸福指数,我觉得回顾一下设计模式是很有必要的。笔者根据工作,为了提高团队的代码质量和可维护性,特地写了几篇关于设计模式的文章,供大家参考学习。你将学习迭代器模式的含义实现一个数组迭代器实现一个对象迭代器实现路径查找/赋值迭代器如何使用迭代器思想解决分支循环嵌套问题实现一个图片播放器迭代器模式的主要思想就是在不暴露对象内部结构的情况下,按照一定的顺序访问对象内部的元素。其实javascript中的很多方法都使用了迭代器的思想,比如arrayforEach,every,find,some,map,entries等,这些操作大大简化了我们的逻辑操作。接下来,我们来看看它的具体应用。2、实现一个数组迭代器我们都知道javascript中数组的forEach方法,那么我们是否可以不用这个方法自己实现一个呢?//数组迭代器leteachArr=function(arr,fn){leti=0,len=arr.length;for(;i{console.log(index,value)})3.实现一个对象iterator对象迭代器类似于数组迭代器,只是参数不同,如下://对象迭代器leteachObj=function(obj,fn){for(letkeyinobj){if(fn.call(obj[key],key,obj[key])===false){break;}}}//使用每个对象({a:11,b:12},(key,value)=>{console.log(key,value)})4、实现路径查找/赋值迭代器有时候我们在操作对象的一些属性的时候,并不知道服务器端是否正确的返回了这个属性或者它的上级属性给我们。这时候如果我们直接通过点语法或者[]语法访问,代码就会报错,所以我们需要对每一层操作都做安全检查。这样会产生很多臃肿的代码,比如:letobj={};//getobj.num.titNumlettitNum=obj.num.titNum;//报错lettitNum=obj&&obj.num&&obj.num.titNum;//正确我们通过迭代器可以大大减少这种验证并实现更健壮的代码模式:letfindObjAttr=function(obj,key){if(!obj||!key){returnundefined}letresult=obj;key=key.split('.');for(leti=0;len=key.length;i0){img.src=imgData[index]}else{index=0img.src=imgData[index]}},//切换到下一张图片next:function(){if(++index{if(index>len-1){index=0}img.src=imgData[index]index++},5000)},//停止播放图片stop:function(){clearInterval(timer)}}}//Useletplayer=newimgPlayer(imgData,'#box')总之就是组合迭代器思想和其他设计模式可以设计出各种高度可配置的组件,所以学习和理解javascript设计模式的精髓,决定了我们的高度和态度。