JS中 filter、find、some、every 用法

1.filter

用法 

• 用于过滤数组中的元素，并返回一个新的数组，该数组包含满足指定条件的元素

实例

const numbers = [1, 2, 3, 4, 5, 6];
// 过滤出大于3的元素
const filteredNumbers = numbers.filter(number => number > 3);
console.log(filteredNumbers); // 输出: [4, 5, 6]

2.find

用法

• find() 方法返回通过测试（函数内判断）的数组的第一个元素的值。

• 如果没有符合条件的元素返回 undefined

• find() 对于空数组，函数是不会执行的。

• find() 并没有改变数组的原始值。

• array.find(function(currentValue, index, arr),thisValue)，其中currentValue为当前项，index为当前索引，arr为当前数组

实例

let test = [1, 2, 3, 4, 5];
let a = test.find(item => item > 3);
console.log(a); //4
 
let b = test.find(item => item == 0);
console.log(b); //undefined
 
//一般用于数据字典回显和数据查找  vue用法  unitColorData为筛选的数组数据
setUnitColor(name) {
    let row = this.unitColorData.find((v) => v.textMap.NAME == name)
    if (row) {
        return `color: ${row.textMap.FONT_COLOR_HEX};background:${row.textMap.BG_COLOR_HEX}`
    } else {
        return `color: #138085; background:${this.hexToRgba('#138085', 0.1)}`
    }
},

 3.some

用法

• 用来检测数组中的元素是否满足指定条件。

• 若有一个元素符合条件，则返回true，且后面的元素不会再检测。

• 不会对空数组进行检测,不会改变原数组

实例

let arr= [1, 2, 3, 4, 5];

let hadVal1 = arr.some(item=> item === 2);

let hadVal2 = arr.some(item=> item === 10);

console.log('hadVal1：',hadVal1); // true
console.log('hadVal2：',hadVal2); // false 

  4.every

用法

• 用来检测数组中每个元素（检测所有元素）是否都符合指定条件。

• 若有一个不满足条件，则返回false，后面的元素都不会再执行。

• 不会对空数组进行检测，不会改变原始数组。

实例

let arr= [ 1, 2, 6, 7, 8 ];

// 检测数组中每个元素是否 都满足 加2后小于5
let everyFlag = arr.every(item=>item + 2 < 5);
console.log('everyFlag:',everyFlag); // false

//检测空数组
let everyEmptyFlag = [].every(item=>{console.log('Kong...');});
console.log('everyEmptyFlag:',everyEmptyFlag); // true