タグ

ブックマーク / mindcat.hatenadiary.org (9)

  • JavaScriptの文字列を反転する10の方法とそのパフォーマンス - 風と宇宙とプログラム

    はじめに JavaScriptで文字列を反転する10の方法を(無理矢理?)思いついたので、ちょっと簡単に紹介したい。また、それぞれについて、各ブラウザでパフォーマンスを測定してみたので、その結果も合わせて載せる。 文字列のStringオブジェクトには、部分切り出し(substring, slice)や置換(replace)、連結(concat)など豊富な機能があるのに、反転(reverse)機能はない。Arrayのreverseはあるのに、Stringのreverseがないのはどうしてなのだろうか。 各ブラウザとそのバージョンは以下の通り: Chrome Firefox Opera Safari IE 13.0.782.112 m 6.0 11.50 5.1(7534.50) 8.0.7600.16335 rev01: C言語的発想 空の配列を作って、そこに元の文字列の後ろから1文字つづ入

    JavaScriptの文字列を反転する10の方法とそのパフォーマンス - 風と宇宙とプログラム
  • HTML5 Canvasのブラウザによって異なる微妙な振る舞いについてまとめてみた。 - 風と宇宙とプログラム

    はじめに CanvasはHTML5とは切り離された独立した仕様(HTML Canvas 2D Context)になっているようですが、現状のブラウザ上でのCanvasのについて、普段はあまり気にしない微妙な振る舞いについて調べた結果をまとめてみました。 調べたブラウザの各バージョンは以下の通りです。 Firefox Chrome Safari Opera 3.6.8 6.0.490.1 dev 5.0.1 10.61 線を描く (lineTo) ただの直線を描くだけのlineToですが、その単純なものにも、恐らく、多くの人が普段は気にしないような問題があります。それは座標値とアンチエリアスです。詳しく見る前に、実際の結果を示しましょう。下記のイメージ中に描かれている線は、いずれも線幅(lineWidth)が1の線です。 (左から、Firefox, Chrome, Safari, Opera

    HTML5 Canvasのブラウザによって異なる微妙な振る舞いについてまとめてみた。 - 風と宇宙とプログラム
    rikuo
    rikuo 2010/08/16
  • JavaScriptのundefinedというクセ者のいろいろ - 風と宇宙とプログラム

    はじめに JavaScriptの初心者にとってundefinedというのはちょっと混乱を招くものらしい。nullとの違いや使い分けがよく分からなかったり、数値やブール値との比較が不自然だったりするのが原因と思われる。ここでは、そのようなundefinedのいろいろについてまとめてみた。 ECMA262規格では undefinedとnullに関して、ECMA262規格では最初に以下のような記述がある。 4.3.9 undefined value primitive value used when a variable has not been assigned a value. 4.3.11 null value primitive value that represents the intentional absence of any object value. undefinedは変数に

    JavaScriptのundefinedというクセ者のいろいろ - 風と宇宙とプログラム
  • FlashがHTML5より優れている点を敢て挙げてみる - 風と宇宙とプログラム

    HTML5のVideo/AudioタグとCanvasなどがあればFlashが要らなくなるのではとの議論があるが、そう簡単にはFlashが不要になるとは思えない。僕個人としては、Webの世界に1ベンダーのプロプライエタリでクローズドなものがあることは好ましくないと考えているが、ひいき目にみてもVideo/Audio+CanvasタグではFlashには適わないと思える点がある。 奇しくも、GoogleChromeにFlashを正式サポートすることを発表したが、これまで脱Flashへ向かうものと思っていたのでちょっと驚きである。これはAppleを睨んでの戦略的・政治的な決定であると思うが、そんな泥臭い話とは切り離して、Flashの方がHTML5より技術的に遙かに優れていると僕が感じている点を敢て以下に挙げてみた。 コンパクトなデータ表現 SWF中にはタイムラインベースの静的なベクターグラフィッ

    FlashがHTML5より優れている点を敢て挙げてみる - 風と宇宙とプログラム
    rikuo
    rikuo 2010/04/01
  • HTML5 Canvas のarcTo関数の実装が未だにorz - 風と宇宙とプログラム

    2年近く前にCanvas APIの実装状況を網羅的に調査したことがありますが、ブラウザごとに実装がいろいろ異なっていていました。その中で一番目立ったのがarcTo関数の実装の違いです。改めて調べてみました。 ブラウザのバージョンは以下です。 Chrome Safari Opera Firefox 4.0.249.43 4.0.4(531.21.10) 10.10 3.5.7 IEはExplorerCanvas r3を見てみましたがarcToは実装されていませんでした。 テストケース 今回、新たに簡単なテストケースを作りました。左図のような絵を描画するものです。arcToだけを使って描画しています。ちょっとキモイ絵になってしまいした。 Chromeではこうなります まあまあですが、描かれるべき線と左目の点がありません。 左目の点がないのは、arcToの問題もありますが、さらに長さゼロの線に対

    HTML5 Canvas のarcTo関数の実装が未だにorz - 風と宇宙とプログラム
  • JavaScriptのswitch文の速度はブラウザの違いでこんなにも差があった。 - 風と宇宙とプログラム

    はじめに JavaScriptswitch文は、CやJavaと異なりcaseのところに任意の式が書けるため、実行時にcaseの式も評価されるので基的にはif-else文の並びと類似のものになります。つまり、caseの数に応じてパフォーマンスも低下すると予想されます。当にそうなのか確認してみました。 測定した各ブラウザのバージョンは以下の通りです。 Firefox Chrome Safari Opera IE 3.5.6 4.0.249.30 4.0.4 (531.21.10) 10.10 8.0.6001 caseが数値リテラルの場合 パフォーマンスを測定するテストコードは下記のような簡単なものです。caseが1000個あるswitch文を10万回繰り返して実行したときの時間を測定しました。perf_test()関数の引数vに与える値に応じてcaseの条件で一致する場所が変わります。

    JavaScriptのswitch文の速度はブラウザの違いでこんなにも差があった。 - 風と宇宙とプログラム
  • JavaScriptのビット演算の仕組みを理解する - 風と宇宙とプログラム

    はじめに JavaScriptの数値表現はIEEE754の64ビットの倍精度型浮動小数ですが、ビット演算はどのように定義されているのでしょうか。今回はそのビット演算について解説します。この仕様は10年以上前から変わらないのですが、改めてその部分が書籍などでどのように解説してあるかを見ると、and, or などのビット演算が教科書的に書かれているだけで、任意の数値に対してどう定義されるかについてはほとんど説明されていません。 JavaScript以外の言語では? JavaScriptについて説明する前に、他の言語ではどうなっているでしょうか。ここでは、ちょっと手を抜いて実際に実行した結果のみを示します。バージョンによっては結果が違うかも知れません。 まずは、一番単純な 0 との orを調べてみました。つまり x | 0 の結果です。 x C (gcc) Java Ruby Perl -123

    JavaScriptのビット演算の仕組みを理解する - 風と宇宙とプログラム
  • JavaScriptで ""+x を文字列変換に使うのは気持ち悪い - 風と宇宙とプログラム

    JavaScriptやブログなどで非常に良く見かけるのだが、数値などの文字列でないものを文字列に変換する方法として var s = "" + x; のように空文字との連結によって行っているが、私としてはちょっと気持ち悪さを感じる。もちろん、間違いではない。確かにxは文字列に変換される。+の左側が空文字でなく、何かの文字が書かれている場合には、普通にやることだ。空文字との連結に違和感がある。じゃ、どう書くかというと、 var s = String(x); と書く。なんか、タイプ数が増えるし面倒じゃん?という声が聞こえてきそうだが、Stringという引数を文字列に変換するという目的そのものの関数が定義されているのに、わざわざ + 演算子を使うことが気持ち悪いのである。しかも、+ 演算子という多層演算子を使うのでコードが読みにくい。さらに、上のような書き方があまりにも普及してしまっていて、S

    JavaScriptで ""+x を文字列変換に使うのは気持ち悪い - 風と宇宙とプログラム
  • FAQ形式によるJavaScriptの本質がわかる超入門 - 風と宇宙とプログラム

    はじめに JavaScriptは簡単な言語のようでいて、実は奥が深く、初心者にとってなかなかその質がわかりにくい言語です。ここでは、JavaScriptの言語的エッセンスを理解できるようなものをFAQ形式で書いてみました。ご意見や誤り等を指摘してもらえたら嬉しいです。 なお、JavaScriptの標準化であるECMAScriptは、今年末にEdition 5 がリリースされる予定です。このFAQは、現在のバージョンであるEdition 3をベースにしています。 ECMAScriptって何ですか? ECMAはEuropean Computer Manufacturer Association(欧州電子計算機工業会)の略で、標準化団体です。NetscapeのJavaScriptMicrosoftのJScriptをベースに、純粋なプログラム言語部分を抽出したものをECMAで標準化したスクリプ

    FAQ形式によるJavaScriptの本質がわかる超入門 - 風と宇宙とプログラム
  • 1