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. 日期和API

    Java1.0对日期和时间的支持只能依赖java.util.Date类,年份的起始选择是1900你那,月份的起始是从0开始计算的.它的返回值中包含了JVM的默认市区CET,即中欧时间.在Java1.1 ...

  2. npm 包管理器的使用

    1. 权限问题 Warning "root" does not have permission to access the dev dir · Issue #454 · nodej ...

  3. php操作mysql几个常用操作

    1.链接数据库 mysql_connet('数据库地址','数据库账号','数据库密码'); 2.选择数据库 mysql_select_db("数据库名"); 3.设置编码 mys ...

  4. pandas Dataframe 构造

  5. JavaBasic_09

    方法的参数传递 方法调用时参数值的传递可以分为"值传递"和"引用传递"两种 值传递 - a.当方法的参数为基本数据类型时 b.实参的值被复制给形参,改变形参不会 ...

  6. 异步测试celery

    django异步请求: Django从一个http请求发起,到获得响应返回html页面的流程大致如下:http请求发起 -- http handling(request解析) -- url mappi ...

  7. (4)django的新手三件套(返回页面、返回字符、重定向)

    from django.shortcuts import render,HttpResponse,redirect 新手三件套,前期开发都会用到 render   #向浏览器返回页面 HttpResp ...

  8. LeetCode - Top K Frequent Words

    Given a non-empty list of words, return the k most frequent elements. Your answer should be sorted b ...

  9. 使用Maven插件启动tomcat服务

    新建maven web项目,首先保证maven环境OK,maven项目能正常install1.pom.xml文件配置如下: <build> <pluginManagement> ...

  10. JDBC事务的处理-----模拟银行转账业务

    定义: 数据库事务(简称:事务)是数据库管理系统执行过程中的一个逻辑单位,由一个有限的数据库操作序列构成. 概要: 一个数据库事务通常包含了一个序列的对数据库的读/写操作.它的存在包含有以下两个目的: ...