Js陣列物件迴圈遍歷總結

2021-10-23 15:33:03 字數 3297 閱讀 7798

let treelist =

;//treelist = res.data.map(item => item.id); //map返回item.id

treelist = res.data.

foreach

(item => item.id)

;//foreach不返回item.id,只列印

treelist = res.data.

foreach

(item =>);

console.

log(treelist)

;

一、物件的遍歷

物件屬性的遍歷,方法有以下幾種

1.for…in

2.object.keys()

3.object.getownpropertynames()

小結1.for…in 遍歷的是物件的可列舉屬性,包括原型

2.object.keys 遍歷的是物件可列舉屬性,不包括原型

3.object.getownpropertnames 遍歷的是物件的所有屬性,不包括原型

二、陣列的遍歷

(一)陣列項的全部遍歷,方法有以下幾種

1.for 迴圈

var array =[1

,4,7

,9]for

(let i =

0, len = array.length; i < len; i++))

//輸出

0 is a

1 is b

2 is c

3.map() 方法 (es5)

var array =

['a'

,'b'

,'c'

]var result = array.

map(

function

(item, index, array)

)console.

log(result)

// 輸出["a0", "b1", "c2"]

4.for…of (es6)

var array =

['a'

,'b'

,'c'

]for

(let item of array)

5.for…in (特殊方式)

var array =

['a'

,'b'

,'c'

]// for...in遍歷的是物件屬性,陣列中的索引就相當於物件的屬性,因此列舉出來的是索引

for(

let index in array)

(二)陣列項的有操作的遍歷,方法有以下幾種

1.filter() 方法 (es5)

function

geteven

(item, index, array)

var array =[1

,2,3

,5,8

]var evenarray = array.

filter

(geteven)

console.

log(evenarray)

// 輸出 [2, 8]

2.every() 方法 (es5)

var array =[1

,2,3

,5,8

]// 判斷是否每個元素都小於3

var result = array.

every

(function

(item, index, array)

)console.

log(

'result: '

+ result)

3.some() 方法 (es5)

var array =[1

,2,3

,5,8

]// 判斷是否存在小於3的元素

var result = array.

some

(function

(item, index, array)

)console.

log(

'result: '

+ result)

4.reduce() 方法 (es5)

function

add(prev, cur, index, array)

var array =[1

,2,3

,5,8

]var sum = array.

reduce

(add)

var sumwithbase = array.

reduce

(add,

100)

// 提供初始值

console.

log(sum, sumwithbase)

// 輸出 19 119

5.reduceright() 方法 (es5)

function

sub(prev, cur, index, array)

var array =[1

,2,3

,5,8

]var leftsub = array.

reduce

(sub)

// 1-2-3-5-8 = -17

var rightsub = array.

reduceright

(sub)

// 8-5-3-2-1 = -3

console.

log(leftsub, rightsub)

// 輸出 -17 -3

小結

除了reduce, reduceright之外,各高階遍歷函式(foreach, map, filter, every, some)的處理函式的引數順序都是item, index, array。reduce, reduceright因為聚合的原因,前兩個引數是陣列的項。

這好理解,我們最需要的首先是陣列的項,其次是它的索引,最後是陣列自身引用

2個聚合函式reduce, reduceright;2個檢測函式every, some;3個全遍歷函式foreach, map, filter。

三、迴圈

1.find(es6) 迴圈 (返回第乙個找到的元素) include \find\findindex

2.while 迴圈

3.do while 迴圈

JS遍歷物件和陣列總結

1 使用object.keys 遍歷 返回乙個陣列,包括物件自身的 不含繼承的 所有可列舉屬性 不含symbol屬性 2 使用for.in.遍歷 迴圈遍歷物件自身的和繼承的可列舉屬性 不含symbol屬性 3 使用object.getownpropertynames obj 遍歷 返回乙個陣列,包含...

js 陣列遍歷 物件遍歷

一 陣列遍歷 1,普通for迴圈,經常用的陣列遍歷 var arr 1,2,0,3,9 for var i 0 i 2,優化版for迴圈 使用變數,將長度快取起來,避免重複獲取長度,陣列很大時優化效果明顯 for var j 0,len arr.length j len j 3,foreach,es...

js陣列遍歷和物件遍歷

1.普通for迴圈var arr 1,2,3,4,5,6 for var i 0 i length i 2.優化版for迴圈 使用變數,將長度快取起來,避免重複獲取長度,陣列很大時優化效果明顯for var j 0 len arr.length j j 3.foreach,es5推出的,陣列自帶的迴...