エンジニアの発信する【JavaScript】情報　最新ITブログ－ DODA

エンジニアが発信する【JavaScript】の記事を集めました

エンジニアが作る最新ITブログトップ>エンジニアの発信する【JavaScript】

2011年01月18日

[Amateras]requireに対応

Javascriptエディタですが，requireに対応してみました．JSのコードでrequire(”hoge”)とすると，hoge.jsを探しにいき，exportsを持ってきます．./hogeのような指定の場合は，そのJSの相対パスになりますが，hogeの場合はプロジェクトのプロパティで指定したパスで探しに行きます(なので，パスを;区切りで指定してください)．あとは，バリデーションオプションもプロジェクトのプロパティに加えました．内部的にはClosure Toolsを使っているので，オプションの説明 ...

編集者: shinsuke | このブログのURL |この記事のURL

2011年01月15日

[Amateras]JSエディタのスナップショットビルド

AmaterasのJavascriptエディタを改良しているけど，より多くの方にテストしてほしいな〜とか思い，スナップショットビルドができるようにしてみました． http://amateras.sourceforge.jp/files/htmleditor/ 試すためには，そのzipの中のtk.〜というディレクトリをEclipseのdropinsディレクトリ以下に置いてください．pluginsとかdropinsとかに既に旧バージョンのjarとかがあると，変な動きになると思うので，あれば取り除いてくださ ...

編集者: shinsuke | このブログのURL |この記事のURL

2010年11月11日

2010年11月10日のツイート

@nobusue: #mycomj URL 【コラム】イマドキのIDE事情 (94) 最強のJavascript IDE「WebStorm」を試してみる 2010-11-10 18:40:29 via マイコミジャーナルログイン @nobusue: WebSocketでWebは変わる？大胆予想！ - ＠IT URL 興味深いです。 2010-11-10 12:51:48 via web @nobusue: #JGGUG 勉強会後の飲み会後、さらに1:00からテレコンと ...

編集者: nobusue | このブログのURL |この記事のURL

2010年11月02日

[HTML][Javascript]埋め込まれたiframeをリロードさせる方法

iframeを更新させるためにこんな処理が書いてあって、

<iframe id="foo" name="foo" src="/bar.html"></iframe>

<a target="foo">更新</a>

一応動くには動くんだけど、a要素の使い方がなんだかなーと。

軽く調べても出てこなかったので、ちょいと試してみたら

document.getElementById("foo").contentWindow.location.reload();

でいけたっぽい。Javascriptだけど。（ちなみにreload(true)とすればスーパーリロードになるよ）

"contentWindow.location.reload()"で調べ直したら色々出てきた。

編集者: holidays-l | このブログのURL |この記事のURL

2010年10月22日

[Javascript]jQuery.getでtypeを指定しないと、MIME-Typeによって挙動が変わってしまう。

（jQuery1.4.2）

ある日、JSONテキストを受け取ってevalする処理がエラーを吐くようになった。こういうコード。

jQuery.get('/foo.json',
           function(json) {
               var foo = eval('(' + json + ')');
           });

思い当たるのは、Content-Typeがtext/plainだったのをapplication/jsonに変更したこと。

実際にそれが原因だったのだけれども。

/* MIME-Type: text/plain       */jQuery.get('/foo.json', function(json) {typeof json == 'string';});
/* MIME-Type: application/json */jQuery.get('/foo.json', function(json) {typeof json == 'object';});

/foo.jsonのMIME-Typeがtext/plainだとコールバックに渡ってくるのは文字列なんだけども、

application/jsonだとオブジェクトが渡ってきた。（それを更にevalしちゃってたのでエラーになっていたという話）

安直にevalを外すという修正をしてしまうと対象リソースのMIME-Typeに左右されるようになってしまうので、getJSONに統一するようにした。

getJSONは対象リソースがJSONだと明示するメソッドで、

/* MIME-Type: text/plain       */jQuery.getJSON('/foo.json', function(json) {typeof json == 'object';});
/* MIME-Type: application/json */jQuery.getJSON('/foo.json', function(json) {typeof json == 'object';});

のように、MIME=Typeがどうなっていようとコールバックにはオブジェクトが渡ってくる。

ってかこれは

/* MIME-Type: text/plain       */jQuery.get('/foo.json', function(json) {typeof json == 'object';}, 'json');

のようにjQuery.getにタイプ'json'を渡してあげるのと同じことなんだけどね。

毎回'json'を渡すよりは、getJSONが用意されてるんだからそっち使った方が良いかなーと。

