IBM Developer is your one-stop location for getting hands-on training and learning in-demand skills on relevant technologies such as generative AI, data science, AI, and open source.
脳内棚卸 Prototype.js と プロトタイプ汚染(昔話) jQuery が登場する以前、Prototype.js という JavaScript ライブラリがありました。 Prototype.js は、JavaScript OOP の普及期(2005~2007年頃)に多くのサイトで活用されました。 Prototype.js は Object.prototype や Array.prototype 以下に、Ruby 由来のメソッドを拡張することで、 JavaScript に Ruby 感をもたらし、ブームを起こしました。 当時の JavaScript(ES3: ECMAScript262-3rd) には、 言語仕様として Object.prototype を安全に拡張する方法が存在せず、 Prototype.js はしばらく後に 汚染(pollution) と呼ばれる問題を起こしてしま
intro この記事は 東京Node学園祭2012 アドベントカレンダー : ATND の 24 日目の記事です。 Socket.IO の 1.0 が、出る出るといって全然出ないので、 やきもきしている方も多いと思います。 しかし、その裏では Engin.IO という、割りと良い感じの ファミリープロジェクトができていて、 ちょうど先日 RealtimeConf でもその話がありました。 これは Socket.IO にも繋がるはなしなので、 今日はその Engine.IO の話をします。 参考はこのへん、 https://github.com/LearnBoost/engine.io https://vimeo.com/52496621 Engine.IO と Socket.IO (と WebSocket.IO) Socket.IO は、 1.0 を視野に入れたあたりで、 関連プロジェクト
前回の解説では、クロージャの「変数が保持される」「変数が隠蔽される」という特徴を使って、アクセサメソッドを作りました。 今回は、「呼ぶたびにクロージャが生まれる」特徴を使ってみます。 繰り返し処理内でイベントハンドラを作る まずは、何の工夫もなくやってみます。今回はjQueryも使います。 $(function() { var data = [ {label:'リンク1', value:1}, {label:'リンク2', value:2}, {label:'リンク3', value:3}, {label:'リンク4', value:4}, {label:'リンク5', value:5} ]; var ul = $('<ul/>'); for(var i = 0, l = data.length; i < l; i++) { var item = data[i]; var li = $('
JavaScriptなどのスクリプト言語は動作が遅く、最適なパフォーマンスを得るにはC/C++で実装しなければならないという常識に挑んだ先進的な講演が話題になっています。この話題の発端は2012年10月7日から10月8日までベルリンで開催されたJSConf.euでFelix Geisendörfer氏が行った講演です。 彼の講演の題材はnode.jsからMySQLに接続する為のバインディングのパフォーマンスに着目しています。2010年当時、node.jsにはMySQLのバインディングが存在しておらず、増井さん作のnode-mysqlモジュールが開発中の状態でした。このモジュールはJavaScriptでバイナリを解析しておりJavaScriptのみで開発されていました。この状況を受けてFelix氏が新たにnode-mysqlモジュールを新規に開発を始めました。このモジュールもJavaScri
以下の一行をすべての JavaScript の前に読み込む /*@cc_on _d=document;eval('var document=_d')@*/ この一行を読み込むことによって IE での document へのアクセスが 5 倍速くなります。 たとえば 以下のように、読み込む前と読み込んだ後を比較してみます。 // Before var date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date - date); // 643 /*@cc_on _d=document;eval('var document=_d')@*/ // After date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date -
ZAPA氏の記事。 ニュータイプなJSライブラリjQueryを使ってみよう! これを見てから3日間。 ブログもあまりかけずこればっかりいじって遊んでました。 睡眠時間も1日2時間くらいになり、今日は書こうと思います。 まずZAPA氏、きっかけをありがとう。 私はJavaScriptの知識がほぼ皆無な人間です。 そんな私でもjQueryは簡単に使える為、面白くてはまりました。 ただ、お恥ずかしい話、PHPを使ってJavaScriptをある程度制御しなければ私は使いこなせません。 ですが恐ろしく簡単にこれまでこのブログで紹介してきたようなJavaScriptアプリと同等のものを作れる為、これははまります。 JavaScriptダメダメの私でも出来ました データベース接続部や、なんやかんやは全てPHPでまかない、動作部分やFormなどはjQueryに投げる。 こんな方法で色々試して見ましたが、A
web開発者が知っておくべき20の上位リストを作成している記事がありましたのでご紹介。 何気なくAjax使ったりしますけど、色々あるものですねぇ。 中でもこれは使えそうだなぁと思う7点をピックアップいたしました。 テキストボックスのオートフォーム 自動入力完備というか、入力した語句から検索してリスト化する機能。 サンプル / ダウンロード ブラウザでインスタントメッセンジャー ブラウザ上でスムーズなメッセージのやり取りを可能にする。 地味に日本語も対応されているところが素敵ですね。 サンプルログインはID『test』PASS『test』です。 サンプル / ダウンロード フォームの監視 ユーザーがフォームに入力し、送信するというのは、一般的な仕組みとして使われています。 こうした仕組み上、誤った情報を入力し、送信→誤りがありますというメッセージとともに、再度入力ページに戻るというフォームス
かなり人気のあるjQueryですが、そんなjQueryの私個人が選ぶ素敵なプラグインとチュートリアル10選。 とりあえず定番的なものをどうぞ。 ちなみにjQueryを自作できるレベルまで手軽になりたい人は以下記事参照。 web制作の現場で使うjQueryデザイン入門が激しくお勧めな件 タグクラウドの細分化 jquery Hover Sub Tag Cloud - Noupe サンプルデモ これかなり好き。 タグクラウドをさらに細分化させて表示させてます。 こういう発想は今までなかったので最初見たときちょっと感動しましたね。 ローディングページ How to Load In and Animate Content with jQuery | Nettuts+ サンプルデモのメニュー部分をクリックしてみてください。 右上にローディングのマークが若干出て、さらにアコーディオン風に内容が変わります
jQuery公式サイト まずはjQueryJavaScriptライブラリの入手。 jQueryの簡単な説明 Re:zapa氏 今更ですが、jQueryにはまりました ドキュメントとリファレンス 公式ドキュメントサイト(英語) jQuery 1.2 ドキュメント日本語訳 jQuery リファレンス 色々とデモがついているのでわかりやすい。 jQuery入門 (ver 1.2.1) jQueryの入門サイト。 こちらもサンプルデモが多く有り、わかりやすいです。 jQuery 開発者向けメモ - 基本・サンプル サンプルがたくさん有ります。すこし高度。 中級編 jQueryのパフォーマンス最適化に関するTips 軽量jQueryをもっと高パフォーマンスにする為のヒント。 [JS]jQuery 1.2リリース&変更点など jQueryを1.2以前から使っているユーザー向けのエントリ。 HTML/J
Javascriptでオブジェクト指向Javascriptはプロトタイプベース(インスタンスベース、委譲による継承)なOOP。 JavaなどはクラスベースなOOP。 関数はクラス function Foobar() {}; // 関数に new でインスタンスを生成できる。 // この関数はコンストラクタとして働く var foobar = new Foobar(); alert( foobar.constructor ); // function Foobar() {} alert( foobar instanceof Foobar ); // true var Foobar = function(arg) { // このような定義にすると new した全てのインスタンス // 対してここで代入している内容が別々に作られてしまう。 this.var = arg; this.method
※ 画面は公式サイトデモより JavaScriptのデバッグによく利用されるものと言えば、alertだろう。簡単に使えて便利な関数だが、ブラウザの処理が止まってしまったり、長文の表示が難しいなどデメリットも数多い。 alertとお別れするためのJavaScriptデバッグツール そこで使ってみたいのがBlackbirdだ。Google Code上で公開されているオープンソースのJavaScriptアラートだ。 Blackbirdは見た目の格好いいフローティングダイアログにログを表示できる。デバッグ、インフォ、ウォーニング、エラー、プロファイルの5つのメッセージパターンが設定できる。Blackbirdのウィンドウでは各メッセージタイプの表示、非表示が切り替えられるようになっている。 表示位置の変更、表示するメッセージの種類が変更できる さらにF2キーを押して表示/非表示を切り替えたり、Shi
こんにちは、橋本です。 前回にひきつづき、Safari、ChromeのWebインスペクターやFirefoxのFireBugで使えるconsoleオブジェクトの使い方について書いてみたいと思います。 consoleオブジェクトには以下の19個(logを除くと18個)のメソッドがあります。 assert count debug dir dirxml error group groupCollapsed groupEnd info log markTimeline profile profileEnd time timeEnd timeStamp trace warn そのうち前回は、assertメソッドからgroupEndメソッドまで見て行きました。 今回はinfoメソッドからwarnメソッドまでの使い方について書いていきたいと思います。 infoメソッド console.info(messa
JavaScriptチュートリアルBeginner's tutorialsYour first website: Adding interactivityDynamic scripting with JavaScriptJavaScript frameworks and librariesJavaScript ガイド入門編文法とデータ型制御フローとエラー処理ループとイテレーター関数式と演算子Numbers and stringsRepresenting dates & times正規表現インデックス付きコレクションキー付きコレクションオブジェクトを利用するクラスの使用プロミスの使用JavaScript 型付き配列イテレーターとジェネレーターInternationalizationJavaScript モジュール中級編Advanced JavaScript objectsAsynchrono
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く