forEach方法(原生js学习)

forEach方法(原生js学习)

分类: 原生js学习 949人阅读 评论(0) 收藏 举报

作用就是为数组的每一项元素,都执行一次传入的函数。

传入的函数可带三个参数,依次为item,index和arr,这个顺序严格不能变换。item指代数组的元素,index指代数组元素的序列,arr指代数组本身。

var arr=[{ name:"cute" },{name:"murphy"},{name:"cool"}];

arr.forEach(function(item,index,arr){
        console.log(item,index,arr);

});

forEach(fun,obj)还可传入一个obj对象,用于指定fun函数中this的指向。

模拟forEach:

Array.prototype.forEach=function(fun,context){
            var len=this.length;
            var context=arguments[1];     //即使为undefined,call函数也正常运行。
            if(typeof fun !=="function"){
                throw "输入正确函数!";
            }
            for(var i=0;i<len;i++){
                fun.call(context,this[i],i,this);
            }
 };
var arr=[5,6,7];
arr.forEach(function(item,index,arr){
console.log(item,index,arr);
});

以前一直疑惑,在形参里写好的参数,函数体为什么就能马上使用,类似的还有事件对象e(ajax完毕的形参data),这个e到底哪来的,仿佛天生就在形参里,然后可以调e.type,e.target各种。原来之所以可以用这个函数里头的形参,是因为该函数本身是传到另一个函数里执行的,在另一个函数会给该函数形参传值并立刻执行,于是该函数就可打印出所有形参。

然后

<p id="f">1</p>

document.getElementById("f").onclick=function(e){

console.log(e.type);

}

console.log(typeof document.getElementById("f").click);    // function

由此我们发现,之所以我们能调e.type,其实是

function(e){  console.log(e.type); }这个函数传入click函数去执行,然后click函数将前一个函数的e形参赋了具体的值,所以最后我们可以调e.type/target等值,当然click函数的具体实现不得而知。


展开阅读全文

没有更多推荐了,返回首页