掌握
Array
的内置方法,完全可以不写 for 循环,解决各种业务场景
Array.prototype.every (callbackfn [ , thisArg] ) 函数
语法说明
- 第一个参数是回调函数
callbackfn
必须有并且是个函数,这个函数接受三个参数并且返回Boolean
值,也就是true
或者false
every
函数会在排序遍历 当前 数组中的每个元素的时候调用一次callbackfn
一直到callbackfn
返回false
的时候结束遍历- 第二个参数是
thisArg
;非必须,如果提供了这个参数;那么这个参数会被赋值给callbackfn
中的this
如果没有提供,那么callbackfn
中的this
是undefined
; 当然在 nodejs 中会是global
对象- 回调函数
callbackfn
有三个参数,分别是:当前遍历的元素、当前遍历元素的角标、当前遍历的数组对象every
函数不会修改原生数组,但是这个原始的数组可以在callbackfn
中被修改every
函数只会遍历数组当前的元素,在遍历过程中添加或者删除的元素都不会被遍历,但是修改的会被遍历- 空数组,会直接返回
true
- 如果回调函数没有返回,
every
只会遍历第一元素,并且返回false
代码示例
// 判断数组里面的元素的值,都是小于 2
let arr = [1,2,3];
let result = arr.every(function(num,index,arr){return num<2})
console.log(result); // 此处输出 false
业务场景
01 判断数组中的数据是否都满足某种条件
示例需求:一个班级的学生必须都是男生
// gender:1-> 男生 0-> 女生
let studentList = [
{
name:'章三',
gender:1
},
{
name:'李四',
gender:1
},
{
name:'王二麻子',
gender:0
},
]
let result = studentList.every(function(st){return st.gender === 1})
console.log(result) // 输出 false
02 单纯的遍历全部元素,并且当满足某种条件的时候,修改元素
示例需求:一个班级的学生如果是男生,修改他显示的颜色是红色
// gender:1-> 男生 0-> 女生
let studentList = [
{
name:'章三',
gender:1
},
{
name:'李四',
gender:1
},
{
name:'王二麻子',
gender:0
},
]
let result = studentList.every(function(st){if(st.gender === 1){st.color = 'red'}
return true; // 让遍历执行完,如果不写,会只遍历第一个元素
})
console.log(result) // 输出 true
Array.prototype.some (callbackfn [ , thisArg] )
语法说明
和
every
非常类型,唯一的区别在第 7 条和第 8 条
(7). 如果是空数组,some
函数返回false
(8). 如果回调函数没有返回,some
遍历所有元素,并且返回false
示例代码
和 every
类似
业务场景
和 every
类似
使用 every
和 some
的注意事项
- 这 2 个函数都是
ES6
中的函数,支持浏览器ie9+
,如果需要兼容低版本需要借助第三方工具库实现,例如:lodash.js
或者underscore.js
- 回调函数,如果没有设置返回值,那么默认会返回
null
也就是会被转换为false
- 回调函数 返回
false
;every
会中断遍历 而some
会继续遍历
Array.prototype.filter (callbackfn [ , thisArg] )
语法说明
基本的语法和之前的
every
类似;唯一的区别是,filter
会返回一个新的数组
代码示例
和 every
类似
业务场景
过滤班级学生中的男生
// gender:1-> 男生 0-> 女生
let studentList = [
{
name:'章三',
gender:1
},
{
name:'李四',
gender:1
},
{
name:'王二麻子',
gender:0
},
]
let maleList = studentList.every(function(st){if(st.gender === 1){st.color = 'red'}
return true; // 让遍历执行完,如果不写,会只遍历第一个元素
})
console.log(maleList) // 输出 [/** 全部的男生 **/]