js遍历数组、对象，方法总结

最新推荐文章于 2023-06-03 18:43:29 发布

一月清辉

最新推荐文章于 2023-06-03 18:43:29 发布

阅读量995

点赞数

分类专栏： javascript 文章标签：遍历数组遍历对象 es6

本文链接：https://blog.csdn.net/yiyueqinghui/article/details/86499964

版权

javascript 专栏收录该内容

134 篇文章 15 订阅

订阅专栏

遍历数组

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>js遍历数组</title>
</head>
<style>
    ul li{
        margin: 20px 0;
    }
</style>
<body>
    <ul>
        <li>
            1、使用forEach遍历
        </li>
        <li>
            2、使用for..in..遍历
        </li>
        <li>
            3、使用for-of遍历
            支持  数组，
            支持  类数组对象，例如DOM NodeList对象.
            支持  字符串遍历，(它将字符串视为一系列的Unicode字符来进行遍历).
        </li>
        <li>
            4.  for(var i=0;i<arr.length;i++){}
        </li>
    </ul>
</body>
<script>
    let arr = ['a','b',533];
    //1、使用forEach遍历
    arr.forEach((val,index)=>{
        console.log(index,val);
    })
    console.log('forEach ----------end')


    //2、使用for..in..遍历
    for(let i in arr){
        console.log(i,arr[i]);
    }
    console.log('for..in..----------end')


    //3、for..of.. 遍历
    for(var val of arr){
        console.log(val);
    }
    console.log('for..of..----------end')
</script>
</html>

遍历对象

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>javascript 遍历对象</title>
</head>
<style>
    ul li{
        margin: 20px 0;
    }
</style>
<body>
    <ul>
        <li>
            1、使用Object.keys()遍历<br/>
            返回一个数组。先通过Object.keys()获取对象的键的集合数组，再通过forEach遍历数组，依此获取键，再通过键，依此获取对象的值
            (不含Symbol属性)(不含不可枚举属性)(不含可继承的属性)
        </li>
        <li>
            2、使用for..in..遍历<br/>
            循环遍历对象自身的和继承的可枚举属性(不含Symbol属性)(不含不可枚举属性)(包含继承的属性).
        </li>
        <li>
            3、使用Object.getOwnPropertyNames(obj)遍历 <br/>
            返回一个数组,包含对象自身的所有属性(不含Symbol属性）(包含不可枚举属性)(不含继承的属性).
        </li>
        <li>
            4、使用Reflect.ownKeys(obj)遍历<br/>
            返回一个数组,包含对象自身的所有属性,(包含Symbol属性）(包含不可枚举属性)(不含继承的属性)
        </li>
    </ul>

</body>
<script>
    function Person(){
        this.name = 'duzuiliunian';
        this.hellow = function () {
            console.log('hellow');
        }
    }
    Person.prototype.say = function(){     //继承属性
        alert('继承属性值');
    }
    let obj = new Person();
    obj[Symbol('h')] = 'Symbol属性值';            //Symbol属性

    Object.defineProperty(obj,'weight',{
         value:'不可枚举属性值',
         enumerable:false                    //不可枚举
    })



    //1、使用Object.keys()遍历,返回所有可枚举的键的数组(不含继承的)(不含Symbol属性)
    Object.keys(obj).forEach((key,index)=>{
        console.log(index,key,obj[key]);
    })
    console.log('1.-----------------end')


    //2、使用for..in..遍历
    for(let i in obj){
        console.log(i,obj[i]);
    }
    console.log('2.-----------------end')


    //3、使用Object.getOwnPropertyNames(obj)遍历
    Object.getOwnPropertyNames(obj).forEach((key)=>{
        console.log(key,obj[key]);
    })
    console.log('3.-----------------end')


    //4、Reflect.ownKeys(obj)遍历
    Reflect.ownKeys(obj).forEach((key)=>{
        console.log(key,obj[key]);
    })
    console.log('4.-----------------end')


</script>
</html>

一月清辉

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
js遍历数组、对象，方法总结

js遍历数组、对象，方法总结遍历数组&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html lang=&quot;en&quot;&amp;gt;&amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;lt;title&amp;gt;js遍历数组&amp
复制链接

扫一扫

专栏目录