JavaScriptで名前空間を実装するNamespace.js | ALUMICAN.NET
前回はクラスの作り方を考えたので、今回は名前空間について考える。 勉強がてら自作の名前空間ライブラリをつくったのでgithubにアップした。 » Namespace.js インストール Namespaceクラスはデフォルトでwindowオブジェクトのnet.alumican.util名前空間に登録されている。 net.alumican.util.Namespaceではなく、Namespaceのみでアクセスしたい場合は以下のコードを書く。 net.alumican.util.Namespace('net.alumican.util').import('Namespace'); メソッド 基本的にNamespace(‘名前空間’)で任意の名前空間を指定し、そこに対するメソッドを呼び出すことで名前空間を直感的に操作できる。 Namespace(‘名前空間’).resister(‘オブジェクト名’
『JavaScriptのテスト手法』
みなさんはじめまして。 2011年11月に中途で入社し、現在はAmeba事業本部でスマートフォン版Ameba（通称デカグラフ）の開発をしている川口（facebook）と申します。 JavaScriptにおけるテストフレームワーク JavaScriptにおけるテストフレームワークとしては、有名なもので現在以下のものがあります。 ●JsUnit Javaのテストフレームワークとして有名な「JUnit」を参考に作られたテストフレームワークです。 ●QUnit もともとjQueryをテストするために開発されたフレームワークですが、現在ではjQueryへの依存が無くなっているためjQuery以外のライブラリを使ったプロジェクトでも使用できます。 ●Jasmine
Morris.jsでグラフ作成 - サンプルとか
ソース javascript $(function(){ // 線グラフ(1本) Morris.Line({ element: 'single',//描画対象のID data: [ {targetX: '2012', targetY: 100}, {targetX: '2011', targetY: 75}, {targetX: '2010', targetY: 50}, {targetX: '2009', targetY: 75}, {targetX: '2008', targetY: 50}, {targetX: '2007', targetY: 75}, {targetX: '2006', targetY: 100} ], //描画用データ xkey: 'targetX', //X軸の指定 ykeys: ['targetY'], //Y軸の指定(カンマ区切りで複数設定可能) labe
グーグル製のJavaScript MVCフレームワーク「AngularJS」、正式版が公開 − Publickey
グーグルは、JavaScriptでMVCアーキテクチャのアプリケーション開発をする際に便利な機能を備えたライブラリ「AngularJS 1.0」のリリースをブログで発表しました。 MVCアーキテクチャとは、ソフトウェアがデータモデル（Model）の部分とユーザーインターフェイスの部分（View）、そしてビューとモデルのあいだで制御する部分（Controller）に分離された構造のことを指します。 これらが分離されているとプログラムの見通しがよくなり変更にも対応しやすく、テストも容易になるため、何種類ものユーザーインターフェイスと複雑なロジックなどから構成される大規模なアプリケーションではMVCアーキテクチャの採用が望ましいものと考えられています。 しかしWebアプリケーションをMVCアーキテクチャで実現しようとすると、ビューの役割を果たすHTMLのコードの中に、どうしても複雑なJavaSc
JavaScript MVCフレームワークはすでに十種類以上、その比較や最新情報などのまとめ
グーグルが開発したJavaScript MVCフレームワーク「AngularJS」を紹介した1つ前の記事の反応が予想以上に大きく、1日たたずにブックマークが500以上もつきました。 本記事では、AngularJS以外にもすでにたくさん存在するJavaScript MVCフレームワークに関する情報をまとめて紹介したいと思います。 JavaScript MVCフレームワークの比較記事 既存のJavaScript MVCフレームワークを比較した記事が「The Top 10 Javascript MVC Frameworks Reviewed」です。Top10と書いてありますが、12種類のフレームワークの比較です。これは公開当時は10種類だったものが、その後11種類になり、今回のAngularJSの公開で12種類になったためです。 上記のような比較表を載せた上で、12種類すべての利点と欠点を説明し
[JS]スマートフォンのタッチイベントを取得する各スクリプトのまとめ（仕様比較）
タッチイベントを取得する各スクリプトの対応イベント、スタンドアローンなのかjQueryが必要なのか、ファイルの容量など、仕様の比較をまじえて紹介します。 QUOjs イベント タッチ、タップ、ダブルタップ、ホールド、フィンガー、スワイプ、スワイプアップ、スワイプライト、スワイプダウン、スワイプレフト、ドラッグ 補足 jQueryとのコンフリクトを避けるため、「$$」を使用。 対応予定（2フィンガータップ、ロウテイト、ピンチアウト、ピンチ） 仕様 スタンドアローン ファイルサイズ Minified: 13KB Hammer.js イベント タップ、ダブルタップ、ホールド、ドラッグ、ピンチ 補足 タッチジェスチャだけにフォーカスしたスクリプト。 仕様 スタンドアローン jQueryのプラグインも有り ファイルサイズ Minified: 2KB [ad#ad-2] jGestures イベント
JavaScriptでWebアプリを開発できる「Node.js」活用入門 | OSDN Magazine
昨今注目を集めているWebアプリケーションプラットフォームの1つに、「Node.js」 がある。Node.jsはJavaScriptでWebアプリケーションのサーバーサイドプログラムを実装できる技術で、高いスケーラビリティが特徴だ。本記事ではNode.jsの基本的な知識やフレームワーク「express」を用いたWebアプリケーション作成方法を紹介する。また、Webブラウザ上で動作するIDE「Cloud9 IDE」を用いてNode.jsアプリケーションをWindows Azureで実行させる方法についても解説する。 JavaScript、そして非同期・シングルスレッドで注目を浴びるNode.js Node.jsはJavaScriptでWebアプリケーションのサーバーサイドプログラムを実装できる技術で、開発プロジェクトのスタートは2009年と、比較的その歴史は浅い。しかし、ここ数年でプロジェク
JSX を二日間ぐらい使ってみて、あんまりよくないことがわかった - tomykaira makes love with codes
恒例の言語 dis 記事。無知をさらけだしているのでぜひともつっこみをください。 2日間ぐらい JSX でちょっとしたプログラム(真理値表をいじったり、QM法をおこなったりするもの)を書いてみて、JSX が残念なことがよくわかったのでまとめた。今回やったのはわりとロジックっぽい部分で、表示したりライブラリつかったり外部と連携したりといったことはなかった。 JavaScript / JSX の用途としてはかなり特異なものだとおもうので、そういうのに適当じゃなかった、というのはあるかもしれない。 しかし JSX の場合はべつにウェブ系に強い印象もないので(ライブラリとか)、今回指摘する問題点の一部は、やはり看過できないと思っている。 環境編 エラーが出たときに、どこで出ているのかわかりにくい 変換したスクリプトを node.js で実行しているため、通常の実行時エラーは変換後の js フ
にひりずむ::しんぷる - わーい、JSX で canvas いじれたよー
ちょろっと修正 というわけで、blog の背景の canvas を JSX で書きなおしてみた。いま動いてるのは JSX でコンパイルした JavaScript です。 だいたい、チュートリアルとテストみたらできた。 まず、node と npm が必要なのでよしなにいれる $ brew install nodejs $ curl http://npmjs.org/install.sh | sh そしたら JSX のレポジトリから git clone して make setup $ git clone git://github.com/jsx/JSX.git $ cd JSX $ make setup これで jsx の開発環境が整いました！簡単ですね！！ ちなみに、いまは make install とかないので、とりあえずはこの落としてきたレポジトリで適当に開発することにした。 あとは、
サウンドプログラミング用のJavaScriptライブラリができた！！！！ - 音の鳴るブログ
とりあえず疲れた。リポジトリもめちゃくちゃだし。暴飲暴食もした。 timbre - JavaScript Library for Objective Sound Programming http://mohayonao.github.com/timbre/ 新しいデモもつくった http://mohayonao.github.com/timbre/examples/004_timbresynth.html ライブラリにはUIついていないけど、デモのときは分かりやすいのでわざわざ書いた。バッハとJavaScriptは相性が良いとおもう。JSだけに。 そういえば、前につくった これ もバッハだった。 関連エントリ サウンドプログラミング用のJavaScriptライブラリをつくっている
JavaScriptでリズムシーケンサーを書いた - 音の鳴るブログ
JavaScriptでつくっているサウンドプログラミング用のライブラリ（ timbre ）にいくつかオブジェクトを追加してリズムシーケンサーを書いた。リズムシーケンサーが書けるようになったというよりは、リズムシーケンサーを作るために必要なオブジェクト（タイマーとフィルター）を追加した。あと、インターフェイスを修正したりして最初のデモも読みやすくなったと思う。 001. oscillators http://mohayonao.github.com/timbre/examples/001_oscillators.html 002. rhythm sequencer http://mohayonao.github.com/timbre/examples/002_rhythmsequencer.html このライブラリの最初のアイデアはS式風に音楽を記述するっていうものだったのだけど、昨日の記事
JavaScriptのコーディング規約を気軽にチェック
こんにちは、中川です。 今回は「Google JavaScript Style Guide」を気軽にチェックできるClosure Linterをご紹介したいと思います。 http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml Google JavaScript Style Guideのいいところですが、 規約だけでなく、しっかりしたツールも揃っているところが素晴らしいと思います。 コーディング規約はあったとしても、それに従っているか定期的に簡単にチェックする方法がないと、 いつしか守られないまま開発されてしまうことになりますね。 ※今回の内容はMacにて動作確認を行なっています。
JavaScript アニメーションのデザインパターン
JavaScript でアニメーションを作る アニメーションとは何？ ビューを少しずつ回転、拡大縮小、移動、変色などを行い、連続的な動きを作る こんな感じ <div id="view">hoge</div> <script> var el = document.getElementById('view'); el.style.opacity = 1; setInterval(function() { el.style.opacity -= 0.01; }, 10); </script> なんで、あんな感じの書き方になるの？ setInterval の意味が分からない こんな感じで書けないの？ <div id="view">hoge</div> <script> var el = document.getElementById('view'); el.style.opacity = 1; w
クライアントサイドMVCについて喋った - mizchi log
月曜日のclient-side templating 勉強会 http://atnd.org/events/28189 で喋った内容をうろ覚えに書き出す。 クライアントMVCが求められるようになった背景 AJAXの流行 PushStateの流行の兆し メディア系のゲームで使えるAPIの充実 今まではページ遷移の度にJSのオブジェクトを破棄していた。 => シングルページでリッチなコンテンツが作れるようになり、JSのやることが増えた PushStateとは 遷移なしにURLを書き換える技術。HTML5 History API。 Twitter, Github, Facebook URLを書き換えるだけなのでコンテンツ(DOM)の操作はアプリ製作者に一任されている。 大規模なHTML書き換えに、クライアントサイドテンプレーティングが重要になってきた。 PushStateのライブラリ defun
JavaScriptで作られたボンバーマン:phpspot開発日誌
BOMBERMAN JAVASCRIPT GAME JavaScriptで作られたボンバーマン。 キャラクターはボンバーマンとは違うのが残念ですが、ゲームのルールはボンバーマンです。 スペースキーで爆弾を置き、十字キーで移動します。 これは凄いの一言ですね。 関連エントリ JavaScriptでマリオカート JavaScriptマリオ JavaScriptで書かれたテトリスゲーム JavaScriptで出来たシューティングゲーム「Spacius!」
Meteor.js - naoyaのはてなダイアリー
http://www.meteor.com/ で公開された Meteor.js を少し触ってみました。TechCrunch なんかでも話題になっていましたね。 Meteor.js は JavaScript によるウェブアプリケーションフレームワークですが、クライアントサイドでもサーバーサイドでもない、"Isomorphic" なフレームワークです。 コンセプトとしていくつか特徴があるのですが、その最たるものは "Reactive Programming" で、モデルやセッションなどのストレージを更新するとその更新内容がリアルタイムに、そのアプリケーションを開いている全クライアントに伝わるようなアプリケーションを簡単に作ることができます。 この辺は実例を見るのが早いです。 http://www.meteor.com/examples/leaderboard ここにある動画では、あるブラウザで
applyとcallの使い方を丁寧に説明してみる - あと味
JavaScriptに、applyとcallというメソッドが用意されていますが、自分なりにapplyとcallの丁寧に説明をしてみようと思ってこのエントリーを書くなどをしてみます。 applyとcallは非常に似たメソッドなので、まずはcallから説明します。 callメソッドとは？ callメソッドは以下のように呼び出します。 methodA.call(thisArg, [, arg1 [, arg2, ...]]); methodAには任意の関数（メソッド）を指定します。 callの引数は第一引数にmethodAのthisとしたいオブジェクトを指定して、第二引数以降はmethodAに渡したい引数があれば、カンマ区切りでそれぞれ指定します。 callメソッドは、すべての関数が共通して持っているメソッドです。すべての関数はFunctionクラスのオブジェクトで、callはFunction.
[JS]大量の画像コンテンツに便利！ サムネイルを自動生成するスクリプト -NailThumb
大きいサイズの画像から、クロップやリサイズなどして小さいサイズのサムネイルを自動生成するjQueryのプラグインを紹介します。 サムネイルはテキスト配置やさまざまなエフェクトにも対応しています。 jQuery NailThumb [ad#ad-2] NailThumbのデモ NailThumbの使い方 NailThumbのデモ NailThumbは元画像のアスペクト比を維持したまま、クロップやリサイズをしてサムネイルをスクリプトで生成します。 サムネイルはさまざまなフォーマットが用意されています。 キャプション テキストをオーバーレイで表示することもできます。 NailThumbの使い方 NailThumbの基本的な使い方は、サムネイル用のコンテナとサムネイルのサイズ設定です。 外部ファイル スクリプトとスタイルシートを外部ファイルとして記述します。 <script type="text/
JSDeferredで、面倒な非同期処理とサヨナラ 記事一覧 | gihyo.jp
運営元のロゴ Copyright © 2007-2024 All Rights Reserved by Gijutsu-Hyoron Co., Ltd. ページ内容の全部あるいは一部を無断で利用することを禁止します。個別にライセンスが設定されている記事等はそのライセンスに従います。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
null.ly - a really cool domain parked on Park.io
