‘JavaScript’ カテゴリーのアーカイブ

jquery.mockAjax でサーバ待ちしないさくさく開発を

ディノ日本酒調達部員の sou です。こんにちは。 今日はAjax開発に便利なjQueryプラグインを紹介します。

ディノも昨年から JavaScript 案件が増えており、本格的な JavaScript アプリケーションも実装するようになってきました。ただ、サーバサイドのみの開発に比べるとXMLHttpRequest経由でサーバサイドとのつなぎ込みが発生するので、問題の切り分けや実装スケジュール調整など難しい点もあるのではないでしょうか。

そんな時には jquery.mockAjax プラグインが便利です。

(続きを読む…)

JavaScript: 変数+無名関数と関数リテラルの違い

Web/JS(あまくち) part.2 – 変数宣言、関数、無名関数
で関数オブジェクトの生成について触れましたが、var name = function(無名関数を変数にバインド)とする方法とリテラルとでは挙動が違うのではないかとの指摘がありました。
JavaScript の var についての考察にあるように、

  function() {
    var foo = 1;
  };

というコードは内部解釈的に見ると(インタプリタの挙動的に解釈すると)

  function() {
    var foo;
    foo = 1;
  };

となります。
という事は関数に付いても同様で、関数リテラルの場合は名前付き関数オブジェクトが先積みされ、var name = function とした場合は変数 name だけ先積みされる(name = null の状態)と考えられます。

試してみましょう。

  console.log(foo == null); // true
  console.log(typeof bar == 'function'); // true
 
  var foo = function() {
  };
 
  function bar () {
  }

ばっちり予想通りとなりました。

Flymakeのススメ(PHP版 , JS版)

Emacs使いなら普通に使ってるよね、ってな素晴らしいEmacs Lispの一つにFlymakeというのがあります。これは名前の通り、Emacsでファイル編集中にon the flyにmake(設定次第で何でも)してくれるEmacs Lispです。makeしてエラーが出た場合には、エラー箇所をハイライトしてくれます。typo などがあれば瞬時に気づくことができますので、開発効率がアップします。

青くハイライトされているのがwarning、赤はエラーの意味です。

PHPもJavaScriptも他の方が設定を公開されていますけど、社内で設定を紹介したところ、「Warningに別の色が付いたりしないんですね」などと言われたので、ムキになってWarningにも色を付けてみました。そんなわけで、他の方の設定とはひと味違うと思います。実はPHPに関して言うと滅多にWarningが出ないので、便利になったかどうかは疑問ですが…。

JavaScriptについてはJavaScript Lintが素晴らしいですね。macportsならport install javascript-lintでインストールできます。「JavaScript Lint – あどけない話」に書いてある通りなのですが、これもWarningに別の色が付くように頑張ってみました。

(続きを読む…)

DashboardでEmacsのコマンドタイピング

Screen shot
こちらでは初めまして。スタートアップ研修記の方で記事を書いてたりする新入社員のuchiumiです。
Dashboard上で動く、メタキーの使えるEmacsのコマンドタイピングゲームを作ってみました。
画面上に出てくるEmacsのコマンドを、ひたすら打って覚えよう!というような感じのものです。
遊び方は、解凍後、ダブルクリックでインストールしていただき、「保持」というボタンがあるので、それを選択するとDashboardに表示されるようになります。

Emacsを学んでいくうちに、コマンドのタイピングゲームみたいなのががあったら良いなぁと思い検索してみたところ、素敵なものを発見しましたが、残念ながらcommandキー(メタキー)がうまく使えないようでした。
どうやらブラウザなどのコマンドの方が先に優先されてしまうみたいです。
どうしたらメタキーが使えるか先輩社員の方に相談してみたところ、Dashboard上で動かせば大丈夫なんじゃないかという素晴らしい提案をいただいただきましたので、さっそくwidgetsを作ってみることにしました。

(続きを読む…)

同じコードを書いてもらって解説(クロージャ問題) Re: Web/JS part.6

Web/JS 講習会参加者に同じ課題を出してコードを書いてもらう@第二弾です。
そろそろ個人差が生まれ、またこちらを悩ませる面白い間違いも出るようになりました。

(続きを読む…)

jQueryで「昨日買ったPCが今日壊れたクマ」と叫ぶクマ

こんにちは、たかはらです。最近休日が多いので新しい事を試す機会が増えています。最近ちょっとだけ始めたのはJavaScriptのライブラリjQueryです。今日はこのネタを投稿します。

jquery-kuma2.png

ディノでは、毎週30分×2コマの社内勉強会を開催しています。このなかで、souさんが毎週連載で開催しているJavascript講習会が社内外で思いのほか好評です。

全編動画にてフォト蔵で公開していますので是非ご覧になってみて下さい。

今souさんの行っているJavaScript講習会では、基礎を固めるためあえてライブラリを使っていませんが、ライブラリを使うと宿題のコードがどれくらい簡単になるか興味を持ったので、覚えたてのjQueryを使って宿題のJavaScriptを書き直してみました。

(続きを読む…)

同じコードを書いてもらって解説 Re: Web/JS part.4

JavaScript 初心者向けに開催している Web/JS 講習会で課題を出し、JavaScript 皆に同じ課題でコードを書いて貰いました。
そのお悩みポイントに対して補足を書いてみます。

(続きを読む…)

JavaScript の var についての考察

Web/JS part.4 で「変数宣言で var を付けないとどうなるのか」といった質問が出ていたので調べつつ考察してみました。

(続きを読む…)

haXe/Neko でにゃんにゃん (其の2) JavaScriptアプリケーションを作る

前回 は haxe でコードを書き、JavaScript と Neko 二つの実行環境で nyan と言わせる所まで進みました。
今回は JSONP でその場検索する JavaScript を作ってみましょう。

本日のメニューです。

  • haxe で DOM Scripting
  • 型とキャスト
  • JSONP リクエストの生成
  • レスポンスの表示


ソースコード(完成)

(続きを読む…)

jQueryを使ってソーシャルブックマークのリンクを追加

先日本ブログ各記事のタイトルに、はてなブックマークlivedoorクリップの数を表示するリンクをつけました。


ソーシャルブックマークのリンク

このリンクは、jQueryというJavascriptのライブラリを利用して非常に簡単に実現をしています。本日はこのメモをポストします。

(続きを読む…)