学习JavaScript设计模式之迭代器模式

前端之家收集整理的这篇文章主要介绍了学习JavaScript设计模式之迭代器模式前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
  • 方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示。

JavaScript中的Array.prototype.forEach

一、jQuery中的迭代器

二、实现自己的迭代器

注意:区别于Array.prototype.forEach的参数!!!

三、内部迭代器、外部迭代器

(1)内部迭代器:已经定义好了迭代规则,它完全接手整个迭代过程,外部只需一次初始调用。上述自定义each即为内部迭代器! (2)外部迭代器:必须显示地请求迭代下一个元素。 示例:判断两个数组是否相等

示例一:内部迭代器

函数 var compareAry = function(ary1,ary2) { if(ary1.length != ary2.length) { throw new Error("不相等"); // return console.log("不相等"); } // 且住 each(ary1,n) { if(n !== ary2[i]) { // return console.log("不相等"); // return 只能返回到each方法外,后续console.log("相等")会继续执行,所以这里得使用throw throw new Error("不相等"); } }); console.log("相等"); }

compareAry([1,[1,4]);

示例二:外部迭代器

= obj.length; },getCurrentItem = function() { return obj[current]; }; return { next: next,isDone: isDone,getCurrentItem: getCurrentItem }; }; // 比较函数 var compareAry = function(iterator1,iterator2) { while( !iterator1.isDone() && !iterator2.isDone() ){ if(iterator1.getCurrentItem() !== iterator2.getCurrentItem()) { throw new Error("不相等"); } iterator1.next(); iterator2.next(); } console.log("相等"); }

compareAry(new Iterator([1,3]),new Iterator([1,4]));

四、终止迭代器

each([1,4,1],n) {
if(n > 3) {
return false;
}
console.log(n);
});

五、应用(落地)

文件上传,根据不同的浏览器获取相应的上传组件对象。 对比《JavaScript设计模式–责任链模式》

<div class="jb51code">
<pre class="brush:js;">
var iteratorUploadObj = function() {
for(var i = 0,fn; fn = arguments[i]; i++) {
var uploadObj = fn();
if(uploadObj !== false) {
return uploadObj;
}
}
};

var uploadObj = iteratorUploadObj(getActiveUploadObj,getFlashUploadObj,getFormUploadObj);

function getActiveUploadObj() {
try{
return new ActiveObject("TXFTNActiveX.FTNUpload"); // IE上传控件
}catch(e) {
return false;
}
}

function getFlashUploadObj() {
if(supportFlash().f === 1) {
var str = '<object type="application/x-shockwave-flash">';
return $(str).appendTo($("body"));
}
return false;
}

function getFormUploadObj() {
var str = '';
return $(str).appendTo($("body"));
}

// 是否支持flash
function supportFlash() {
var hasFlash = 0; //是否安装了flash
var flashVersion = 0; //flash版本
if (document.all) {
var swf = new ActiveXObject('ShockwaveFlash.ShockwaveFlash');
if (swf) {
hasFlash = 1;
VSwf = swf.GetVariable("$version");
flashVersion = parseInt(VSwf.split(" ")[1].split(",")[0]);
}
} else {
if (navigator.plugins && navigator.plugins.length > 0) {
var swf = navigator.plugins["Shockwave Flash"];
if (swf) {
hasFlash = 1;
var words = swf.description.split(" ");
for (var i = 0; i < words.length; ++i) {
if (isNaN(parseInt(words[i]))) continue;
flashVersion = parseInt(words[i]);
}
}
}
}
return { f: hasFlash,v: flashVersion };
}

希望本文所述对大家学习javascript程序设计有所帮助。

猜你在找的JavaScript相关文章