1.map forEach

1.map 循环遍历每一项,返回一个新的数组

例: 购物车商品小计:

//购物车
var cart=[
{"id":101,"name":"大米","count":1,"price":3.3,"check":1},
{"id":102,"name":"小米","count":2,"price":3.3,"check":1},
{"id":103,"name":"二米","count":3,"price":3.3,"check":1},
]
//每个购物车中的小计
var cartPrices =cart.map(item=>{
return (item.count*item.price).toFixed(2)
})
console.log(cartPrices);
2.forEach 循环遍历每一项,并不返回值

例:计算商品价格的总和:

//购物车
var cart=[
{"id":101,"name":"大米","count":1,"price":3.3,"check":1},
{"id":102,"name":"小米","count":2,"price":3.3,"check":1},
{"id":103,"name":"二米","count":3,"price":3.3,"check":1},
]
//每个购物车中的小计
var cartPrices = cart.map(item=>{
return (item.count*item.price).toFixed(2)
})
//计算总和
var totalPrice = 0
cartPrices.forEach((item,index)=>{
totalPrice+=parseFloat(item);
})
console.log(totalPrice.toFixed(2));

2.filter 过滤出正确的那一项

例: 显示购物车信息

 //商品ID
var id = 101;//101胶水'.'
//购物车
var cart=[
{"id":101,"name":"大米","count":1,"price":3.3,"check":1},
{"id":102,"name":"小米","count":2,"price":3.3,"check":1},
{"id":103,"name":"二米","count":3,"price":3.3,"check":1},
]
//过滤出该商品信息
var goods = cart.filter(item=>{
return item.id == id;
})
console.log(goods);

3.some 和 every 过滤每一项是否有正确的

1.some 如果有满足条件返回true不在向下执行 ,如果没有满足条件返回false

例: 购物车是否选中

  //商品ID
var id = 101;//101胶水'.'
//购物车
var cart=[
{"id":101,"name":"大米","count":1,"price":3.3,"check":0},
{"id":102,"name":"小米","count":2,"price":3.3,"check":1},
{"id":103,"name":"二米","count":3,"price":3.3,"check":1},
]
//过滤购物车商品是否选中状态
var ischeck = cart.some(item=>{
if(item.id == id){
return item.check;
}
})
console.log(ischeck)
2.every 数组的每一项是否都满足条件返回true,否则返回false

例:购物车商品是否全选状态

//商品ID
var id = 101;//101胶水'.'
//购物车
var cart=[
{"id":101,"name":"大米","count":1,"price":3.3,"check":1},
{"id":102,"name":"小米","count":2,"price":3.3,"check":0},
{"id":103,"name":"二米","count":3,"price":3.3,"check":1},
]
//过滤购物车商品是否选中状态
var isallcheck = cart.every(item=>{
return item.check;
})
console.log(isallcheck)

