Home Subscribe var obj = { name : 'pikachu', say : function(){ alert('I am ' + this.name); } } setTimeout(obj.say, 1000); // => 'I am'とだけ表示される。 これは期待通りに動いてくれません。 コールバックとしてメソッドを渡した場合、それはオブジェクトと切り離された単なる関数(メソッドではない)となってしまうのです。 つまり下記と等価なのです。 setTimeout( function(){alert('I am ' + this.name);} , 1000); 関数がオブジェクトと切り離されているため、このthisはグローバルオブジェクト(windowオブジェクト)を指してしまっており、'I am'とだけ表示されます。 ではどうすればよいでしょうか？ bin

setIntervalで処理順序を指定するようなスクリプトを書いてみたのですが はじめまして。お世話になります。 JavaScript初心者です。いろいろ勘違いしているかもしれませんが、ご容赦下さい。 自分はCばかり使っているので、「プログラムは上から下へ1行ずつ処理される」という考えが染みついており、「呼び出した関数の処理が終わっていないのに次の行が動作する」という仕様に手間取っていいます。 【やりたいこと】 1. データを取得する関数 getData() 2. データを処理する関数 handData() 3. データを表示する関数 dispData() の3関数を、それぞれの関数の処理が終了してから次の関数に移るというかたちで実行したい。 データ取得に時間がかかるらしく、順番に書くだけだとgetData()が終わらないうちにhandData(), dispData()が実行されてしまい

解説は他にもたくさんありますが、私自身も使いはじめの頃、違いがよくわからなかったので。 JSONとは？ 汎用的なデータ記述方法です。こんな感じで書きます。 { 'blog' : 'あと味', 'author' : 'jdg' } まさにJavaScriptのオブジェクトですね。*1 JSONPとは？ JSONを以下のように変えたもの。 callback({ 'blog' : 'あと味', 'author' : 'jdg' }); 関数呼び出しっぽいですね。まぁ、関数呼び出しなんですけど。 どゆこと？となるポイント 見た目が関数っぽくなる意外に変更点はないように見えますが、クロスドメインでJSONを読み込む時は、なぜかJSONではなく、JSONPが使われます。（WebAPI等） また、アクセスしたらJSON形式のデータを返す単純なCGIを自分で作りたいと思った場合でも、JSONを返しても、J

