javascript 配列操作のメモ

2022年5月13日

配列操作のメモ。

ループする

var numbers = [1, 2, 3, 4, 5]
numbers.forEach((number) => {
  console.log(number);
});
// 1
// 2
// 3
// 4
// 5

配列から対象の値を取得する

var numbers = [1, 2, 3, 4, 5]
var result = numbers.find((number) => {
  return number === 3;
});
console.log(result)
// 3

配列に存在しない値を取得する

var numbers = [1, 2, 3, 4, 5]
var result = numbers.find((number) => {
  return number === 10;
});
console.log(result);
// udefined

配列から指定のキーのオブジェクトを取得する

var objects = [{key: 'a'}, {key: 'b'}, {key: 'c'}]
var result = objects.find((obj) => {
  return obj.key === 'b';
});
console.log(result);
// {key: 'b'}

配列の値を通数のみで絞り込む

var numbers = [1, 2, 3, 4, 5]
var result = numbers.filter((number) => {
  return number % 2 === 0;
});
console.log(result);
// [2, 4]

配列内オブジェクトのキーVALUEで絞り込む

var objects = [{key: 'a'}, {key: 'b'}, {key: 'c'}]
var result = objects.filter((obj) => {
  return obj.key === 'a' || obj.key === 'c';
});
console.log(result);
// [{key: 'a'}, {key: 'c'}]

配列内の値は全て 3 より大きいか

var numbers = [1, 2, 3, 4, 5]
var result = numbers.every((number) => {
  return number > 3;
});
console.log(result);
// false

配列内オブジェクトのキーVALUEは全て b か

var objects = [{key: 'a'}, {key: 'b'}, {key: 'c'}]
result  = objects.every((obj) => {
  return obj.key === 'b';
});
console.log(result);
// false

配列内に一つでも 3 より大きい値があるか

var numbers = [1, 2, 3, 4, 5]
var result = numbers.some((number) => {
  return number > 3;
});
console.log(result);
// true

配列内に 3 はあるか

var numbers = [1, 2, 3, 4, 5]
var result = numbers.includes(3);
console.log(result);
// true

配列内オブジェクトのキーVALUEに一つでも b があるか

var objects = [{key: 'a'}, {key: 'b'}, {key: 'c'}]
var result = objects.some((obj) => {
  return obj.key === 'b'
});
console.log(result);
// true

配列内要素を逆に並び変える

var numbers = [3, 1, 2, 5, 4]
var result = numbers.reverse();
console.log(result);
// [4, 5, 2, 1, 3]

配列内要素を昇順に並び変え

var numbers = [3, 1, 2, 5, 4]
var result = numbers.sort();
console.log(result);
// [1, 2, 3, 4, 5]

配列内要素を降順に並び変え

var numbers = [3, 1, 2, 5, 4]
var result = numbers.sort().reverse();
console.log(result);
// [5, 4, 3, 2, 1]

配列内のオブジェクトのキーVALUEで昇順に並び替える

var objects = [{key: 'b'}, {key: 'a'}, {key: 'c'}]
var result = objects.sort((a, b) => {
  return (a.key < b.key) ? -1: 1;
});
console.log(result)
// [{key: 'a'}, {key: 'b'}, {key: 'c'}]

配列内のオブジェクトのキーVALUEで降順に並び替える

var objects = [{key: 'b'}, {key: 'a'}, {key: 'c'}]
var result = objects.sort((a, b) => {
  return (a.key > b.key) ? -1: 1;
});
console.log(result)
// [{key: 'c'}, {key: 'b'}, {key: 'a'}]

配列内の要素の合計を出す。

var numbers = [1, 2, 3, 4, 5]
var result = numbers.reduce((previousValue, currentValue, index, array) => {
  console.log(previousValue) // 1 -> 3 -> 6 -> 10
  console.log(currentValue)  // 2 -> 3 -> 4 -> 5
  console.log(index) // 1 -> 2 -> 3 -> 4
  console.log(array) // [1, 2, 3, 4, 5] ※ 常に同じ
  return previousValue + currentValue;
});
console.log(result);
// 15

配列全ての要素を2倍にしてみ

var numbers = [1, 2, 3, 4, 5]
var result = numbers.map((number) => {
  return number * 2;
});
console.log(result);
// [2, 4, 6, 8, 10]

配列内オブジェクトの全てのキーVALUEを hoge に書き換えてみる

var objects = [{key: 'a'}, {key: 'b'}, {key: 'c'}]
result  = objects.map((obj) => {
  obj.key = 'hoge';
  return obj;
});
console.log(result);
// [{key: 'hoge'}, {key: 'hoge'}, {key: 'hoge'}]
YouTube

2022年5月13日