ES6 数组some()和every()的使用及说明

 更新时间:2023年01月16日 09:54:36   作者:周家大小姐.  
这篇文章主要介绍了ES6 数组some()和every()的使用及说明,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

ES6 数组some()和every()使用

some 英语翻译为一些,every翻译为所有,每个,所以some方法 只要其中一个为true 就会返回true的,相反,every()方法必须所有都返回true才会返回true,哪怕有一个false,就会返回false;

every()和 some()目的:确定数组的所有成员是否满足指定的测试

  • every:一假即假
  • some:一真即真 
/** 
 * 计算对象数组中每个电脑的扣件系统是否可用,大于16位操作系统表示可用,否则不可用
*/
var computers = [
    {name:"Apple",ram:8},
    {name:"IBM",ram:4},
    {name:"Acer",ram:32},
];
 var result= computers.every(function(computer){
   return computer.ram > 16
})
console.log(result)//false;
var some = computers.some(function(computer){
   return computer.ram > 16
})
console.log(some)//true;
/**
 * 假定有一个注册页面,判断所有Input内容的长度是否大于0
 * 
 */
function Field(value){
    this.value = value
}
// 在原型上定义方法
Field.prototype.validate = function(){
    return this.value.length > 0;
}
var username = new Field('2131');
var telephone  = new Field('8888888888888')
console.log(username.validate() && telephone.validate())//true
 
 
//二`:
var username = new Field('2131');
var telephone  = new Field('8888888888888')
let password  = new Field('');
//console.log(username.validate() && telephone.validate())//只要一个为空就为false
// 简化方式
var fields = [username, telephone,password];
console.log(fields)
var formIsValid = fields.every(function(field){
    return field.validate()
});
console.log(formIsValid)
 
if(formIsValid){
    //注册成功
}else{
    //给用户一个错误提醒
}

ES6数组新增方法

ES6数组新增的一些常用的方法

  • forEach
  • map
  • filter
  • some
  • every
  • find
  • findIndex
  • findLast
  • findLastIndex
  • reduce

以上这些方法,用法都一样,效果不同

arr.方法名((item,index,arr)=>{
})

1. forEach

此方法是用来代替 for 循环遍历数组

let arr=[1,2,3,4];
arr.forEach(function(value,index,arr){
//在这里进行相关操作
})

2.map

返回值是一个新的 数组,数组长度和原数组相同,数组中的值,就是函数中的返回值。

let potatos = [
  { id: '1001', weight: 50 },
  { id: '1002', weight: 80 },
  { id: '1003', weight: 120 },
  { id: '1004', weight: 40 },
  { id: '1005', weight: 110 },
  { id: '1006', weight: 60 }
]
  let w = potatos.map(function(potato) {
        return potato.weight
    })
 //在这里,potato.weight就是函数的返回值

3.filter

此方法是依次拿出数组中的元素,返回符合要求的元素。返回值是一个新的数组,数组中的值是符合条件的值,而这个条件是函数的返回值。

let potatos = [
  { id: '1001', weight: 50 },
  { id: '1002', weight: 80 },
  { id: '1003', weight: 120 },
  { id: '1004', weight: 40 },
  { id: '1005', weight: 110 },
  { id: '1006', weight: 60 }
]
let bigPotatos=potatos.filter(potato=>potato.weight>=100)
//potato.weight>=100 就是返回值,为布尔值,如果为true,则当前遍历到potato就会作为新数组中的值

4.some

此方法返回值是布尔值,判断数组中是否有符合条件的值,而这个条件是函数的返回值

let potatos = [
  { id: '1001', weight: 50 },
  { id: '1002', weight: 80 },
  { id: '1003', weight: 120 },
  { id: '1004', weight: 40 },
  { id: '1005', weight: 110 },
  { id: '1006', weight: 60 }
]

let hasBig = potatos.some(potato => potato.weight >= 100)
// 只要返回值为true,则内部停止遍历,some返回值true,如果每次都返回false,则some返回值为false

5.every

返回值是布尔值,判断数组中的值是否都符合条件,如果是则返回true,有一个不符合则返回false

