vue 遍历数组

1.forEach(): 遍历数组

需要一个回调函数作为参数

回调函数的形参: ①. value: 遍历数组的内容 ②.index: 对应数组的索引 ③.array: 数组本身

forEach() 方法主要是用于调用数组的每个元素，并将元素传递给回调函数。

注:对于空数组不会执行回调函数

语法:

array.forEach(function(currentValue, index, array), thisValue)

例子: ①. 没有返回值

var a = [1,2,3,4,5]
var b = a.forEach((item) => {
    item = item * 2
})
console.log(b)
// undefined

②.原数组不会改变

2. map(): 有返回值,返回一个新的数组

①. 返回一个经过处理的新数组,但不改变原数组的值

var a = [1,2,3,4,5]
var b = a.map((item) => {
    return item = item * 2
})
console.log("a--:", a)
console.log("--b-:", b)

 ②. 重新构建数据 (一般适用于接口给你返回的数组格式和想呈现的数据格式不一样)

let arr = res.data;

   let newArr = arr.map(val => {

      let json = {};

         json.date = val.split('-').join('-');

         json.title = '';

        return json;

this.demoEvents = newArr; 

//重新构建出来的数据格式为{value: "",title: ""}

③. 在vue中的应用

例如: 充值金额需要在整数的基础上随机减去100或者加上100

export default {
    data() {
        moneyList: [1000,2000,5000,10000,20000,50000]
    },
    computed: {
        moneyList_new() {
            return this.moneyList.map((item) => {
                const random = Math.random() > 0.5 ? 1 : -1;
                return Math.floor(Math.random()*100) * random + item;
            })
        }
    }
}

//  实际渲染处理过的数组