「length」プロパティを使って文字数カウント作ってみた

ただ文字をかうんとするやつ備忘録

※2019.03.22 onメソッドについて追記しています。

こんにちは。トミーです。
JavaScriptの本を見ていたら、文字列や配列の長さを取得する「length」を発見しました!

lengthとは

直訳すると「長さ」という意味です。
文字列や配列の長さを取得することができます。
文字列の長さや配列の要素数を取得することができるプロパティです。

面白そうと思って手を動かし作成したものが下記の文字数カウントです。
想像以上に簡単に実装できました!

作成した文字数カウントはこちら

下記は今回記載したソースコードです。

文字数カウントが行えるサービスはたくさんありますが、広告や余計な情報が多いですからね。
文字数カウントだけに特化したページを作成してみました。(特に需要なしw)

onメソッド

jQueryのonメソッドについて、今まで「click」の存在が目立ち過ぎていたため、他の存在を知りませんでした。

発火するタイミングをうまく利用すれば面白いことができるみたいで、、、

keydown キーが押し下げられた時に発生
keypress キーが押された時に発生
keyup キーが上がった時に発生
change 要素がフォーカスを得て値の修正が完了した時に発生

なんと、入力した文字をリアルタイムでカウントすることもできました。
他にもコピーできる機能や半角を判断するコードなど足したものをver.2として作成しています。
作成した文字数カウントver.2はこちら

下記は今回記載したソースコードです。

まとめ

文字列や配列の長さを取得する「length」を扱ってみたら簡単で便利でした。
今回はとっさの思いつきで文字数カウントを作成してみましたが、文字数をカウントできるということは、何文字以上は〇〇の処理など条件分岐も合わせて使用すると夢が広がりますね♪♪

この記事が気に入ったら
いいね ! しよう

Twitter で

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)