タグ

javascriptに関するxmx3のブックマーク (91)

  • AJAX APIs Playground

    Stay organized with collections Save and categorize content based on your preferences. The Google APIs Explorer is a tool available on most REST API reference documentation pages that lets you try Google API methods without writing code. The APIs Explorer acts on real data, so use caution when trying methods that create, modify, or delete data. For more details, read the APIs Explorer documentatio

    AJAX APIs Playground
  • Haida's weblog: JavaScript と高階関数

    11/23/2007 JavaScript と高階関数 JavaScript における高階プログラミング という記事を読みました。 高階プログラミングとは高階関数を使ったプログラミングのことです。高階関数とは?高階関数について、以下のような記述があります。プログラミング言語において、関数を引数にしたり、あるいは関数を戻り値とするような関数の事である。引数や戻り値の関数もまた高階関数となり得る。これは主に関数型言語やその背景理論であるラムダ計算において多用される。数学でも同様の概念はあり、汎関数と呼ばれる。Wikipedia -- 高階関数 関数を引数にしたり、関数を戻り値とする手法って、RubyJavaScript では当たり前に使います。 例えば、クロージャを使うって関数を返り値として使う例を見てみます。function multiple(a){ return function(n

  • [JavaScript](function() {})()とnew function() {}の違いがわかった / LiosK-free Blog

    2007-08-29 カテゴリ: Client Side タグ: JavaScript Tips コンテキストが違うのか。 まずは↓のコードを参照。 function func() { window.alert(this == window); } func(); /* true */ new func(); /* false */ newをつけずに普通に関数呼び出しをした場合は、thisはその関数が属しているオブジェクトを参照する。newをつけてコンストラクタとして呼び出すと、thisは新たに生成されたオブジェクトを参照する。 普通に関数宣言した場合は、windowオブジェクトのプロパティとして宣言されるから、newをつけずに呼び出すとthisはwindowオブジェクトを指すようになるようだ。 無名 したがって、 (function() { window.alert(this == wi

  • エディタで編集するだけでhtmlファイルをリロードするJavaScriptライブラリ - 素人がプログラミングを勉強していたブログ

    追記:最速インターフェース研究会 :: Firefoxでの開発を高速化する自動リロードスクリプトで既出でした。 デモを 2008-11-03_1209 - javascripter's library に置いた。 ライブラリ体は javascripter's gist: 21788 — Gist にある。 (function () { var last = null; (function request() { with (new XMLHttpRequest()) { open('get', location.href, true); send(null); onload = function () { if (!last || last == this.responseText) { last = this.responseText; setTimeout(request, 500)

    エディタで編集するだけでhtmlファイルをリロードするJavaScriptライブラリ - 素人がプログラミングを勉強していたブログ
  • JavaScript はどのように実行されるか - IT戦記

    JavaScript はどのように実行されるか Safari*1 の実装を例に JavaScript はどのようにして実行されているかを書く。自分用のメモ。日語の出来は気にしない 1. ブラウザを起動して以下のようなページを開いたとする <html> <head> <script> var a = 1; var b = 2; alert(a + b); </script> </head> <body> </body> </html> 2. インターネットからデータが到着する そうすると WebCore::FrameLoader::write という関数に生の文字列が渡される。型は char* だ。 http://trac.webkit.org/browser/trunk/WebCore/loader/FrameLoader.cpp#L990 この関数の中では、到着した文字の文字コードを解

    JavaScript はどのように実行されるか - IT戦記
  • Safari4 と IE8 で実装された DOM Storage とは何か - IT戦記

    はじめに 皆様 JavaScript のスピード競争が激化し、 ECMAScript 3.1 の仕様の策定が進むなど、激動の JavaScript 時代をいかがお過ごしでしょうか。 さて今日は、今、ちまたで大ブレイクの兆しを見せている DOM Storage という仕様を紹介したいと思います。 DOM Storage とは何か まず、 DOM Storage とはどんなものなのでしょうか。 とても簡単に言ってしまえば、とてもたくさんのデータが保存できてサーバーに自動で送られない Cookie みたいなものです。 さらに、 Cookie とは違って JavaScript からとても扱い易く作られています。 では、この DOMStorage の具体的なソースコードを見てみましょう。 <!DOCTYPE html> <html> <head><title>DOMStorage の使い方</tit

    Safari4 と IE8 で実装された DOM Storage とは何か - IT戦記
    xmx3
    xmx3 2008/09/24
    DOMStorage とはどんなものなのでしょうか。とても簡単に言ってしまえば、とてもたくさんのデータが保存できる Cookieです
  • オレの名は「ジェイ・スクリプト」…… - in between days

    以下、郷田ほづみの声でお読みください。 オレの名は「ジェイ・スクリプト」。20世紀最末期の「第一次ブラウザ戦争」でエース部隊に徴用され、最前線で殺戮を繰り広げた。オレたちに課せられた課題は重大だった。相手方ブラウザの殲滅。オレたちはマイクロソフト帝国の最新鋭上陸艦「IE4」に搭載され、次から次へとコードを実行した。戦いは熾烈を極めた。オレたちはどんな汚いコードでも動いた。カーソルをクマさんに変える。アイコンを点滅させる。今日のお知らせをポップアップさせる。世界時計をスクロール表示させる。それが果たして当にそのウェブページに必要なユーザビリティなのかを問うこともなかった。しかしいつしかオレたちは気づいた。敵艦「NN4」に搭載されているのもオレたちとまったく同じスクリプトなのだと。やがてオレたちが属する帝国が領土のほぼ九割を制圧するに至り、戦争は膠着状態にはいった。敵国は壊滅されたかに見えた

    オレの名は「ジェイ・スクリプト」…… - in between days
  • ハタさんのブログ : Javascriptによる大規模開発の覚え書き

    未だに半年前のエントリにブクマされるみたいなので、もう少しjavascriptについて書いてみる。 今回は大規模化開発におけるJavascriptの注意点とかそういうの。当てはまらない環境の方もいます。(しかも基的な事だらけで大したことは書いてないです) ほぼリッチクライアントを主目的としたjavascripterとコードを対象とします。 どちらかというと、ライブラリを提供する側の視点から 1.ログを出力せよ あなたが書いたコードは遅い、と必ず言われます。なので言われる前から、自分の書いたコードの処理時間をログするようにしましょう。 次のような処理時間を計測するロガーを作ります。 var TraceLog = function (){ this.startTime = -1; var outer = document.getElementById('_outer'); if(oute

  • ハタさんのブログ : Javascriptによる大規模開発の覚え書き。高速化編

    前回書いた「Javascriptによる大規模開発の覚え書き」が凄いことになってました。 今回は、省略した「5.高速化せよ」について書きます。 僕にとってjavascriptは非常に高速な言語です。それは何が高速か 開発速度が高速である 開発速度、及びそこに至るまでの修得速度はとても高速です。動的言語を上手く操る開発者はもちろん、開発に不慣れな(言葉が悪いけど)新人達でさえ「動く」モノをサクっと作ってしまえる。 また、プラットフォーム(? というかブラウザ)が広く普及しているので、ググればスグに問題解決もできる。 それにローカルで簡単に作れる。javascript、それは動作環境を含めて高速です。 高速にUI操作ができる(UI操作が非常に簡単である) swingとかでUI操作をするには多くのオブジェクト操作をしなければならないけど、javascript(もといDHTML)は非常に簡単に

  • 具体例で説明するデザインパターン - てっく煮ブログ

    JavaScriptデザインパターンってなんだかたいそうなものに考えられがちだけど、実は、そこかしこのライブラリや仕様に取り込まれていることが多い。「デザインパターン分からん」とか「で、どうやって使うのよ」と悶々としている人には、「どういうところで使わているのか」を知っておけばイメージも沸きやすいし、意外にたいしたことないんだな、ということが分かるんじゃないだろうか。そこで、JavaScript やその周辺の技術で、デザインパターンがどのように使われているかを紹介してみることにする。ここでは、GoFの順番に沿って、以下の11個のパターンを取り上げる。生成に関するパターン Factory MethodAbstract FactoryBuilderPrototypeSingleton構造に関するパターン AdapterComposite振る舞いに関するパターン Chain Of Respon

  • 次の JavaScript の仕様はこうなる! ECMAScript 3.0 から 3.1 への変更点まとめ - IT戦記

    はじめに JavaScript の標準仕様である ECMAScript 3rd Edition (ECMAScript 3.0) が 9 年ぶりにバージョンアップしようとしています。 実は、これまでも様々なバージョンアップの案が上がっては消え、また上がっては消えていました。 しかし、今回のバージョンアップには今までと違う点が一つだけあります。 それは、現時点での主要な ECMAScript インタプリタ(JavaScript の実行エンジン)を作っている全団体(以下を参照)がこの仕様に同意したことです。 Mozilla (Firefox) Apple (Safari) Microsoft (Internet Explorer) Opera (Opera) Adobe (Flash) Yahoo (Yahoo Widget) Google この同意は JavaScript のこれからを大きく

    次の JavaScript の仕様はこうなる! ECMAScript 3.0 から 3.1 への変更点まとめ - IT戦記
  • Firebugクックブック #1 - bits and bytes

    最近の中学生のはじめてのプログラミング言語がJavaScriptだったりするこの時代、最も使いやすいJavaScriptの実行環境であるFirebugは現代のコマンドラインです。UNIXコマンドラインでgrepやuniqを使って、日常の細々した処理を行うのと同じようにFirebugとjavascriptを使いこなせると、日常作業のちょっとしたことをさくっとこなすことができます。ちょっとした作業だから手作業でやってもいいけど自動でやればミスったりしないし、気分的には楽なので自動でやりたい、という作業がけっこうないでしょうか。例えば、ページの中の特定の部分の文字列をリストにしてテキストファイルに保存したい、とか。 そこで今回は私が普段よくやっている単純作業をFirebug+javascriptでさくっとかたづける方法を2回にわけてご紹介します。 ページの中からテキストや属性の値を拾う ページの

  • JavaScriptクロージャを完全理解!スコープチェインを知る(後編) - builder by ZDNet Japan

    前回はスコープチェインのお話に入るための予備知識として「変数オブジェクト」についてのお話をしました。それを踏まえて、今回はスコープチェインと、それによって実現されているクロージャについてしっかり学んでいきたいと思います。 スコープチェインとは 変数オブジェクトに関する説明はしっかりご理解頂けましたでしょうか?JavaScriptの変数は、全て変数オブジェクトのプロパティとして扱われている事、そして変数オブジェクトは状況に応じて違うものが使われる(グローバルスコープであればグローバルオブジェクト、ローカルスコープであれば目に見えない変数オブジェクト)というものでした。ローカルスコープに対応する変数オブジェクトは「アクティベーションオブジェクト」と呼ばれ、関数呼び出しが行われると自動的に作成されます。 しかし実際は、変数を参照するという事は、その場における変数オブジェクト「だけ」を探す訳ではあ

    JavaScriptクロージャを完全理解!スコープチェインを知る(後編) - builder by ZDNet Japan
  • 【JavaScriptで】ニコ動の上でネギを振らせてみた【ふるみっく】 - 玉虫色に染まれ!!

    むしゃくしゃして(初投稿を)やった。(出来の悪さに対する)反省はしていない。 魔法の言葉: javascript:(function(){var d=document,ti=0,tj=1,a=new Array(),ta="<span style='display:none'>",tb="</span>",tc=tb%2Bta,mt=d.createElement("span");mt.style.fontFamily = "monospace";mt.innerHTML=ta%2B"\"%2Btc%2B"("%2Btc%2B"\"%2Btc%2B"_"%2Btb%2B"( ゜△ ゜ )";function f1(p,n){if(n.firstChild)f1(n,n.firstChild);if(n.nextSibling)f1(p,n.nextSibling);if(n.nodeNam

    【JavaScriptで】ニコ動の上でネギを振らせてみた【ふるみっく】 - 玉虫色に染まれ!!
  • JavaScript でテトリスみたいなゲームを作ろう! - セキュリティ&プログラミングキャンプ JavaScript 入門講座資料

    HTML とは HTML とは、誤解を恐れずに言ってしまうとウェブページ(ホームページ)を作るために使われている言語です。 例えば、以下のようなものが HTML です。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> <title>タイトル</title> </head> <body> <h1>見出し</h1> <p> 文<a href="hoge.html">ハイパーリンク</a>文 </p> </body> </html> サンプル イメージ湧きましたか? では、何故 HTML という

  • Box2DJS - Physics Engine for JavaScript

    Click this image to start demos. Note that it takes long time to load the page. Left-click to create an object. Right-click to show next example. What's this Box2DJS is a JavaScript port of Box2D Physics Engine. To tell the truth, this is converted from Box2DFlashAS3_1.4.3.1 in an automatic manner. (The reason why not Box2DFlashAS3_2.0.0 based is simply because I overlooked the renewal.) How to us

  • Google人気JavaScriptライブラリ配布開始、ネット全体でキャッシュ効果 | エンタープライズ | マイコミジャーナル

    GoogleからGoogle AJAX APIを拡張する新しいサービス「The AJAX Libraries API」が公開された。The AJAX Libraries APIGoogleのサイトで人気のある有益なJavaScriptライブラリを提供しようというもの。これまでYUIであればYahoo!、DojoであればAOLなどが同類のサービスを提供していたが、特定のJavaScriptライブラリに限定することなく有益であれば配布に追加するというポリシーをもっている点が新しい。 JavaScriptライブラリを活用するタイプのWebアプリケーションは数多くある。結果として、何度も似たようなJavaScriptライブラリをダウンロードしていることになり、このままいけば今後ライブラリ自体のサイズの巨大化や多くのサービスの登場でライブラリダウンロード総量は増加することになる。 The AJAX

  • 秋元@サイボウズラボ・プログラマー・ブログ: スクロールするタブをYUIベースで実現したライブラリ

    yodelerというYahoo UI ライブラリベースのUIを開発しているReid Burkeさんが発表したのが、タブ切り替えとスクロールを組み合わせた新しいタブ切り替え表示部品。 切り替えるときにタブの中身の切り替わりがスクロールでなされる、ということなんだけど、見てもらうほうがはやい。 縦スクロール版 / 横スクロール版 切り替えに時間がかかるので日常使いのページには良くない気もするけど、そうでないときにちょっとユーザをびっくりさせることができるかもしれない。 ライブラリはBSDライセンスで、その他の作品とあわせてsvnで公開されている。 via Ajaxian この記事は移転前の古いURLで公開された時のものですブックマークが新旧で分散している場合があります。移転前は現在とは文体が違い「である」調です。(参考)記事の内容が古くて役に立たなくなっている、という場合にはコメントやツイッタ

  • 本気でやるならonclick属性は避けてライブラリを活用すべき - id:HolyGrailとid:HoryGrailの区別がつかない日記

    第1回 そろそろ気で学びませんか? | Think IT これ、今この記事書いてる時点で650以上ものブクマがされているんだけれども、あまり内容がよろしくない。 というのも、解説はとても丁寧ですごくよい内容なのだけど、サンプルコードの書き方がどうも古くさい。 onclick属性とか、今時のフロントエンドエンジニアはそんな書き方はしない(と思う)。 なぜonclickをあまり推奨しないのか やっぱり、エンジニアとデザイナーorマークアッパーとの分業の点でHTMLの属性にスクリプトを書いちゃうのはあんまりよろしくない。 たとえばの話だけど関数の名前を変えたかったり、だとか、HTMLを変更したり、っていうときにミスが起こりやすくなってしまう。 これは分業していなくてもどちらにしろ発生してしまうことだと思う。 他にも前に書いたのだけど、aタグとかでonclickしちゃうとhrefにreturn

    本気でやるならonclick属性は避けてライブラリを活用すべき - id:HolyGrailとid:HoryGrailの区別がつかない日記
  • JavaScriptのイベントハンドラ説明

    気でやるならonclick属性は避けてライブラリを活用すべき - 帰ってきたHolyGrailとHoryGrailの区別がつかない日記 を読んで,思うところあって書いてみました(決してカウンターアーティクルではない)。 むかしむかし JavaScript を触っていた むかしむかしに書かれた JavaScriptで勉強している/した 人向けに。大元記事(そろそろ気で学びませんか? | Think IT(シンクイット))の想定読者に近いかなと思います。よって以下は JavaScript の初学者にはまったくおすすめできない(余計な知識がついてしまう)です。 Step 1: はじめのいっぽ ボタンを押したらメッセージボックスが出現する HTML を書いてみます。 <html><body> <script type="text/javascript"> function ShowMes

    JavaScriptのイベントハンドラ説明