FORSMILE
JA
JavaScript2020/06/24

[JavaScript] A Summary of Methods for Checking Specific Array Elements

I had an opportunity to teach about arrays in PHP, which made me wonder how it's done in JavaScript, so I've compiled this summary.

Back to Blog

I had an opportunity to teach about arrays in PHP, which made me wonder how it's done in JavaScript, so I've compiled this summary.

RETRIEVING SPECIFIC ARRAY ELEMENTS

Use array.filter. It filters and returns an array containing only the elements that match the specified condition.

Usage

javascript
let animal= ['pig', 'cow', 'pig', 'lion', 'cat']; 

let animalPig = animal.filter(function(n){
    return n === 'pig'
});
// Arrow関数で書くと下記(以下可能な場所はArrow関数で)
let animalPig = animal.filter(n => n === 'pig');

// ['pig', 'pig']という配列ができる
javascript
let animal= [
    { name: 'pig', num: '2'},
    { name: 'cow', num: '4'},
    { name: 'pig', num: '3'},
    { name: 'lion', num: '2'},
    { name: 'cat', num: '1'},
]; 
let animalNumTwo =  matches.filter(n => n.num === '2');

// 下記のような配列になる
// [
//     { name: 'pig', num: '2'},
//     { name: 'lion', num: '2'},
// ];
javascript
// pigがいくつあるか数える
let animal= ['pig', 'cow', 'pig', 'lion', 'cat'];
let count = animal.filter(n => n === 'pig').length;

// count === 2

SEARCHING FOR SPECIFIC ELEMENTS IN AN ARRAY

array.find returns the value of the first element in the array that satisfies the condition.

Usage

javascript
let numbers = [7, 120, 40, 33, 150];
let number = numbers.find(n => n > 100);

// number === 120

CHECKING IF ALL ARRAY ELEMENTS SATISFY A CONDITION

Use array.every. It returns true if all elements satisfy the condition, and false otherwise.

Usage

javascript
var isLimit = (n) => n < 10;
let numbers = [1, 8, 9, 5];

console.log(numbers.every(isLimit));
//  true
javascript
let isDateTime = eventList.every(value => value.datetime);

//eventListの要素datetimeに値が設定されている場合 true

CHECKING IF AN ARRAY INCLUDES A SPECIFIC ELEMENT

Use array.includes. It returns true if the specific element is found in the array, and false if it is not.

Usage

javascript
let animal= ['pig', 'cow', 'pig', 'lion', 'cat']; 

console.log(animal.includes('cat'));
// true

CHECKING IF ANY ARRAY ELEMENT SATISFIES A CONDITION

Use array.some. It returns true if at least one element in the array satisfies the condition.

Usage

javascript
let numbers = [1, 8, 9, 5];
let isEven = (n) => n % 2 === 0;

// 8があるので true

What's the difference between includes and some?

includes simply determines whether a specific element is present.

some can determine whether a specific condition (which can be a function) is met.

When searching a simple array, includes is simpler to use.

When trying to find a specific value within an associative array or object, it's probably better to use some with a function.

RECOMMENDED JAVASCRIPT BOOKS

There's a lot of online information for JavaScript, and Google search is convenient, so you might not need to read books.

However, those just starting out might deepen their understanding by reading one easy book. While there are good reference books, searching Google allows for easy copy-pasting, which is more convenient, so they might not be necessary.

Awakening! JavaScript — Learning the Essence of JavaScript from Language Specifications

Highly recommended! You can learn JavaScript concepts not easily found through Google searches. When I finished reading it, I felt my coding skills had improved significantly.

📦
Amazon で関連書籍・ツールを検索
JavaScript programming book
Amazonで探す →(アソシエイトリンク)