[JavaScript] 既存のオブジェクトにメソッドを追加する

  • このエントリーをはてなブックマークに追加
  • LINEで送る

小ネタです。
JavaScriptのグローバルオブジェクトには様々なメソッドが最初から用意されています。例えば文字列を扱うStringには、検索置換するreplace()や一部を取り出すslice()などです。ここに自分で用意したオレオレなメソッドを追加することができます。

結論から言うとprototypeで宣言するだけ。以下の例では文字列中のホワイトスペースをすべて削除する、連続するスペースを1つにまとめてくれるメソッドを追加しています。

/**
 * めっちゃtrimするメソッド
 */
String.prototype.trim2 = function(){
  return(
    this
        .trim()                     // 両端のスペースを削除
        .replace(/\r|\n|\t/g, "")   // 改行とタブを削除
        .replace(/\s{2,}/, " ")     // 複数のスペースを1つにまとめる
  );
}

実際に文字列の後ろにチェーンして利用できるようになります。

" foo   bar ".trim2()  // "foo bar"

なお、利用する箇所よりも前にprototypeで定義しないとエラーとなるのでご注意を。またアロー関数式だとthisの意味が変わってくるのでご注意ください。

- Sponsored Link -

関数じゃダメなの?

普通に関数として定義しても良いのですが、連続して処理を行う場合に関数をネストしまくると非常に見づらくなるのを、メソッドチェーンであれば防ぐことができます。

// メソッドチェーン方式
"Hello".foo().bar().bazz()

// 関数でネストする
bazz( bar( foo("Hello") ) )

ただし、汎用的に利用するわけでないようなメソッドや、(当然といえば当然ですが)オブジェクトに関連性のないようなメソッドは追加すべきではないでしょう。用途に応じて使い分けることになります。

参考ページ

- Sponsored Link -

同じカテゴリの記事

Donate

投げ銭お待ちしております!

BTC3A9nH1j7qQdKrSTrmnEdweo6zPqpHBmkxC
ETH0x1aE0541198D1F9f2908a25C35032A473e74D3731
XPXaQ9zv65F9ovfoMBrFGiPRG47aSHFhy8SX
MONAMTKgzSiS5BDueZkRCHySih24TGFwHThaDQ (MonaCoin)
ZNYZhnpf4RFYVQTAQiyoJg9dGoeC4bgT3BoSy (BitZeny)

ご質問やリクエストなどお気軽に。メールアドレスの入力は任意です。書き込みが反映されるまで時間がかかります。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください