美文网首页让前端飞H5技术栈
数组Array进行原型prototype扩展后带来的for in

数组Array进行原型prototype扩展后带来的for in

作者: 菜菜___ | 来源:发表于2019-12-06 12:08 被阅读0次

    https://blog.csdn.net/m0_37288255/article/details/68065632
    为了方便获取数组下标对Array写了扩展方法,在用for in循环遍历时却出现了问题。
    如下所示:

    /*获取数组元素下标*/
    Array.prototype.getArrayIndexByValue = function (arr) {
        for (var i = 0; i < this.length; i++) {
            if (this[i] == arr) {
                return i;
            }
        }
        return 0;
    }
    
        var array=["物理","历史"]
        var html="";
        for(var i in array){
            html += "<li><i></i>"+array[i]+"</li>";
        }
        document.getElementById("ul").innerHTML = html;
    

    结果如下:


    查阅资料发现有篇文章讲述for in和Array的问题比较清楚

    for-in 循环遍历的是对象的属性,而不是数组的索引。因此, for-in 遍历的对象便不局限于数组,还可以遍历对象。
    for-in 不仅仅遍历 array 自身的属性,其还遍历 array 原型链上的所有可枚举的属性。

    造成上面这样的问题,我们可将for in循环换成普通的for循环,问题就解决啦

    for(var i = 0;i < array.length;i++){
            html += "<li><i></i>"+array[i]+"</li>";
     }
    

    参考文章:深入了解 JavaScript 中的 for 循环

    原文作者技术博客:https://www.jianshu.com/u/ac4daaeecdfe

    相关文章

      网友评论

        本文标题:数组Array进行原型prototype扩展后带来的for in

        本文链接:https://www.haomeiwen.com/subject/awnkgctx.html