JavaScript: Array search methods

Various array search methods

Based on test function
  • some() returns true if any element satisfy the test function.
  • every() returns true if all elements satisfy the test function.
  • findIndex() returns the index of the first element that satisty the test function
  • find() returns the first element that satisfy the test function
Based on value
  • includes() returns true if any element match the value
  • indexOf() returns the index of the first element match the value

The methods

some()
arr.some(testFn)
Returns:
  • true: when it encounters an element that satisfy the test function. It doesn't check the rest of the elements.
  • false: if none satisfy the test function.
every()
arr.every(testFn)
Returns:
  • false: when it encounters an element that doesn't satisfy the test function. It doesn't check the rest of the elements.
  • true: if by the end of run, all satisfy the test function.
find()
arr.find(testFn)
Returns:
  • The first element that satisfy the test function.
  • undefined if none of the element satisfy the test function
findIndex()
arr.findIndex(testFn)
Returns:
  • The index of first element that satisfy the test function.
  • -1 if none of the element satisfy the test function

Test criteria

We only need to state the true condition of the test.
The false condition doesn't have to be stated (and returned false). Why?
  • When it doesn't return anything, the return value will be undefined.
  • Remember, Boolean of undefined, along with null, 0, and "" are false already.
  • Meanwhile, empty array element will be skipped.
Fun experiment 1
const test = el => el;

const num = [3, 0, 5];
num.some(test);     // true
num.every(test);    // false

const str = ["a", "", "c"];
str.some(test);     // true
str.every(test);    // false

const empty = [1, , 3];
empty.some(test);   // true
empty.every(test);  // true

const undef = [1, undefined, 3];
undef.some(test);   // true
undef.every(test);  // false
Fun experiment 2
const test1 = el => 1;
const test0 = el => 0;

const num = [3, 0, 5];

num.some(test1);    // true
num.every(test1);   // true

num.some(test0);    // false
num.every(test0);   // false

Test arrow function

Test function
const testFunction = (el) => {
    if (test criteria) {
        return true;
    }
};

const testFunction = el => test criteria;
Test criteria = code statement that equals to true when the statement is true, and false when the statement is false.
Even slimmer: the element bracket () on the left side of the arrow can be omitted when it only has 1 parameter, which is the case here.
Example test: Is the number even?
  • Test criteria is "Is the number even?"
  • Then the code statement is num % 2 === 0, because:
  • It will equal to true when the number is even.
  • It will equal to false when the number is odd.
  • Putting the code statement at the right side of the function arrow is enough to make the function spits out the needed true or false.
Just a little looking back at the arrow function
Function expression
function isEven(num) {
    if (num % 2 === 0) {
        return true;
    }
};
Arrow function
const isEven = (num) => {
    if (num % 2 === 0) {
        return true;
    }
};
Omit {} brackets and return word: if codeblock only 1 line and it's the return value.
In this case:
  • We only need an element to return true or false.
  • If even: num % 2 === 0 is true
  • If odd: num % 2 === 0 is false
  • Therefore, putting the test criteria as return value is enough to create desired true or false return.
const isEven = num => num % 2 === 0;

Example: isEven

Example: check if numbers in the array are even: any, or all of them
const num = [1, 2, 3, 4, 5, 6];

const isEven = num => num % 2 === 0;

const numSomeEven = num.some(isEven);
numSomeEven;    // true

const numAllEven = num.every(isEven);
numAllEven;     // false

Wesbos Javascript30: 07 Array Cardio Practice Day 2

People array
const people = [
    { name: 'Wes', year: 1988 },
    { name: 'Kait', year: 1986 },
    { name: 'Irv', year: 1970 },
    { name: 'Lux', year: 2015 }
];
People: Is at least one person 19 or older? Is everyone 19 or older?
const grownUp = el => (new Date().getFullYear() - el.year) >= 19;
people.some(grownUp);   // true
people.every(grownUp);  // false

// or:

people.some(el => (new Date().getFullYear() - el.year) >= 19);  // true
people.every(el => (new Date().getFullYear() - el.year) >= 19); // false
Comments array
const comments = [
    { text: 'Love this!', id: 523423 },
    { text: 'Super good', id: 823423 },
    { text: 'You are the best', id: 2039842 },
    { text: 'Ramen is my fav food ever', id: 123523 },
    { text: 'Nice Nice Nice!', id: 542328 }
];
Comments: Find the comment with the ID of 823423. Find the index.
comments.find(el => el.id === 823423);          // {text: 'Super good', id: 823423}
comments.findIndex(el => el.id === 823423);     // 1
Comments: Delete the comment with ID of 823423
const index = comments.findIndex(el => el.id === 823423);     // 1
comments.splice(index, 1);

// or just:

comments.splice(comments.findIndex(el => el.id === 823423), 1);

References