こんばんは。今日はReact Native(というよりはJavaScript)小ネタのご紹介です。
それでは早速参ります。
実現したいこと
React Native (JavaScript)で、文字列中に改行が含まれているかをチェックしたい。
実現方法
こちらのStack Overflowが参考になりました。
https://stackoverflow.com/questions/10950538/how-to-detect-line-breaks-in-a-text-area-input
numberOfLineBreaks = (enteredText.match(/\n/g)||[]).length;
何をしているのか、もう少し見ておきます。
はじめにmatch構文です。
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/match
構文:
match(regexp)引数:
regexp
正規表現オブジェクトです。
regexp
がRegExp
ではないオブジェクトであった場合、暗黙的にRegExp
への変換がnew RegExp(regexp)
を使用して行われます。一切引数を与えずに
match()
メソッドを使った場合、空の文字列 1 つを持つArray
、[""]
が得られます。
返値:Array
を返します。これはグローバル (g
) フラグの有無によって内容が変わります。一致するものが見つからなかった場合はnull
を返します。
なるほど、引数には正規表現をオブジェクトを渡して、正規表現に一致した結果を返す、という構文なのですね。
/¥n/gは、文字列”¥n”(改行)を文字列全体にわたって(/g)チェックする、という意味の正規表現のようです。match構文の説明の中でも以下のように説明があります。なるほど、/gがない場合には最初に一致した要素だけ返すわけですね。
g
フラグがあった場合は、正規表現全体に一致したすべての結果を返しますが、キャプチャグループは返しません。Mozillaのページより
g
フラグがなかった場合、最初に完全に一致したものと、それに関するキャプチャグループを返します。この場合、返される要素には下記の追加のプロパティが存在します。
||[]は、改行(line break)が一つもない場合に、後ろのlengthが計算できるようにするための空の配列を定義するための構文です。
確かに、これで改行の数をカウントできそうです!勉強になりました!
おしまい
コメントを残す