Node.js + Socket.IOを使って簡単なチャットアプリを作ってみました。 ベースは『パーフェクトJavaScript (PERFECT SERIES 4)』の「17章 WebSocket」に出てきたサンプルコードです。 今回はこのサンプルコードをSocket.IOを使って書き直してみました。 ソースコードはGitHubにアップしています。 サーバサイド server.js var io = require('socket.io').listen(8080); io.sockets.on('connection', function(socket) { console.log('onconnection:', socket); // クライアントからのイベント'all'を受信する socket.on('all', function(data) { // イベント名'msg'で受信

JavaScriptで書かれたソースコードはたったの75行 window.onload = function() {     game = new Game(320, 320);     game.fps = 24;     game.life = 3;     game.time  = 60;     game.score = 000;     var label;     game.preload(['http://jsrun.it/assets/k/r/t/X/krtXz.gif','http://jsrun.it/assets/v/1/a/l/v1alF.gif','http://jsrun.it/assets/e/B/C/G/eBCGr.gif']);     game.onload = function() {         bear = new Sprite(32, 32)

gl.enchant.js 用プラグイン debug-camera3d.gl.enchant.js を作りました. debug-camera3d.gl.enchant.js は gl.enchant.js 上でカメラを自由に動かせるようにするプラグインです. 十字キーもしくはマウスでカメラを動かすことができます. gl.enchant.js のサンプルプログラムやフィールドの確認, ゲーム途中のデバッグなんかに使って下さい. Sample And Download debug-camera3d.gl.enchant.js を使っているサンプルはこちら. キーボードの十字キーもしくはマウスでドラッグしてもらえばカメラが動くのが分かるかと思います. また’z’を押しながら操作すると注視点移動, ‘x’を押しながら操作するとズームイン/ズームアウトします. space キーでリセットです. プラ

大学の授業で話すことになったのでenchant.jsの使い方を説明します．「授業でプログラミングを触ったことがある」くらいの人を想定しているつもりです．enchant.jsはjavascriptでゲームを開発するためのライブラリで，PCだけでなくiPhoneやAndroidなどのスマートフォンのブラウザでも動作するゲームを作ることができます．またコンテストが開催されており，作ったゲームを投稿することもできます． 本稿では 開発環境の構築 画像の表示 画像の移動 キー入力による移動 マップの表示 ステージのスクロール キャラクタの動き マップとの当たり判定 という順序で最終的に付属のアクションゲームと同じようなものを作るところまでいきます． ブラウザを用意する 制作したゲームを実行するためのブラウザを用意します．FirefoxやChromeなどモダンなブラウザならだいたいいけるみたいです．今

jsdo.itで動作させるものをJSXで書くためのメモとか。 JSXをコンパイルできる環境を整える JSXを動かすためにnode.jsが必要で、JSXをリポジトリからクローンするのにGitが必要。（Gitはまあ必須じゃないけど） 最初にGitのインストールから。 Windowsなら最近出たばかりのGitHub for Windows使うとか、msysgit使うとか。前者の方がいろいろ楽かな。 MacならGitHub for Mac使うとか、homebrewからインストールするとか、公式のインストーラでインストールするとか。 Ubuntuなら $ sudo apt-get install -y git-core かなー。最近だとgit-coreじゃなくてgitで良くなったんだっけ？ 続いてnode.jsのインストールを。 Windowsはここから適当なバージョンのnode.exeとここから適

Javascriptを生成できる言語『JSX』がリリースされました。めでたいですねー。 ただ同じくJavascriptを生成きるHaXeのことが忘れられている気がするので、宣伝します。 ステマじゃないよ! 型推論がイケてる 現時点でJSXには型推論が実装されてないので、関数を定義するには全ての型を書く必要があります。 // JSXだよ! function add(x : number, y : number) : number { return x + y; } これだけなら特に問題ないように見えますが、これが高階関数を定義しようとするとどんどん複雑になっていきます。 // JSXだよ! function f(g: function(:number):number): function(:number):number { return function(x: number): number

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

JSXの早さの秘密、何となく理解！追記しました html5j のメーリングリストからのネタ DeNAさんが JSX っていう言語を公開。 JavaScriptに変換可能（？）な…とか書いてるので、CoffeeScript　っぽい？と想像しながら、サイトを開いてみたら、JavaっぽくカチっとしたOOPをする。コンパイルして、ブラウザでも動くJavaScript になるっぽい。CoffeeScript の略記されたようなコードとは大きく異なる。「きっちりと型付けしたコードを書くこと。」 今日、公開されたものなので、はっきり言って、「よく分からない」ことばかり。 サンプルを見る限り、ブラウザで動く。高速に。そんなゲーム（アプリケーション）を開発できる。 「HTML5時代のJavaScript製ブラウザゲームにどぞ！」といった一品のようです。 スライドとか、サンプルとか、全部、英語ベースです。なの

JavaScriptで書かれたスーパーマリオ。わずか14KBのサイズであのマリオを再現したということで話題です。 http://blog.nihilogic.dk/2008/04/super-mario-in-14kb-javascript.html これはソースを読まねばなるまい、ということでコードリーディングしてみました。14KBといってもYUI compressorで圧縮されているので、見るべきは圧縮前の方のソースです。 http://www.nihilogic.dk/labs/mario/mario.js 圧縮前といってもものすごいですよ、これ。空行やコメントを適切に入れて、分かりやすい変数名をつけて、しかも画像や音楽もすべてテキストデータとしてソース中に定義して、それでたったの35KB、1200行。 うーむ、信じられない。敵キャラのAIは？画像データは？JavaScriptでどう

前回の大阪てら子で少しだけ触れた『enchant.js』と、少し前に話題になってたらしい『mario.js』について紹介したいと思います。 『enchant.js』ってなんですか？ 『enchant.js』というのは、ファミコンの初代マリオやドラクエのような2Dゲームを作るのに便利な機能を備えたJavaScriptベースのゲームエンジンです。 enchant.js – HTML5 + JavaScript Game Engine 4Gamer.net ― ユビキタスエンターテインメント，無料で使用できるHTML5/JavaScriptベースのゲームエンジン「enchant.js」をリリース（ミドルウェア/開発ツール） 具体的には、以下の便利クラスなどが用意されています。 FlashのActionScriptベースな造りことがわかります。ざっと軽く見ていきましょう。 Gameクラス ゲームの

なぜ「速い」のか、について JSX 開発者の立場から。 たとえば、シューティングゲームで一番重たい処理は何か。言うまでもなく衝突判定。多数の弾や敵機の衝突判定を毎フレームごとに行う必要があり、この演算が重たい。 JSX に同梱されている web/example/shooting.jsx には衝突判定のコードが複数あるが、一番重たいのは Bullet#update 関数で、その処理は以下のようになっている*1。 for (var rockKey in st.rocks) { var rock = st.rocks[rockKey]; if (this.detectCollision(rock)) { if (rock.hp == 0) return false; inDisplay = false; if (--rock.hp == 0) { st.score = Math.min(st.s