【javascript】チートシート【配列編】

2024年3月29日

1. 追加・削除
2. 連結
3. サイズ
4. 検索
5. 要素が含まれるか検索
6. 要素を結合
7. 抜き出し
8. 置き換え
9. 並び替え
10. 複製
11. 順に処理
12. 順に加工
13. 絞り込み
14. 全ての条件に合致するか判定
15. 一つでも条件に合致するか判定

追加・削除

// 追加・削除
let array = ['abc','def'];
console.log(array); // ['abc', 'def']

// 先頭に追加
array.unshift('123');
console.log(array); // ['123', 'abc', 'def']

// 末尾に追加
array.push('456');
console.log(array); // ['123', 'abc', 'def', '456']

// 先頭を削除
array.shift();
console.log(array); // ['abc', 'def', '456']

// 末尾を削除
array.pop();
console.log(array); // ['abc', 'def']

連結

// 連結
let array1 = ['abc','def'];
let array2 = ['123','456'];
let array3 = ['あいう','えおか'];

// 連結
let array4 = array1.concat(array2);
console.log(array4); // ['abc', 'def', '123', '456']
// 複数連結も可能
let array5 = array1.concat(array2,array3);
console.log(array5); // ['abc', 'def', '123', '456', 'あいう', 'えおか']

サイズ

let array = [];

// サイズ
console.log(array.length); // 0

array.push('abc','def');
console.log(array.length); // 2

検索

// 検索
let array = [10,20,30,10];

// 前方から検索
console.log(array.indexOf(10)); // 0
// 後方から検索
console.log(array.lastIndexOf(10)); // 3

// 不一致の場合は-1
console.log(array.indexOf(50)); // -1
console.log(array.lastIndexOf(50)); // -1

// 内部的に===で比較するのでこれは-1
console.log(array.indexOf('10')); // -1
console.log(array.lastIndexOf('10')); // -1

// 第二引数で検索開始位置を指定
console.log(array.indexOf(10,1)); // 3
console.log(array.lastIndexOf(10,1)); // 0

要素が含まれるか検索

// 要素が含まれるか検索
let array = ['abc','def'];
console.log(array.includes('abc')); // true
console.log(array.includes('ab')); // false

要素を結合

// 配列の値をまとめる
let array = ['abc','def','ghi'];

// toStringはカンマ区切りで出力
console.log(array.toString()); // abc,def,ghi

// joinは区切り文字を指定できる
console.log(array.join(',')); // abc,def,ghi
console.log(array.join(' ')); // abc def ghi
console.log(array.join('')); // abcdefghi

抜き出し

// 抜き出し
let data = ['a','b','c','d','e'];
console.log(data.slice(2)); // ['c', 'd', 'e']
console.log(data.slice(1,3)); // ['b', 'c']

置き換え

// 置き換え
let data = ['a','b','c','d','e'];

// index1の要素から3個分だけ要素を抜き出し
// 'あ','い'に置き換える
data.splice(1,3,'あ','い');
console.log(data); // ['a', 'あ', 'い', 'e']

並び替え

// 並び替え
let data = ['b','c','a'];

// 昇順
data.sort();
console.log(data); // ['a', 'b', 'c']

// 降順
data.reverse();
console.log(data); // ['c', 'b', 'a']

複製

// 複製
let data = ['a','b','c'];

let copy = Array.from(data);
console.log(copy); // ['a', 'b', 'c']

// 別オブジェクトなのでfalseになる
console.log(data === copy); // false

順に処理

// 順に処理
let data = [
    {name:'tanaka',age:'20'},
    {name:'satake',age:'32'},
    {name:'higashi',age:'16'},
    {name:'yamaue',age:'51'},
    {name:'maruyama',age:'39'}
]

data.forEach(function(value){
    console.log(value.name, ':', value.age);
    /*
    tanaka : 20
    satake : 32
    higashi : 16
    yamaue : 51
    maruyama : 39
    */
});

順に加工

// 順に加工
let data = [1,2,3];

let data2 = data.map(function(value){
    return value * 2;
});

console.log(data2); [2, 4, 6]

絞り込み

// 絞り込み
let data = ['abc', 'defgh', 'ij'];

// trueと判定された要素だけを取得する
let data2 = data.filter(function(value){
    // 三文字以上の要素だけ返す
    return (value.length >= 3);
});

console.log(data2); // ['abc', 'defgh']

全ての条件に合致するか判定

// 全ての条件に合致するか判定
let data = ['abc', 'defgh', 'ij'];

console.log(data.every(function(value){
    // 全ての要素が3文字以上ではないのでfalse
    return value.length >= 3;
})); // false

console.log(data.every(function(value){
    // 全ての要素が2文字以上なのでtrue
    return value.length >= 2;
})); // true

一つでも条件に合致するか判定

// 一つでも条件に合致するか判定
let data = ['abc', 'defgh', 'ij'];

console.log(data.some(function(value){
    // 2文字以下の要素が1つあるのでtrue
    return value.length <= 2;
})); // true

console.log(data.some(function(value){
    // 1文字以下の要素が1つもないのでfalse
    return value.length <= 1;
})); // false

javascript