Menu
Coddy logo textTech

配列のメソッド パート3

CoddyのJavaScriptジャーニー「基礎」セクションの一部 — レッスン 68/77。

さらにいくつかの便利な配列メソッドを紹介します:

1. concat(): 2つ以上の配列を結合して新しい配列を返します。元の配列は変更されません。

let arr1 = [1, 2];
let arr2 = [3, 4];
let combined = arr1.concat(arr2);
console.log(combined); // 出力: [1, 2, 3, 4]

2. join(separator): 配列のすべての要素を、指定された区切り文字(オプション)で区切って結合し、1つの文字列にします。

let fruits = ["apple", "banana", "orange"];
let joined = fruits.join(", ");
console.log(joined); // 出力: "apple, banana, orange"

3. slice(start, end): 配列の一部を抽出し、新しい配列を返します。start インデックスは開始位置を含み、end インデックスは終了位置を含みません。

let numbers = [1, 2, 3, 4, 5];
let sliced = numbers.slice(1, 4);
console.log(sliced); // 出力: [2, 3, 4]

4. splice(start, deleteCount, item1, item2, ...): 要素の削除、置換、または追加によって、配列の内容を変更します。元の配列を変更し、削除された要素(もしあれば)を含む配列を返します。

let numbers = [1, 2, 3, 4, 5];
let removed = numbers.splice(2, 2, 6, 7);
console.log(numbers); // 出力: [1, 2, 6, 7, 5]
console.log(removed); // 出力: [3, 4]

5. split(separator, limit): 指定されたセパレータに基づいて、文字列を部分文字列の配列に分割します。元の文字列は変更されません。オプションの limit パラメータは、分割の最大数を制御します。

let text = "apple,banana,orange";
let result = text.split(",");
console.log(result); 
// 出力: ["apple", "banana", "orange"]

let limited = text.split(",", 2);
console.log(limited);
// 出力: ["apple", "banana"]
challenge icon

チャレンジ

簡単

配列 numbers = [1, 2, 3, 4, 5] が与えられています。次の手順を実行し、結果を直接出力してください:

  1. concat() を使用して、配列の末尾に [6, 7, 8] を追加し、その結果を出力してください。
  2. join() を使用して、concat() の結果をカンマで区切られた文字列に変換し、それを出力してください。
  3. slice() を使用して、元の numbers 配列から最初の3つの要素を抽出し、それらを出力してください。
  4. splice() を使用して、numbers の2番目の要素を 99 に置き換え、変更された numbers 配列を出力してください。

チートシート

操作と抽出のための配列メソッド:

concat(): 元の配列を変更せずに配列を結合します

let arr1 = [1, 2];
let arr2 = [3, 4];
let combined = arr1.concat(arr2);
console.log(combined); // 出力: [1, 2, 3, 4]

join(separator): 配列の要素を結合して文字列にします

let fruits = ["apple", "banana", "orange"];
let joined = fruits.join(", ");
console.log(joined); // 出力: "apple, banana, orange"

slice(start, end): 配列のセクションを抽出します(開始位置は含み、終了位置は含みません)

let numbers = [1, 2, 3, 4, 5];
let sliced = numbers.slice(1, 4);
console.log(sliced); // 出力: [2, 3, 4]

splice(start, deleteCount, item1, item2, ...): 要素の削除、置換、追加によって元の配列を変更します

let numbers = [1, 2, 3, 4, 5];
let removed = numbers.splice(2, 2, 6, 7);
console.log(numbers); // 出力: [1, 2, 6, 7, 5]
console.log(removed); // 出力: [3, 4]

split(separator, limit): 文字列を部分文字列の配列に分割します

let text = "apple,banana,orange";
let result = text.split(",");
console.log(result); // 出力: ["apple", "banana", "orange"]

let limited = text.split(",", 2);
console.log(limited); // 出力: ["apple", "banana"]

自分で試してみよう

let numbers = [1, 2, 3, 4, 5];
quiz icon腕試し

このレッスンには短いクイズがあります。レッスンを始めて解答し、進捗を記録しましょう。

基礎のすべてのレッスン