---
# System prepended metadata

title: '陣列資料操作(map,filter,find,findIndex)'
tags: [Javascript]

---

###### tags: `Javascript`

# 陣列資料操作(map,filter,find,findIndex)

---

## map vs forEach
- map:句尾需要return,回傳陣列
- forEach:句尾不需要return，回傳num?
```javascript=
    const arr=[1,5,10];
    const newArr = arr.map(function(item){
        return item*item;
    })
    
    console.log(newArray);
    //1,25,100 
```

## filter 
- 篩選符合條件的內容，並回傳陣列。
```javascript=
    const arr = [1,5,10];
    const newArr = arr.map(function(item){
        return item>=5;
    })
    //[5,10]
```

## find
- 只會捞第一筆符合的資料，不會回傳陣列
```javascript=
    const arr = [1,5,10];
    const newArr = arr.find(function(item){
        return item>=5;
    })
    //5
```

## findIndex

```javascript=
    const colors = ['red','blue','black'];
    
    const blueIndex = colors.findIndex(function(item){
        return item == 'red'
    })
    
    console.log('${colors[blueIndex]}`)
    // 'red'
```