編集者: holidays-l | このブログのURL |この記事のURL

2010年10月08日

2010年10月07日のツイート

@nobusue: I’m at JR三島駅. URL 2010-10-07 08:30:00 via foursquare @nobusue: @so_zaneli 全部Javascriptで画面遷移なしだったので、最後にフォームを送信するとこ以外はあんまりサーバー側の能力は関係ないかも。 2010-10-07 02:06:23 via tweetz to @so_zaneli @nobusue: 企業はなぜNoSQLに興味がないのか？ URL 2010-10-07 ...

編集者: nobusue | このブログのURL |この記事のURL

2010年10月05日

子供の算数の問題とJavascript

昨日、子供（小学5年生）に算数の問題を聞かれた。次のような問題であった。

ある数の約数の和からその数自身を引いた数を計算します。たとえば、4であれば約数が1,2,4であり、4は含めないので、1+2=3のように計算します。

問1)この時、10までの数で、この計算結果がその数自身になるものは何ですか？
問2)100までの数で、この計算結果がその数自身になるものが1つだけあります。その数は何ですか？

-------
1番の問題は、計算を数回もすれば、終わりますから簡単です。子供も解けていました。（6ですね。1+2+3=6）ただ、2番の問題は力ずくで解けば、いつかは解けると分かっていても、何かいい方法があるかと、子供は私に聞いてきたわけです。

ただ、私もしばらく考えて、いい方法が思いつきませんでした。仕方がないので、11から順番に計算することにして、素数はどう考えてもスキップできるので、それは除外するにしても、延々計算しました。そして、あきらめかけていたところ、28で1+2+4+7+14=28となり、正解にたどり着けました。でも、問題に「1つだけある」とわざわざ書いてくれていたので良かったのですが、そうでない場合は困ったと思います。
気になったので、Javascriptで解くことにしました。ある数の約数を調べるためには、割り切れるかを調べればいいのですが、全部調べるのはもちろんばかばかしいので、その数の平方根までを調べればいいわけです。たとえば、180の約数で2が見つかったら90（=180÷2）も約数。ただ、ひとつ注意しないといけないのが49のような場合7×7ですが、7を2回エントリーさせると間違いです。

上のJavascriptでは、他のプログラムにも応用しやすいように、遭えてその数自身も総和の計算に入れておいて、後から算数の問題に合わせる形で引くようにしてあります。このプログラムを使えば、10000までの数でこのような計算結果になるのは、「6」「28」「496」「8128」の４つだとすぐに分かります。

どのような法則があるのかと調べてみると、496を素因数分解すると（2の4乗)×31となります。31は、（2の5乗-1)です。8128を素因数分解すると、（2の6乗）×127ですが、127は（2の7乗-1）です。28は(2の2乗)×7で、7は（2の3乗-1）です。6=2×3で、3は（2の2乗-1）です。

では、なぜ、（2の3乗）×（2の4乗-1）、すなわち8×15=120はエントリーされないかといえば、15は素数でないためのようです。8128の次に、この問題に当てはまる数を予測してみると、（2の8乗-1）は255で素数でないからダメぽいです。（2の9乗-1）は511であり、この数は7で割りきれてしまいます。（2の10乗-1）は1023ですが、これも11で割りきれてしまいます。結局（2の13乗-1）=8191が素数ですから、（2の12乗）×8191=33550336となります。

ただ、Javascriptでは、200万ぐらいまでの数を連続的にJavascriptで調べることはFirefoxでかろうじてできましたが（IE9はもっと低い数で駄目。）、それ以上はハングしたり駄目でした。ですから、33440336はこの条件に当てはまることは分かりますが、そこまでに登場する数でそのような数が他にないという証明方法は分かりませんでした。

結局、これは、昔、高校数学で習った、
1+2+(2の2乗)+（2の3乗）+・・・・・(2のn乗)=2の(n+1)乗-1
の法則と関連している気もしますが、上であげた推察以外のパターンで、この問題に適合する数が存在しないのかどうかは分かりませんでした。文系に進み、まともに大学の授業も聞いていなかった私にはこれが限界です。

最初の子供の算数の問題に戻りますと、28という答えを導き出すまでに、素数を除いて計算しまくる以外に、もっとエレガントな方法があったのでしょうか？　もし分かる人がいれば教えてください。ただし、小学校５年生の問題であることを忘れずに。（そもそも素数かどうかの判断も、暗記しているか約数がないかを計算しているはずので、飛ばしていることにならないかも。）

