vue中常见的js函数

数组常见函数

list.reduce()

(归并)遍历数组, 每次循环时执行传入的回调函数,回调函数会返回一个值,将该值作为初始值sum,传入到下一次函数中
假设求items中的价格总和:

list.reduce((sum,item)=>{
	return sum+item.price
},0)

参数说明:sum 为得到的价值总和,item为迭代的商品,0为sum的起始值

list.map()

将数组对象中的对象变成一个选择参数的新数组
假设原数组为:

[
        {
            "id": 88742176,
            "name": "联想Y9000p",
            "price": 8700,
            "creator": "wtf"
        },
        {
            "id": 88742106,
            "name": "狼蛛f87pro",
            "price": 249,
            "creator": "wtf"
        },
        {
            "id": 88742105,
            "name": "Redmi k70 至尊版",
            "price": 2599,
            "creator": "wtf"
        },
        {
            "id": 88742104,
            "name": "衬衫",
            "price": 200,
            "creator": "wtf"
        },
        {
            "id": 88742103,
            "name": "篮球",
            "price": 100,
            "creator": "wtf"
        }
]

通过该例子

list.map(item => ({ value: item.price, name: item.name }))

数组转换为

[
{"value":8700,"name":"联想Y9000p"},
{"value":249,"name":"狼蛛f87pro"},
{"value":2599,"name":"Redmi k70 至尊版"},
{"value":200,"name":"衬衫"},
{"value":100,"name":"篮球"}
] 

list.unshift()

（在开头)向数组添加一或多个元素 ,改变原数组

list.unshift({"value":100,"name":"篮球"})

list.push()

（在结尾)向数组添加一或多个元素 ,改变原数组

list.push({"value":100,"name":"篮球"})

list.find()

功能: 遍历数组 每次循环 执行回调函数,回调函数接受一个条件 返回满足条件的第一个元素,不存在则返回undefined
参数
item:必须 , 循环当前元素
index:可选 , 循环当前下标
array:可选 , 当前元素所属的数组对象
例如:通过id查找item

list.find(item=>item.id===id)

list.every()

功能: 遍历数组, 每次循环时执行传入的回调函数,回调函数返回一个条件,全都满足返回true 只要有一个不满足 返回false => 判断数组中所有的元素是否满足某个条件
例如:判断成绩是否都大于60

flag = list.every(item => item>=60)

相当于

list.every(function(item){
	return item>=60
})

list.filter()

功能: 遍历数组, 每次循环时执行传入的回调函数,回调函数返回一个条件,把满足条件的元素筛选出来放到新数组中,不改变原来的数组.
例如,通过id删除数组中的元素

this.list = list.filter(item=> item.id != id)

相当于

this.list = list.filter(function(item){
	return item.id != id
})

list.forEach()

功能: 遍历数组,每次循环中执行传入的回调函数 。(注意: forEach() 对于空数组是不会执行回调函数的。) 没有返回值,或理解为返回值为undefined,不改变原数组.
例如:
将所有的isChecked值改成value值

this.fruitList.forEach(item => item.isChecked = value)