let potatos = [
  { id: '1001', weight: 50 },
  { id: '1002', weight: 80 },
  { id: '1003', weight: 120 },
  { id: '1004', weight: 40 },
  { id: '1005', weight: 110 },
  { id: '1006', weight: 60 }
]

let hasBig = potatos.every(potato => potato.weight >= 100)
// 只要所有返回值为true,则every返回true,如果由一次返回false,则every返回值为false

6.find 、findLast

返回值为符合条件的对应的那个值

后者从后往前遍历

let potatos = [
  { id: '1001', weight: 50 },
  { id: '1002', weight: 80 },
  { id: '1003', weight: 120 },
  { id: '1004', weight: 40 },
  { id: '1005', weight: 110 },
  { id: '1006', weight: 60 }
]

let bigPotato = potatos.find(potato => potato.weight >= 100) 
// 得到第一个符合条件的数据,返回给变量

7.findIndex 、findLastIndex

返回值为符合条件的对应的那个值的下标

后者从后往前遍历

let potatos = [
  { id: '1001', weight: 50 },
  { id: '1002', weight: 80 },
  { id: '1003', weight: 120 },
  { id: '1004', weight: 40 },
  { id: '1005', weight: 110 },
  { id: '1006', weight: 60 }
]

let bigPotato = potatos.findIndex(potato => potato.weight >= 100) 
// 得到第一个符合条件的数据的下标,返回给变量

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

您可能感兴趣的文章:

相关文章

  • 原生JS查找元素的方法(推荐)

    原生JS查找元素的方法(推荐)

    下面小编就为大家带来一篇原生JS查找元素的方法(推荐)。小编觉得挺不错的,希望对大家有所帮助。一起跟随小编过来看看吧,祝大家游戏愉快哦
    2016-11-11
  • js实现同一页面多个运动效果的方法

    js实现同一页面多个运动效果的方法

    这篇文章主要介绍了js实现同一页面多个运动效果的方法,涉及javascript操作页面元素运动效果的技巧,非常具有实用价值,需要的朋友可以参考下
    2015-04-04
  • js url传值中文乱码之解决之道

    js url传值中文乱码之解决之道

    因为js url在传值的过程中使用的是js自己默认的字符集编码规则,我们必须把它转成属于我们自己的编码规格
    2009-11-11
  • Web纯前端“旭日图”实现元素周期表

    Web纯前端“旭日图”实现元素周期表

    本文主要介绍了Web纯前端“旭日图”实现元素周期表的实例解析。具有很好的参考价值。下面跟着小编一起来看下吧
    2017-03-03
  • JS实现盒子跟着鼠标移动及键盘方向键控制盒子移动效果示例

    JS实现盒子跟着鼠标移动及键盘方向键控制盒子移动效果示例

    这篇文章主要介绍了JS实现盒子跟着鼠标移动及键盘方向键控制盒子移动效果,涉及javascript事件响应及页面元素属性动态操作相关实现技巧,需要的朋友可以参考下
    2019-01-01
  • JS中的form.submit()不能提交表单的错误原因

    JS中的form.submit()不能提交表单的错误原因

    这篇文章主要介绍了JS中的form.submit()不能提交表单的错误原因,本文最后得出结论是按钮的ID、名称不要使用submit,需要的朋友可以参考下
    2014-10-10
  • JavaScript实现鼠标经过显示下拉框

    JavaScript实现鼠标经过显示下拉框

    这篇文章主要为大家详细介绍了JavaScript实现鼠标经过显示下拉框,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-04-04
  • Javascript函数的参数

    Javascript函数的参数

    本文给大家分享的是网易云课堂中金旭亮老师的课堂笔记,对于大家学习javascript非常有帮助,这里推荐给小伙伴们
    2015-07-07
  • uniapp基础篇之上传图片的实战步骤

    uniapp基础篇之上传图片的实战步骤

    应用uni-app开发跨平台App项目时,上传图片、文档等资源功能需求十分常见,下面这篇文章主要给大家介绍了关于uniapp基础篇之上传图片的相关资料,需要的朋友可以参考下
    2022-12-12
  • javascript汉字拼音互转的简单实例

    javascript汉字拼音互转的简单实例

    下面小编就为大家带来一篇javascript汉字拼音互转的简单实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-10-10

最新评论