Heim > Web-Frontend > js-Tutorial > javascript forEach通用循环遍历方法_javascript技巧

javascript forEach通用循环遍历方法_javascript技巧

WBOY
Freigeben: 2016-05-16 18:18:48
Original
992 Leute haben es durchsucht
复制代码 代码如下:

var forEach = (function(){
//数组与伪数组的遍历
var _Array_forEach = function (array, block, context) {
if (array == null) return;
//对String进行特殊处理
if(typeof array == 'string'){
array = array.split('');
}
var i = 0,length = array.length;
for (;i };
//对象的遍历
var _Function_forEach = function (object, block, context) {
for (var key in object) {
//只遍历本地属性
if (object.hasOwnProperty(key)&&block.call(context, object[key], key, object)===false){
break;
}
}
};
return function(object, block, context){
if (object == null) return;
if (typeof object.length == "number") {
_Array_forEach(object, block, context);
}else{
_Function_forEach(object, block, context);
}
};
})()

函数本身并不复杂,但很精巧。加了一些简单的注释,想信大家能看懂。
来看一点例子
复制代码 代码如下:

//1:1 \n 2:2
forEach([1,2,3,4,5],function(el,index){
if(index>2){
return false;
}
alert(index+":"+el);
});
function print(el,index){
alert(index+":"+el);
}
//a:a \n b:b \n c:c
forEach({a:'a',b:'b',c:'c'},print);
//1:笨 \n 2:蛋 \n 3:的 \n 4:座 \n 5:右 \n 6:铭
forEach("笨蛋的座右铭",print);
function Person(name, age) {
this.name = name || "";
this.age = age || 0;
};
Person.prototype = new Person;
var fred = new Person("jxl", 22);
fred.language = "chinese";//极晚绑定
//name:jxl \n age:22 \n language:chinese
forEach(fred,print);

注:回调函数中的index参数下标从1开始
为什么不用内置的forEach
和getElementsByClassName一样,内置的forEach效率很高,但是在功能上有局限性,它无法在循环中途退出。而在我们这个forEach中,它可以在处理函数内通过返回false的方式退出循环,更加的灵活。
特别的length属性
length属性是一个很特别的属性,看到数组,大家一定会想到length,那看到带有length属性的对象呢?那大家一定要想到伪数组(类数组)。那什么是伪数组呢?简单的理解就是能通过Array.prototype.slice转换为真正的数组的带有length属性的对象。javascript最为著名的伪数组就是arguments对象。关于伪数组有很多东西,以后我会专门写一篇博文讲这个东西。大家只要记住:不要随便给对象赋予length属性,除非你明确的知道,你准备把它当作伪数组来使用。
我想这个函数是一个简单javascript工具库中的必备函数,它是金字塔的根基,在它的基础上,进行再封装,可以让你的库更强大,更加美丽!
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage