🍣

文字列にmap関数を適用する

2024/04/14に公開

はじめに

JavaScriptにはArray.prototype.map()という配列の各要素に対して、指定した関数を呼び出した結果を格納した新しい配列を作成します。たとえば以下は配列の各要素を3倍する例です。

const array1 = [1, 2, 3, 4];
const map1 = array1.map((x) => x * 3);
console.log(map1);

しかし、map()は配列に対して非常に有効ですが、文字列に直接適用することはできません。文字列を配列のように一文字ずつ操作しようとした場合、まず文字列を配列に変換する必要があります。この制限はJavaScriptが文字列を不変のデータ型として扱うため生じます。今回のブログでは、文字列に対してmap()のような操作を行いたい場合にどうすればいいかを探求します。具体的には、文字列を配列に変換し、変更を加えた後で、再び文字列に戻す方法を紹介します。

実装したコード

実際に実装してみます。コードは以下のようになります。

const mapString = (str, fn) => 
  str.split('').map((c, i) => fn(c, i, str)).join('');

console.log(mapString('lorem ipsum', c => 'aeiou'.includes(c) ? '' : c));

解説

const mapString = (str, fn) => 
  str.split('').map((c, i) => fn(c, i, str)).join('');

実際に渡す文字列がstrに、文字列に対しての処理がfnに入ります。文字列をsplit()を使用してそれぞれの文字の配列にし、それに対してmap()を適用していきます。そして、各文字列に対して処理が完了した後に、join()で結合します。

console.log(mapString('lorem ipsum', c => 'aeiou'.includes(c) ? '' : c));

呼び出し側です。今回は文字列の中に母音があった場合に削除する処理を行なっています。上記の場合だとコンソール上にはlrm psmと出力されます。

おわりに

今回は、文字列に対してmap()を使って、各文字列に対して処理する方法をまとめました。関数の部分を自分なりに変更すれば他にもいろんな処理ができるので、実際にいろいろと試してみてください。最後まで読んでいただきありがとうございました。

参考文献

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map
https://www.30secondsofcode.org/js/s/map-string/

Discussion