【もりけん塾】言語チャレンジ@配列を任意の個数に分割する

JavaScript
管理人
管理人

こんにちは、さえと申します👩‍💻
現在 フロントエンドエンジニアになるために 日々勉強をしています
このブログは その勉強の記録と アウトプットのために運営をしています✨

もりけん塾で新たに追加された課題….「 言語チャレンジ 」に取り組んでいます。

課題はあらかじめinputする値が決まっていて、outputの値が戻り値になる様なコードを書きます
ここではoutputの値が、課題で提示されている通りになっていればクリアとなります。

今回は、課題22に取り組みました!

課題22

2つのパターンの input&output があり、それぞれ outputの値になる様な関数を考えます

input

 ["a", "b", "c", "d"]

and 2

output

 [["a", "b"],["c", "d"]]

input

 ["a", "b", "c", "d"]

output

 [["a", "b","c"], ["d"]]

とりあえず考えをまとめる

考えたこと
考えたこと

まずは、考えを整理してみよう
– slice()を使用してできそう
– 全体の関数の引数に 範囲(index)を渡せる様にして
それをsliceの引数に渡せば良さそう

2つ目のinputの値は [“a”, “b”, “c”, “d”] だけ
2つ目の仮引数へ範囲を渡すことができない…
初期値を設定することで解決できそう

考えをまとめたので、とりあえずコードを書いてみた

const input = ["a", "b", "c", "d"]
 let arr = [];
 const f = (parma, size) => {
    const a = parma.slice(0, size);
    const b = parma.slice(size);
    arr.push(a, b);
}

1つ目のinputを渡した場合

f(input,2); 
console.log(arr);  // [["a", "b"],["c", "d"]]

2つ目のinputを渡した場合

f(input); 
console.log(arr);  // [["a", "b","c"], ["d"]]

どちらのinputを入れても 指定されたoutputの値になりましたが
変数arrの配列にpush為、1つ目と2つ目を一緒に実行した場合 意図していないoutputになってしまうのと、もう少しシンプルにコードを書けると思いました。

slice

考えたこと
考えたこと

もっとシンプルに書けそう

const input = ["a", "b", "c", "d"]
const f = (parma, size = 3) => [parma.slice(0, size), parma.slice(size)];

const result1 = f(input, 2);
console.log(result1); // [["a", "b"],["c", "d"]]

const result2 = f(input);
console.log(result2); // [["a", "b","c"], ["d"]]
Array.prototype.slice() - JavaScript | MDN
slice() メソッドは、start と end が配列の中の項目のインデックスを表している場合、start から end まで (end は含まれない) で選択された配列の一部の浅いコピーを新しい配列オブジェクトに作成して返します。元の配列は変更されません。

splice

考えたこと
考えたこと

spliceというメソッドを発見!
sliceと違い spliceは破壊的なメソッドの為 元の配列を壊してしまう

仮引数でスプレッド構文を使用して
クローンに対してspliceを使えば良さそう

const input = ["a", "b", "c", "d"]
const f = ([...parma], size = 3) => [parma.splice(0, size), parma];

const result1 = f(input,2);
console.log(result1);  //  [["a", "b"],["c", "d"]]

const result2 = f(input);
console.log(result2);  // [["a", "b","c"], ["d"]]

こうすることで変数inputへは影響することがなく 実装することができました

Array.prototype.splice() - JavaScript | MDN
splice() メソッドは、その場で既存の要素を取り除いたり、置き換えたり、新しい要素を追加したりすることで、配列の内容を変更します。

コメント

タイトルとURLをコピーしました