每天温习一个JS方法之Array.some And Array.every方法 第二天

一、Array.some 方法

1. Array.some 描述

1. some() 为数组中的每一个元素执行一次 callback 函数，直到找到一个使得 callback 返回一个“真值”（即可转换为布尔值 true 的值）。如果找到了这样一个值，some() 将会立即返回 true。否则，some() 返回 false。

2. some() 被调用时不会改变数组。

3. 如果用一个空数组进行测试，在任何情况下它返回的都是false。

1.1 Array.some 语法

arr.some((element, index, array) => { /* … */ } )

arr.some(function(element, index, array) { /* … */ }, thisArg)

参数

• element ：数组中正在处理的元素。
• index ：数组中正在处理的元素的索引值。
• array ：被调用的数组。

1.2 Array.some 返回值

数组中有至少一个元素通过回调函数的测试就会返回**true**；所有元素都没有通过回调函数的测试返回值才会为 false。

2. Array.some 应用

2.1 验证Array.some描述

let arr = [{ id: 1 }, { id: 2 }, { id: 3 }];

console.log(arr.some((obj) => obj.id === 2)); // 输出 true —— 描述1
console.log(arr); // 输出 [{ id: 1 }, { id: 2 }, { id: 3 }] 保持不变 —— 描述2
console.log([].some((obj) => obj.id === 2)); // 输出 false —— 描述3

2.2 验证arr.some调用后，往arr添加元素是否会改变some结果

let arr = [{ id: 1 }, { id: 2 }, { id: 3 }];

const result = arr.some((obj, index) => {
  arr.push({ id: index + 4 });
  return obj.id === 4;
});
console.log(arr); // [{ id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }, { id: 5 }, { id: 6 }]
console.log(result); // 输出 false

注：如果数组中存在且还未被访问到的元素被 callback 改变了，则其传递给 callback 的值是 some() 访问到它那一刻的值。已经被删除的元素不会被访问到

2.3 检测数组元素是否存在undefined and null and ''

let arr = [1, 2, 3, 4, 5, 6, 7];
console.log(arr.some((obj) => !Boolean(obj))); // 输出 false

let arr = [1, 2, 3, undefined, 5, 6, 7];
console.log(arr.some((obj) => !Boolean(obj))); // 输出 true

let arr = [1, null, 3, 4, 5, 6, 7];
console.log(arr.some((obj) => !Boolean(obj)));// 输出 true

2.4 将任意值转换为布尔类型

// 引用自 MDN
var TRUTHY_VALUES = [true, 'true', 1]; // 入参正确数组

function getBoolean(value) {
  'use strict';

  if (typeof value === 'string') {
    value = value.toLowerCase().trim();
  }

  return TRUTHY_VALUES.some(function(t) {
    return t === value;
  });
}

getBoolean(false);   // false
getBoolean('false'); // false
getBoolean(1);       // true
getBoolean('true');  // true
getBoolean(undefined); // false

2.5 与Array.filter联用 用于过滤符合条件的数组对象

const filterable = [1, 3, 5];
const arr = [{ id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }, { id: 5 }];
const result = arr.filter((obj) => filterable.some((o) => o == obj.id));

console.log(result); //  [{id: 1}, {id: 3}, {id: 5}]

Array.some还有居多应用之处，但只要记住它的作用，相信你在处理逻辑过程能有诸多帮助。

二、Array.every 方法

1. Array.every 描述

1. every 方法为数组中的每个元素执行一次 callback 函数，直到它找到一个会使 callback 返回 falsy 的元素。如果发现了一个这样的元素，every 方法将会立即返回 false。否则，callback 为每一个元素返回 true，every 就会返回 true。

2. every 不会改变原数组。

3. 若收到一个空数组，此方法在任何情况下都会返回 true。 ———— 与Array.some相反

1.1 Array.every 语法 —— 与 Array.some一致

arr.every((element, index, array) => { /* … */ } )

arr.every(function(element, index, array) { /* … */ }, thisArg)

参数

• element ：数组中正在处理的元素。
• index ：数组中正在处理的元素的索引值。
• array ：被调用的数组。

1.2Array.every 返回值

如果回调函数的每一次返回都为 true，返回 true，否则返回 false。

2. Array.every 方法

2.1 验证Array.every 描述

const arr = [1, 2, 3, 4];

console.log(arr.every((o) => o > 3)); // 输出 false
console.log(arr); // [1, 2, 3, 4]
console.log([].every((o) => o > 5)); // 输出 true

2.2 验证数组元素是否存在undefined and null and ''

const arr = [1, 2, 3, 4];
const result = arr.every((obj) => Boolean(obj));
console.log(result); // 输出 true = 不存在

const arr = [1, 2, undefined, 3, 4];
const result = arr.every((obj) => Boolean(obj));

console.log(result); // 输出 false = 存在

2.3 与Array.filter and Object.keys 过滤数组对象 属性值大于某值的对象

const arr = [
    { width: 500, height: 500 },
    { width: 300, height: 300 },
    { width: 650, height: 650 },
];

const filterArr = arr.filter((obj) => {
  return Object.keys(obj).every((o) => {
    return obj[o] >= 500;
  });
});
console.log(filterArr); // 输出 [{ width: 500, height: 500 },{ width: 650, height: 650 }]

Array.every还有居多应用之处，但只要记住它的作用，相信你在处理逻辑过程能有诸多帮助。

⚠：Array.some只要回调返回一个true即为true,而Array.every需全部为true才为true