jQuery.Deferredを使って楽しい非同期生活を送る方法 - QiitaDeleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
jQueryのDeffered/Promiseを会得した(いまごろ) - ただのにっき(2013-04-17)
■ jQueryのDeffered/Promiseを会得した(いまごろ) なんか最近、やたらと非同期処理の文脈で「promise」というキーワードを見ることが増えて、なんか流行ってんのかなーくらいにしか思ってなかったんだけど、実はjQuery.ajaxを使っているときに恩恵を受けていたことを(いくつか実装してみて)ようやく理解したのであった。Deffered/Promiseが実装されたのは、もう2.0もなろうというjQueryが1.5のころの話である。鈍すぎる……。 というのも、あんまり理解せずにコピペしていたからなんだよな。かつてはこんな感じに書いていたjQuery.ajaxの呼び出しが: jQuery.ajax({ type: 'POST', url: '/', ..., success: function(){...}, error: function(){...} }); 何かのソ
リアルタイムWebを構築しやすくする「Socket.IO」とは
本連載では、このTech-Sketchから「コレは！」というテーマをピックアップし、加筆修正して皆様にお届けいたします。 リアルタイムWebとSocket.IO 栄えある連載第1回は、リアルタイムWebとSocket.IOについてお届けいたします。Tech-Sketchに掲載した元ネタはこちらです。 JavaScriptとDynamic HTMLによる「動的に表示内容が更新されるWebサイト」は、JavaScript内から非同期にサーバへ接続しデータを取得する技術、いわゆるAjaxが利用できるようになったことを皮切りに、爆発的に広がりました。Google Mapsなどがその代表例です。 このGoogle Mapsは、表示する場所や縮尺を変更するといった「利用者の操作」を契機として新しいデータをサーバへ取りに行く仕組みになっています。そのためサーバ側でデータが変更されたとしても、次にデータを
Rubyに似た記法を使ってJavaScriptを生成するプログラミング言語·RedScript MOONGIFT
RedScriptはRubyを真似て開発されているJavaScript代替言語です。 別な記法で記述して変換を行ってJavaScriptを生成するタイプの言語は幾つかあります。今回はRubyなどを参考に開発されたRedScriptを紹介します。 インストールしました。node.jsのライブラリです。 ファイル監視機能があるので自動で生成されます。rsという拡張子になっています。 @でthisになります。Ruby風？ ループ処理。 ハッシュの処理。 ifによる分岐処理。 requireも使えます。 switch/case文。 文法的にはRubyに似ている箇所が多いですが、完全にそうという訳ではなく、RubyとJavaScriptがミックスされたような文法になっています。doを使ったりもできます。この辺りは好みが分かれるところかも知れません。 RedScriptはnode.js/JavaScr
nextTick、setTimeout(fn, 0)の代わり - 素人がプログラミングを勉強していたブログ
setTimeout(fn, 0)より高速な関数は最近はこんな感じのを使うといいと思う。 var nextTick; if (typeof setImmediate === 'function') { nextTick = setImmediate; } else if (typeof process === 'object' && typeof process.nextTick === 'function') { nextTick = process.nextTick; } else if (typeof MessageChannel === 'function') { (function () { var channel = new MessageChannel(); var queue = null; channel.port1.onmessage = function () { t
JavaScript is Not Web Assembly
It’s fairly common these days to think of JavaScript as a sort of “assembly language for the web”. After all, it’s the language that is natively supported by web browsers, making it the most widely deployed runtime in history. With Node, we have a very relevant general purpose non-browser stack for doing system programming using this language, so it’s even more important as a language. Programmers
switch と case のインデントレベル - hogehoge @teramako
主に2種類あると思う。 switch (expr) { case expr1: break; case expr2: break; default: // ... } と switch (expr) { case expr1: break; case expr2: break; default: // ... } ボクは、前者がお勧めだと思っている。jslint ？ そんなの知りません。 vim のデフォルトがインデントするから ブロック文を生成した時の整合性 1番目はいいや、単にボクの使用エディタがvimだってだけだから。 2番目。 switch内の最後の句で、微妙にインデントレベルが合わなくて気分が悪くなるわけだが、下記のようにブロック文にするとすっきりさせることができる。 switch (expr) { case expr1: break; case expr2: break; de
javascript - でBMP以外のUnicode文字をきちんと扱う : 404 Blog Not Found
2013年03月29日16:00 カテゴリTipsLightweight Languages javascript - でBMP以外のUnicode文字をきちんと扱う 文字コード「超」研究 深沢千尋 一肌脱ぐか。 dankogai/js-codepoints ・ GitHub Twitter時代の文字の数え方 | 配電盤正確には、「Unicode 3.1時代の文字の数え方」なのでしょうが、Unicodeの最新バージョンが6.0の今、それではぱっとしないのでSYNOPSIS log('𠮷野家'.length ); /* 4 // unfortunately */ log('𠮷野家'.codePointsOf() ); /* 3 // naturally */ log('𠮷野家'.codepoints ); /* 3 // naturally */ log(String.fromCode
別ドメインのjsonデータをXMLHttpRequestでやりとりする | バシャログ。
いつのまにやら家から5分の距離に新しくコンビニができたことに気づいたtanakaです。 今日は、別ドメインのjsonデータをXMLHttpRequestで普通に取得するにはどうすればいいか調査したので方法をまとめます。実装としてはもう4年くらい前から使えるようになっていますが、私はまだ使ったことがなかったので。 XMLHttpRequest とクロスドメイン XMLHttpRequest が Internet Explorerに実装され、それ以外のブラウザに実装された当初は JavaScriptが実行されたページのドメイン以外にリクエストを送りデータを受け取ることはできませんでした。別ドメインに非同期でリクエストするためにいくつかの方法が考えられましたが詳しい説明は省略します。(一旦サーバを経由する・Flashを経由する・JSONPを使うなど) 2009年になりXMLHttpRequest
HTML / DOM におけるキーボードイベント周りの話 - ひだまりソケットは壊れない
最近キーボードショートカットの実装をしようと思ってキー入力によるイベント周りについて調べてみたのだけれど、日本語でまとまった情報が見つからなかったので、キーボードショートカットの実装に必要そうな内容を簡単にまとめておこうと思う。 キーボードショートカットに限らず、キー入力によるイベント周りの何かをする場合には参考になると思う。 本記事では、DOM 3 Events spec の 2012-09-06 の版を参照しており、将来の版では変更されている可能性がある。 最新の版は下記リンクから確認のこと。 Document Object Model (DOM) Level 3 Events Specification (DOM 3 Events spec の最新安定板) keydown イベント、keypress イベント、keyup イベントについて keydown イベント は、キーが押された
addEventListener()の第３引数の意味とかをちゃんと理解する為のメモ - 今日もスミマセン。
Web上でUIをマジメに作ろうとするとイベントの仕組みをちゃんと理解しておく必要がある。 jQueryとか便利なライブラリつかえばある程度簡単にできるんだろうけど、いろいろ制約あってそれらのライブラリが使えない場合もあるので、ちゃんと理解するためにメモしておく。 イベント伝播の順番 W3Cのドキュメントに分かりやすい図があったので引用する。 The capture phase: the event is dispatched to the target's ancestors from the root of the tree to the direct parent of the target node. The target phase: the event is dispatched to the target node. The bubbling phase: the event
javascript - es2pi はじめました : 404 Blog Not Found
2013年03月18日18:30 カテゴリAnnouncementLightweight Languages javascript - es2pi はじめました JavaScript: The Definitive Guide (Kindle ed.) David Flanagan [邦訳:JavaScript 第6版] es2piというライブラリーをこつこつと書き続け始めました。 dankogai/js-es2pi ・ GitHub What? ES6のpolyfillと、それでも足りないと私が日頃感じていた機能を実装したJavaScript Libraryです。 2πという名前に、ES6に対する割り切れない想いを託しました。 Demo とりあえずES5でPolyfillできるES6の機能までは実装ずみです。Polyfill以外でも関数よりもメソッドの方の方がふさわしいと思われる機能も一
Flow.js Ver 1.0.1 リリース と (this.self || global) の解説 - latest log
Flow.js Version 1.0.1 をリリースしました。 使い方はこちらをごらんください http://www.slideshare.net/uupaa/flowjs リポジトリはこちらです https://github.com/uupaa/flow.js $ npm install flow_js でもインストールできます 既にインストールしている方は、 $ npm update flow_js でupdateできます。 主な改善は、 FlowのargsをJunctionに引き継いでいなかったので引き継ぐようにしました var Flow = require("flow_js").Flow; var junction = new Flow(2, function(err, args) { // この場合の args は = [ [1,4], [2,3] ] です。 // Array
や...やっと理解できた！(2) JavaScriptのスコープチェーン - maeharinの日記
前回はJavaScriptのプロトタイプチェーンについて、図解を用いることでなんとか理解できました。今回はスコープチェーンに挑戦してみます。前回と同じく「1. 図解を用いる」「2. 用語を明確に定義する」「3. Standard ECMA-262 3rd editionを情報ソースとする」というアプローチで紐解いて行きます。 用語の定義 ・本エントリの文章における表記は、以下の表の「ECMA-262 3rd」に統一する ・本エントリの図における表記は、以下の表の「本エントリの略称」に統一する ・本エントリ内におけるES3とは、Standard ECMA-262 3rd editionを指す ECMA-262 3rd 本エントリの略称 JavaScript（サイ本）第5版（日本語） Execution Contexts EC 実行コンテキスト Variable Object VO 変数定義の
や...やっと理解できた！JavaScriptのプロトタイプチェーン - maeharinの日記
JavaScriptのプロトタイプチェーンについて理解しようとしたのだけど、prototypeとか__proto__とかごちゃごちゃになって、色んなブログを読んでもなかなか理解しきれなくて悶々としていたのだが、図を書いたらパッと理解できた！以下、情報ソースはなるべくECMAScript仕様書（3rd）を元にするようにして書きました なぜ分かりづらいのか？ そもそも、なぜJavaScriptのプロトタイプチェーンは自分にとってこうも分かりづらかったのだろうか？自分なりに分析してみると、まず、「似ているが違う用語が沢山ある」という点がある。ざっとあげただけでも、「prototypeと__proto__」「__proto__と[[Prototype]]」「FunctionとFunctionオブジェクト」などがある。そして次に、「入り組んだ構造が動的に変化する」という点がある。上記のように似たよう
JavaScriptを勉強したときにポイントになった3冊 - 車輪を再発明 / koba04の日記
今でもなんとなくJavaScript使っている感はあるのですが、勉強をしていく中でポイントになった3冊を紹介。 他の言語の経験があるけどJavaScriptに慣れていない人が読むといい本だと思います。 JavaScript: The Good Parts ―「良いパーツ」によるベストプラクティス jQuery使ってDOM操作を出来るようになってきたけど、100行以上のJavaScriptのコード書いたりするときにこれでいいのかと悩んでいたときに手にとった一冊です。１つ１つのトピックが短いのでとても読みやすいです。 JavaScriptの言語仕様のここが悪いのでこう書くべきということが書かれていて、どうJavaScriptを書いていいのかわからなかった自分にとってはJavaScriptを書く上での指針となっています。 本の薄さからわかるようにたくさん書いてあるわけではないのですが、オブジェク
ついに顕在化しはじめたArrayリスク : 404 Blog Not Found
2013年03月11日18:15 カテゴリTipsLightweight Languages ついに顕在化しはじめたArrayリスク JavaScript: The Definitive Guide (Kindle ed.) David Flanagan [邦訳:JavaScript 第6版] 以下のようにした理由は、実はJavaScriptのArrayが配列ではないことに起因します。 404 Blog Not Found:Algorithm - Ruby 2.0 や Haskell の遅延リストを JavaScript で これに対して、List.Lazyではmapやfilterを関数合成で実現しています。JavaScriptのArrayが、(整数個のデータ構造が順序よくならんだ古典的な意味での)配列でないことは、以下のように確認できます。 JavaScript var ary = ne
jQueryでcookieを簡単に使える「jQuery Cookie」のまとめ
jQueryでcookieを簡単に使える「jQuery Cookie」の利用方法のまとめです。 １．機能 名前のとおり、「jQuery Cookie」はjQueryでcookieを簡単に使うためのjQueryプラグインです。 JavaScriptでは値のエンコード・デコードやpathやexpireの結合、取得時の操作など、cookie処理が結構面倒なのですが、このプラグインを利用すれば簡単に扱えるようになります。 ２．プラグインのダウンロード githubの「jquery-cookie」のページにある「ZIP」をクリック。 これでアーカイブをダウンロードできます。 ３．基本的な使い方 jQueryと、ダウンロードしたアーカイブに含まれるjquery.cookie.jsを読み込みます。 <script src="http://ajax.googleapis.com/ajax/libs/jqu
ページを移動（離脱）するときにjQueryで警告を出す方法
Facebookなどでフォーム入力中にページを移動（離脱）しようとすると警告が表示されます。 この仕組みをjQueryで実装する方法を紹介します。jQueryは投稿時点の最新バージョン1.9.1を利用しています。 １．ページを移動するときに警告を出す ページを移動するときに警告を出すには、onイベントにbeforeunloadイベントを設定します。 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script> $(function(){ $(window).on('beforeunload', function() { return '投稿が完了していません。このまま移動しますか？'; }); }); </script> <form method="post" acti
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript上位言語の比較表 - Qiita