編集者: shimax | このブログのURL |この記事のURL

2010年10月03日

IE9でlightboxが動作しなくなった場合

まったく同じスクリプトでも、DocTypeを削除したら動きました。Lightbox2のサイトのソースを保存して確認しました。

DOCTYPEが指定されている場合、this.imageArray[imageNum][0] != imageLink.hrefの部分が気に入らないらしいのですが、細かい原因は探していませんが、このDOCTYPE宣言でJavascriptの挙動が変わるのは、珍しいような気がします。いつもいつもDOCTYPEを変えられるわけではないでしょうが、時間がないときは、この応急措置でうまくいくかもしれません。

また、typeof window.external.addFavoriteの件もそうでした。こちらは、逆にDOCTYPE宣言がある場合は動きました。さらに、別件で、これは私のJavascriptの書き方の問題もあるのですが、IE8でも問題なく動いてくれていたのに、動かなくなったスクリプトをご紹介します。

DOCTYPEを宣言している場合、スクロールとともに、オブジェクトもスクロールさせるような時に、
は動作しません。

なら動作します。以前、古いブラウザでもこのような挙動（厳密な解釈）があったと思いますが、最近はこれで動いていたので、まあいいかとなっていました。これはIE9のバグではなくて、私のJavascriptの問題でしたね。

また、読売新聞など他社のサイトを見ていると、debuggerを有効にしている場合、かなり鬱陶しくエラーが出ます。原因を調べてみると、ある広告会社のJavascriptにこのようなJavascriptがありました。（抜粋して、書き換えてあります。）

このJavascriptの場合、「Invalid this pointer used as target for method call」となりますが、これはDOCTYPEがの場合。DOCTYPEなし場合は「abc」が出力されます。

なら動きます。また、

も、問題なく動きます。よくばりすぎると駄目みたいです。

編集者: shimax | このブログのURL |この記事のURL

2010年09月20日

[Groovy][Javascript][JSON]GroovyでJSONを使おう

はじめに JSONとGroovyのマップは非常に形式が似ている。違っているのはJSONの方はマップに {} を利用するのに対して Groovyは [] を使う点くらいだ。ということで、{} を [] することでJSONをGroovyObject*1に変換するクラスを書いてみた。ソース使ってみる def text = ’’’ [ ["aaa", "bbb", "ccc"], { "key1" : "va ...

編集者: ふも | このブログのURL |この記事のURL

2010年08月02日

HPの小技

ちょっと仕事関連でＨＰを作成した。
CSSをページの枠組み用と装飾用の２つに分けたり、SEO対策で新規ページがどのくらいで上位に顔を出すのか実験してみたり、新しい試みをしている。

ページの作成を簡略化するため、ヘッダー部分、ページ遷移させるナビゲータ部分、コンテンツ表示部分にiFrameで分割したベースファイルを枠組みとして作成した。コンテンツはナビゲータ部分でクリックされたらページ書き換え、という方法を取ってみた。
ただ、検索エンジンはコンテンツのファイルにもリンクを作り、そのリンクを開くと「コンテンツのファイルだけ開く」という状態になり、他のページを見ることができなくなるケースをよく見かけるが、それだとちょっとおマヌケなので、何とかできないか、と検討した。
要するに、コンテンツのファイルを開こうとすると、それを表示するための枠組みであるベースファイルを表示し、更に該当するコンテンツを流し込めればよい訳だ。
しかし、Googleなどで検索してもなかなかいいやり方が見つからない。

情報を拾い集め、それをJavascriptで組んでみて実現できるか試してみた。
まず、コンテンツファイルが開かれるとhref.locationでベースファイルを表示するようにする。トップレベルに表示された時のみ処理を動かすようにしておけば問題なくクリア。
問題は、href.location で表示したファイルに「さっきどのファイルが開いていたか」の情報をどのように渡せばよいか、であった。よく知らなかったのだが、href.location で、URLにパラメータを付加できるとの情報があったので、それを利用することで難なくクリア。

かくして、コンテンツのファイルが開かれると、ベースのファイルを読み込み、そのコンテンツ表示部分に該当コンテンツを表示するということが可能になった。

結構面倒くさそうであったが、意外と簡単であった。Javascriptのオブジェクトモデルと、HTMLの仕様について少しだけ理解が深まった気がする。

同じテーマの最新記事

編集者: ぽせい丼 | このブログのURL |この記事のURL

前のページへ次のページへ