javascript map forEach filter some every在购物车中的实战演练区分用法的更多相关文章

  1. js数组遍历(for in ,for of ,map,foreach,filter)的区别

    一.for in 和for of 的区别 1.for in 遍历数组时,索引实际上是字符串类型的数字,不能进行运算,我们来输出一下: let arr = [1,3,5,4] for (let inde ...

  2. javascript中some,every,map,filter是只用和ansyc中的each,eachLimit,map,mapLImit,filter的使用

    var t = [1,2,3,4,5]; //some找到数组中第一个符合要求的值后就不在继续执行//用来判断数组中是否存符合要求的值,返回结果true|false//function返回类型为boo ...

  3. javaScript 的 map() reduce() foreach() filter()

    map(映射), reduce(规约), forEach(遍历), filter(过滤),它们都是高阶函数,都是以传入不同的函数来以不同的方式操作数组元.ie都不支持 一.map方法 *概述 map( ...

  4. JavaScript数组方法的兼容性写法 汇总:indexOf()、forEach()、map()、filter()、some()、every()

    ECMA Script5中数组方法如indexOf().forEach().map().filter().some()并不支持IE6-8,但是国内依然有一大部分用户使用IE6-8,而以上数组方法又确实 ...

  5. forEach、map、filter、find、sort、some等易错点整理

    一.常用方法解析   说起数组操作,我们肯定第一反应就是想到forEach().map().filter()等方法,下面分别阐述一下各方法的优劣. 1.forEach 1.1 基础点   forEac ...

  6. [Javascript] Chaining the Array map and filter methods

    Both map and filter do not modify the array. Instead they return a new array of the results. Because ...

  7. every();some();filter();map();forEach()各自区别:

    every();some();filter();map();forEach()各自区别: (1)every()方法:(返回值为boolean类型) 对数组每一项都执行测试函数,知道获得对指定的函数返回 ...

  8. ES6 数组遍历方法的实战用法总结(forEach,every,some,map,filter,reduce,reduceRight,indexOf,lastIndexOf)

    目录 forEach every some map filter reduce && reduceRight indexOf lastIndexOf 前言 ES6原生语法中提供了非常多 ...

  9. forEach、map、filter、reduce的区别

    1.相同点: 都会循环遍历数组中的每一项: map().forEach()和filter()方法里每次执行匿名函数都支持3个参数,参数分别是:当前元素.当前元素的索引.当前元素所属的数组: 匿名函数中 ...

随机推荐

  1. Proxy --支持的拦截操作篇

    下面是 Proxy 支持的拦截操作一览. 对于可以设置.但没有设置拦截的操作,则直接落在目标对象上,按照原先的方式产生结果. (1)get(target, propKey, receiver) 拦截对 ...

  2. Opencv-Python 图像透视变换cv2.warpPerspective

    # -*- coding:utf-8 -*- import cv2 import numpy as np import sys img = cv2.imread('test.jpg') # cv2.i ...

  3. 调整Windows XP 输入法顺序

    執行 Regedit.exe 至 HKEY_CURRENT_USER\Keyboard Layout\Preload 調整輸入法順序,右邊欄中名稱為 1 的鍵值就是內定的輸入法,其值一般為 00000 ...

  4. c++字符串前几位,后几位的截取

    参考 1. https://blog.csdn.net/haijunsm/article/details/82733584 完

  5. [LeetCode&Python] Problem 447. Number of Boomerangs

    Given n points in the plane that are all pairwise distinct, a "boomerang" is a tuple of po ...

  6. Gym 101655:2013Pacific Northwest Regional Contest(寒假自训第13场)

    A .Assignments 题意:给定距离D,以及N个飞机的速度Vi,单位时间耗油量Fi,总油量Ci.问有多少飞机可以到达目的地. 思路:即问多少飞机满足(Ci/Fi)*Vi>=D  ---- ...

  7. NYOJ 6:喷水装置(一)(贪心)

    6-喷水装置(一) 内存限制:64MB 时间限制:3000ms 特判: No 通过数:68 提交数:111 难度:3 题目描述: 现有一块草坪,长为20米,宽为2米,要在横中心线上放置半径为Ri的喷水 ...

  8. 回收机制GC

    .NET 之 垃圾回收机制GC 一.GC的必要性 1.应用程序对资源操作,通常简单分为以下几个步骤:为对应的资源分配内存 → 初始化内存 → 使用资源 → 清理资源 → 释放内存. 2.应用程序对资源 ...

  9. 数学 它的内容,方法和意义 第三卷 (A. D. 亚历山大洛夫 著)

    第十五章 实变数函数论 1. 绪论 2. 集合论 3. 实数 4. 点集 5. 集合的测度 6. 勒贝格积分 第十六章 线性代数 1. 线性代数的对象和它的工具 2. 线性空间 3. 线性方程组 4. ...

  10. day9大纲

    01 作业内容回顾 函数的初识: 封装一个功能. def 函数名(): 函数体 函数的返回值:return 1,结束函数. 2,返回给执行者(函数名())值. return ----> None ...