JS中數組、對象、對象數組、數組對象的遍歷方法

本文轉載自查看原文 2020-09-22 11:18 2152 JavaScript

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6     </head>
 7     <body>
 8         <!-- 這幾種數據格式都可以用for循環來遍歷，for...of也都可以遍歷絕大多數的數據結構 -->
 9         <script type="text/javascript">
10             let a = [
11                 {
12                     name:'張三',
13                     age:'23',
14                     address:'鄭州'
15                 },
16                 {
17                     name:'李四',
18                     age:'24',
19                     address:'北京'
20                 },
21                 {
22                     name:'王五',
23                     age:'25',
24                     address:'這是數組對象'
25                 },
26             ]
27             
28             for (let item in a) { //打印的item為數組的索引：0、1、2
29                 console.log(item)
30             }
31             for (let item of a) {//等同於上一個的console.log(a[item])
32                 console.log(item)//{name: "張三", age: "23", address: "鄭州"}
33                 for (let key in item) { //遍歷數組中的對象
34                     console.log(item[key])
35                 }
36             }
37             a.forEach(item => { //同上
38                 console.log(item)//{name: "張三", age: "23", address: "鄭州"}
39             })
40             
41             
42             let b = ['b','1',1,2,'這是數組']
43             
44             for (let item in b) { //打印的item為數組的索引：0、1、2、3、4
45                 console.log(item)
46             }
47             for (let item of b) {
48                 console.log(item)
49             }
50             b.forEach(item => {
51                 console.log(item)
52             })
53             
54             let c = {
55                 key:'object',
56                 value:'這是對象'
57             }
58             
59             for (let item in c) {//打印的item為對象的key：key、value
60                 console.log(item)
61             }
62             // c.forEach(item => {//對象不能使用forEach
63             //     console.log(item)
64             // })
65             // for (let item of c.keys()) {//對象不能直接使用of來遍歷
66                 // console.log(item)
67             // }
68             
69             // 需要添加下面這一句話后對象才可以使用of遍歷
70             //或者直接Object.keys()、Object.values()、Object.entries()
71             let {keys, values, entries} = Object
72             
73             for (let item of keys(c)) {
74                 console.log(item)
75             }
76             for (let item of values(c)) {
77                 console.log(item)
78             }
79             for (let item of entries(c)) {
80                 console.log(item)
81             }
82             
83             let d = {
84                 name:[
85                     '張三','李四','王五','這是對象數組'
86                 ],
87                 age:[
88                     20,21,22,23
89                 ]
90             }
91             for (let item of values(d)) {
92                 console.log(item)//獲取到數組
93                 item.forEach(items => {
94                     console.log(items) //遍歷對象中的數組
95                 })
96             }
97         </script>
98     </body>
99 </html>

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 js for in 遍歷對象與數組 js數組遍歷，對象遍歷 js數組遍歷和對象遍歷 js數組遍歷與對象遍歷 JS數組與對象的遍歷方法大全 js 的each()方法遍歷對象和數組 JS數組與對象的遍歷方法大全 js 遍歷對象/數組的幾種方法 js 的each()方法遍歷對象和數組 js中的節點遍歷+類數組對象