オーバーライド
後輩に質問されて作ったのでUPしておきます。Javaならすぐ書けるのにjavascriptだとちょっと焦りますね。一応先輩としての威厳は保てたはず。
String#toUpperCaseは単に全ての文字を大文字に変えるだけですが、引数で指定された文字だけを大文字にするようにオーバーライドしようと思います。
var originalFunc = String.prototype.toUpperCase; String.prototype.toUpperCase = function(str, flag){ return this.replace(new RegExp(str, flag), function(m){ return originalFunc.call(m); }); };
もしくは
String.prototype.originalToUpperCase = String.prototype.toUpperCase; String.prototype.toUpperCase = function(str, flag){ return this.replace(new RegExp(str, flag), function(m){ return m.originalToUpperCase(); }); };
一つ目のはクロージャで実現されているので、外部には公開されませんが、二つ目のはoriginalToUpperCaseというメソッドが外部公開されます。
なお、使い方はこんな感じ。
"getname".toUpperCase("n"); // getName "getname".toUpperCase("e"); // gEtname "getname".toUpperCase("e", "g"); // gEtnamE
※最初の例がイマイチだったので、ちょっとコードを書き換えました。
javascriptの学習に適した本
- 作者: シェリーパワーズ,Shelley Powers,武舎広幸,武舎るみ
- 出版社/メーカー: オライリージャパン
- 発売日: 2007/05
- メディア: 単行本
- 購入: 5人 クリック: 87回
- この商品を含むブログ (82件) を見る
後輩に借りて読んだ。非常にコンパクトにまとまっていていい感じ。サイ本を読もうとしたけど挫折した人とかにオススメ!
プログラミング初心者というよりは例えばJavaの延長でjavascriptを書いているような人が手っ取り早く体系だって勉強するのに適している感じ。位置づけとしては「初めてのRuby」に似た感じかなと。
IE7が出る前の2007年出版ですが、内容が古すぎて読むのが苦痛ってことはなかったです。
Amazonで「なか見!検索」の対象になっているので、興味がある方は目次を読んでみてはいかがでしょう?
matchの戻り値って
以下は3が返って欲しいんだけど1になるんですねぇ。。
"100.0".match(/\d+/).length
そもそもmatchの戻り値って何だろうと思って調べると・・
typeof "100.0".match(/\d+/)
stringではなくobjectらしい。もっというとこれは配列です。つまりさっきの1っていうのは単に配列の要素数が返ってきてたというわけ。今回はマッチした部分は一箇所だけだけど、複数箇所マッチすることもあるもんな。
というわけで一度文字型に変換してやると期待通り3となります。
"100.0".match(/\d+/).toString().length
正しくはこうかな。
"100.0".match(/\d+/)[0].length
1とtrue
こんなコードを書いている場合に要注意。valueが1の時は「その他!」ではなく「true!」と表示されてしまいます。
if(value == true) { alert("true!"); } else { alert("その他!"); }
これを見てミソ。
alert(1 == true);
これ、trueが返ってきた。ワォ!
「1」と「true」を厳密に見分けるにはこうします。
alert(1 === true);
昔勉強したから知ってたはずなんだけど、忘れてた。地味にはまったよ。
NumberFormat
javascriptでは組み込みで数値フォーマットするような関数は無いみたい。
で、調べてみたところ手軽なサンプルはこれ。正規表現は奥深いなぁ。
http://wiki.type33.com/javascript
var numberFormat = function(num){ return num.toString().replace(/([\d]+?)(?=(?:\d{3})+$)/g, function(t){ return t + ','; }); }
※ただし、整数の場合しかうまく動きません。
focus()
document.getElementById("select").focus()
こんなjavascriptを組んだら、
フォーカスをコントロールに移動できません。コントロールは表示されていない状態、またはフォーカスを受け入れない種類です。
こんなメッセージとともにjavascriptエラーとなった。
ちょっとびっくりしましたが、理由が分かりました。対象となっているSELECT項目が非表示状態だったからでした。
focusを当ててから表示する、というロジックだったのですが、表示してからfocusを当てるようにすれば正しく動きました。ちょっと焦った。
それにしてもエラーメッセージが分かりにくい。。
そういえば関係ないけどIE8が正式リリースされたってね。
http://japan.cnet.com/news/media/story/0,2000056023,20390258,00.htm?ref=rss
文字から数字(整数)へ
文字型の数字を数字型へ(正確には整数に)変換するにはparseInt関数を使う。
parseInt("2.2");
parseInt(2.2);
文字型のものだけでなく、数字型のものを渡してもいずれも「2」が返ってきます。うん、便利。
しかしながら、以下のケースでは嬉しくない結果が返ります。
parseInt("2abc");
これは当然「NaN」になるのかと思っていたのですが、「2」が返ってきます!ビツクリ!!
というわけで思いついたのはこんなの。
parseInt(1 * "2abc");
1をかけることで、強制的に文字型から数字型へ変換しています。この時点で「NaN」になります。
追記
「12 34」もそのままやると「12」が返ってきます。