javascript, typescriptで配列を使うときのアレコレを比較してまとめてみました。
typescriptの公式ドキュメントはこちらになります。
配列の宣言
javascriptで配列宣言
文字列だけの配列
let nintendo_games = ["gameboy", "gameboy advance", "3ds", "64", "gamecube", "wii", "wiiU", "switch"];
console.log(nintendo_games[4]); // => gamecube
いろいろな値を入れた配列
let etcs = [1 , function() { console.log("hogehoge"); }, "test"];
typescriptで配列宣言
文字列だけの配列
let nintendo_games: string[] = ["gameboy", "gameboy advance", "3ds", "64", "gamecube", "wii", "wiiU", "switch"];
console.log(nintendo_games[4]); // => gamecube
いろいろな値を入れた配列
let etcs: any[] = [1, function () { console.log("hogehoge"); }, "test"];
変数宣言して、[: 型]をかけばOKですね。
配列に要素を追加
pushメソッドを使う(末尾)
pushメソッドで、末尾に追加できます。
unshiftよりはこっちの方がよく使ってる気がします。
pushメソッドの使い方は、配列の変数.push(要素)で配列の最後に要素が追加されます。
javascriptで要素の追加
let nintendo_games = ["gameboy", "gameboy advance", "3ds", "64", "gamecube", "wii", "wiiU", "switch"];
nintendo_games.push("super famicon");
console.log(nintendo_games[8]); // => super famicon
typescriptで要素の宣言
let nintendo_games: string[] = ["gameboy", "gameboy advance", "3ds", "64", "gamecube", "wii", "wiiU", "switch"];
nintendo_games.push("super famicon");
console.log(nintendo_games[8]); // => super famicon
unshiftメソッドを使う(先頭)
unshiftメソッドで、先頭に追加できます。
unshiftメソッドの使い方は、配列の変数.unshift(要素)で配列の先頭に要素が追加されます。
let nintendo_games = ["gameboy", "wiiU", "switch"];
nintendo_games.unshift("super famicon");
console.log(nintendo_games); // => ["super famicon", "gameboy", "wiiU", "switch"]
typescriptも同様にunshiftメソッドで先頭に追加できます。
配列の要素を削除
spliceを使う(要素指定で削除)
どちらもspliceメソッドで、追加できます。
spliceメソッドの使い方は、配列の変数.splice(削除開始位置, 削除要素数) で削除できます。
配列は0番目から数えて、下記の例で言うと
1番目の配列の要素から6個削除しています。
javascriptで配列要素の削除
let nintendo_games = ["gameboy", "gameboy advance", "3ds", "64", "gamecube", "wii", "wiiU", "switch"];
nintendo_games.splice(1, 6);
console.log(nintendo_games); // => ["gameboy", "switch"]
typescriptで配列要素の削除
let nintendo_games: string[] = ["gameboy", "gameboy advance", "3ds", "64", "gamecube", "wii", "wiiU", "switch"];
nintendo_games.splice(1, 6);
console.log(nintendo_games); // => ["gameboy", "switch"]
shiftメソッドを使う(先頭削除)
shiftメソッドを使うと先頭の要素を削除できます。
let nintendo_games = ["gameboy", "wiiU", "switch"];
nintendo_games.shift();
console.log(nintendo_games); // => ["wiiU", "switch"]
typescriptも同様にshiftメソッドで先頭の要素を削除できます。
popメソッドを使う(末尾削除)
shiftメソッドを使うと末尾の要素を削除できます。
let nintendo_games = ["gameboy", "wiiU", "switch"];
nintendo_games.pop();
console.log(nintendo_games); // => ["gameboy", "wiiU"]
typescriptも同様にpopメソッドで末尾の要素を削除できます。
配列の要素存在チェック
特定の要素が存在するかチェックするにはindexOfを使います。
要素が配列に存在すれば、存在する位置を返してくれるので、0以上だったら存在することになります。
存在しない場合は−1を返します。
大文字と小文字は区別されます。
typescriptも同様にindexOfメソッドで確認できます。
let nintendo_games = ["switch", "3ds", "ds"];
if (nintendo_games.indexOf("3ds") > 0){
console.log("3dsがあります!");
}
配列の要素数を取得
要素数がいくつあるか取得するにはlengthを使います。
typescriptも同様にlengthメソッドで取得できます。
let nintendo_games = ["switch", "3ds", "Ds"];
console.log(nintendo_games.length); // => 3
終わりに
typescriptの方もjavascriptと同じ配列操作メソッドが使えました!
互換性あるから当たり前なのかな?
個人的にはpushとsplice以外はあまり使わない感じなので、この二つをとりあえずおさえておけばいいかと思います😄
コメント