TIL : Javascript Array


JAvscriptは、他の言語とは異なるタイプを動的に定義するため、1つのデータ構造に異なるタイプのオブジェクトを含めることができます.いつも同じ格好したい
声明とAPIsクリーンアップ!

宣言

const arr = new Array();
const arr2 = [1,2,3];

しゅつりょくモード


for

const arr = ["apple", "banana", "carrot", "mango"];

for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}

for...of

const arr = ["apple", "banana", "carrot", "mango"];

for (let value of arr) {
    console.log(value);
}

forEach!!!!


配列内の各要素に対してコールバック関数を実行できます!!つまり、アレイ内の各要素が設定した関数を呼び出すことを理解しましょう!!
  • 使い方!
  • forEach(callbackfn: (value: T, index: number, array: T[]) => void, thisArg?: any): void;
  • 2つのパラメータが存在する!
  • ?:追加した2番目のパラメータはオプションです!
  • 最初のパラメータはコールバック関数で、私が設定した関数を配列の各要素に呼び出します!
  • arr.forEach(function (value, index, arr) {
        console.log(value, index, arr);
    });
    Arrow関数は応用をより簡潔にする.
    arr.forEach((value, index, arr) => {
        console.log(value, index, arr);
    });
    

    add, delete , copy


    配列の最後に追加、削除

    push, pop
    const arr = ["apple", "banana", "carrot", "mango"];
    
    arr.pop();
    arr.push("peach");
    
    console.log(arr);
    この時!pop()で取り出した要素は変数に格納して使用できます!
    const arr = ["apple", "banana", "carrot", "mango"];
    
    const element = arr.pop();
    
    console.log(arr);
    console.log(element);

    配列の第1部の追加、削除

    shift, unshift
    const arr = ["apple", "banana", "carrot", "mango"];
    
    const ele = arr.shift();
    arr.unshift("orange");
    console.log(arr);
    console.log(ele);
  • 同様にshiftで返した要素を変数に格納して使用できる.
  • この2つの方法で性能的に有効なのはpoppush!
  • poppush配列の他の要因には影響しないので、最後の部分の値にのみ影響します.
  • これとは逆にshiftunshiftの場合、他の配列は加算・減算してインデックスを行うので、より多くの費用がかかります!
  • 前後ではなく、私が欲しい時点で追加、削除!!

    splice使用方法
    splice(start: number, deleteCount?: number): T[];
  • 最初のパラメータのうちどこから始まるか
  • 2番目のパラメータでは、何個削除すればよいかを指定する
  • 2番目のパラメータはオプションなので、1番目のパラメータだけを入力すると、そのインデックスからずっと削除されます!
  • const arr = ["apple", "banana", "carrot", "mango"];
    
    arr.splice(2, 3);
    
    console.log(arr);
  • 結果index 2~3のニンジン、マンゴーを削除
  • ["apple","banana"]2種類しか残っていません!
  • 使い方.
    splice(start: number, deleteCount: number, ...items: T[]): T[];
  • このapiが良い理由!!パラメータを追加し、必要なインデックスに値を追加することもできます.
  • const arr = ["apple", "banana", "carrot", "mango"];
    
    arr.splice(2, 2, "grape", "melon");
    
    console.log(arr);

    コンビネーションを並べます!!( concat )

    concat(...items: ConcatArray<T>[]): T[];parameterにマージしたい配列を加えると、新しいマージ配列が生成されます!
    const arr = ["apple", "banana", "carrot", "mango"];
    
    const arr2 = ["pineapple", "egg"];
    
    const mixedArr = arr.concat(arr2);
    console.log(mixedArr);

    インデックスを検索!( searching )

    const arr = ["apple", "banana", "carrot", "mango"];
    
    //index 찾기
    console.log(arr.indexOf("banana")); //1
    console.log(arr.indexOf("peach")); //-1
    console.log(arr.includes("mango")); //true
    console.log(arr.includes("peach"));//false
    
    しかし、配列に重複値がある場合は、インデックスをどのように検索しますか?

    lastIndexOf

    const arr = ["apple", "banana", "carrot", "mango", "banana"];
    
    console.log(arr.indexOf("banana")); //1
    console.log(arr.lastIndexOf("banana")); //4
  • indexOfは、配列で最初に現れる要素のindex値を返します.
  • lastIndexOf同じ要素が複数存在しても最後の該当インデックス値を返します!