【数组】常用方法小结 ...待补充数组方法总结基础方法push()向数组末尾添加一个元素语法：数组.push(你要添加的

数组方法总结

基础方法

push() 向数组末尾添加一个元素
- 语法：数组.push(你要添加的数据)
- 直接改变原始数组
- 返回值：新数组的长度
pop() 从数组末尾删除一个元素
- 语法：数组.pop()
- 直接改变原数组
- 返回值：被删除掉的那个元素
unshift() 向数组头部添加一个元素
- 语法：数组.unshift(你要添加的数据)
- 直接改变原数组
- 返回值：新数组的长度
shift() 从数组头部删除一个元素
- 语法：数组.shift()
- 直接改变原数组
- 返回值：被删除掉的那个元素

-------------以上最基础的4个方法

concat() 对数组进行拼接
- 语法：数组1.concat(数组2,数组3...)
- 不改变原数组
- 返回值：拼接后的新数组
splice() 对数组进行截取
- 语法：数组.splice(开始的索引,截取多少个,使用什么替换)
- eg: let tmp = arr.splice(1,1,'11','22','33')
- 改变原数组
- 返回值：被替换掉的内容
reverse() 反转数组
- 语法：数组.reverse()
- 直接改变原始数组
- 返回值：反转后的数组
sort() 数组排序
- 直接改变原始数组
- 返回值：排序好的数组
- 第一种：语法：数组.sort()
- 第二种：语法：数组.sort( function(a,b){ return a - b}) 升序
slice() 截取数组
- 语法：数组.slice(开始的索引，结束的索引)
- 特点：包前不包后
- 不改变原数组
- 返回值：截取出的数组
- eg: slice(1) //第二个参数不写，表示截取到末尾

注：slice(1,-1) 的含义===> arr.slice(1,arr.length-1)

join() 把数组连接成字符串
- 语法：数组.join(用来连接的字符) 默认值是 ','
- 不改变原数组
- 返回值：连接起来的字符串
- eg: arr.join('**') arr.join() ==> arr.join(',')

拓展方法 [注：以下方法对于空数组不会执行]

indexOf() 查看数组中是否有该内容
- 语法：数组.indexOf(你要查找的内容，你要从哪个索引开始查找)
- 不改变原始数组
- 返回值：找到了就返回该内容的索引（只找第一个），没找到返回 -1
forEach() 用来遍历数组 es5 对 for循环的拓展
- 语法：数组.forEach((item,index,arr)=>{})
- 不改变原数组
- 没有返回值
map() 用来映射数组
- 对原始数组中的每一项进行操作，return 的项放入返回的新的数组中
- 语法：数组.map((item,index,arr)=>{ return 对item进行操作的结果})
- 不改变原始数组
- 返回值：是一个新数组
```
const arr = [1,2,3,4]
const tmp = arr.map (item=> item*100)
console.log(tmp)  // [100,200,300,400]
```
filter() 过滤数组
- 对原始数组进行筛选，把符合条件的拿出来放到一个新的数组中
- 语法：数组.filter( (item,index,arr)=>{ return 条件判断 })
- 不改变原始数组
- 返回值：新的数组
```
const arr = [1,2,3,4]
const tmp = arr.filter(item=>item>2)
console.log(tmp)  // [3,4]
```
some()
- 对原始数组进行遍历，只要有一项满足给的条件，就返回 true，如果都不满足，就返回 false
- 语法：数组.some((item,index,arr)=>{return 判断条件})
- 不改变原始数组
- 返回值： true/false
```
const arr=[1,2,3,4]
const tmp = arr.some(item=>item>4)
console.log(tmp)  // true
```
every()
- 对原始数组进行遍历，只有每一项都满足给的条件的时候才会返回 true，只要有一项不满足就是false
- 语法：数组.every((item,index,arr)=>{ return 判断条件})
- 不改变原始数组
- 返回值：true/false
```
const arr=[1,2,3,4]
const tmp = arr.every(item=>item>4)
console.log(tmp)  // false
```
find()
- 查找数组中符合条件的第一项并返回，没找到就是 undefined
- 语法：数组.find((item,index,arr)=>{ return 条件})
- 不改变原数组
findIndex()
- 同 find ，返回的是索引

reduce()

array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

const arr = [1,2,3,4,5]
const tmp = arr.reduce((total,item)=>total+item,0)
console.log(tmp) // 0+1+2+3+4+5 ==> 15

练习题

/*
描述： 购物车案例 
需求： 根据cartList 展示购物车商品的 名称 价格 和 数量
 [{id:1,title:'iphone 11',price: 800,quantity:2},...]

*/
// 商品数组
const products = [
  {id: 1,title:'iphone 11',price: 800,inventory:10},
  {id: 2,title:'iphone 11 pro',price: 1000,inventory:10},
  {id: 3,title:'iphone 11 max',price: 1200,inventory:10},
]
// 购物车数组
const cartList = [
  {id: 1,quantity: 2},
  {id: 2,quantity: 1},
  {id: 3,quantity: 1}
]

// 答案： 
const tmp = cartList.map(({ id, quantity }) => {
    const product = products.find(v => v.id === id)
    return {
        id,
        title: product.title,
        price: product.price,
        quantity
    }
})
console.log(tmp)