@rosylillyが気にしていた のでまとめた。 built-in/DOM objectのprototype拡張による弊害 追加したプロパティ/メソッドがfor inで列挙される var obj = {a:1}; for (var i in obj) { console.log(i); } こうするとaだけ出るはずが、 Object.prototype.b=function(){}; こうした後だとa,bが出てしまうって奴ですね。 そのまま代入しないでObject.defineProperty/definePropertiesでenumerable:falseのプロパティとして定義すれば列挙されなくなるので特に問題ありません。 今回挙げるprototype拡張の弊害の内唯一これだけはECMAScript5時代になって解消されました。唯一これだけは。 built-in/DOM object

自己紹介 文殊堂といいます BePROUDの見習いiOSプログラマです。 JavaScriptで30byteでFizzBuzzを書けます。 location.href='//is.gd/kzkQhu' iOSの前はUIがリッチな業務システムを作るとかそんな仕事をしてました。 内容 RequireJS実践編 jQuery custom event 応用編 疎結合なUIコンポーネントの作成について

複数画面で使えるAjax formダイアログのコンポーネントを作る 初期状態 Google CalendarのようなWebアプリを想像してください。 1日が1個のセルになっていて、セルをクリックしたらスケジュール登録ダイアログが表示され、 入力して登録ボタンを押すとスケジュールが登録され、セルの中に登録されたスケジュールが表示されます。 イメージ define([ 'schedule-model' ,'schedule-api' ,'schedule-to-selectors' ,'growl' ,'app/schedule-dialog-template' ,'debug' ,'jqueryui/dialog' ],function( ScheduleModel ,ScheduleApi ,scheduleToSelectors ,growl ,scheduleDialogTemplat

RequireJSって何? 公式サイト RequireJS スライド jQueryRequireJS.pdf 日本語記事だとこの辺? http://zudolab.net/blog/?p=451 要はJavaScriptの依存性解決をしてくれるライブラリで、こんな感じで使えます。 require( [ 'lib/a' ,'lib/b' ,'lib/c' ], function(){ // lib/a.js,lib/b.js,lib/c.jsが読み込まれていることが保証されているcallback require( [ 'lib/d' // lib/a.jsに依存しているライブラリ ,'lib/f'// lib/b.jsに依存しているライブラリ ], function(){ // lib/a.js,lib/b.js,lib/c.js,lib/d.js,lib/e.jsが読み込まれていることが保

CSRF対策のtokenはセッションIDで良い セキュリティ的にワンタイムトークン>セッションIDではない。 という話が、この辺の記事に書かれています。 高木浩光＠自宅の日記 - クロスサイトリクエストフォージェリ（CSRF）の正しい対策方法 高木浩光＠自宅の日記 - CSRF対策に「ワンタイムトークン」方式を推奨しない理由, hiddenパラメタは漏れやすいのか？ 肝はこういう事のようです tokenは外部のサイトから知り難い(実質知り得ない)ものでないといけない セッションIDはcookieに格納される document.cookieは自ドメインのものと親ドメインのものしか見れない→外部サイトで動かすJavaScriptからは参照できない セッションIDは『暗号学的に安全な擬似乱数生成系で生成されているはず』(引用) 推測も事実上できない 補足すると、セッションIDを使用したCSRF対

http://from.example.org/ のページでほげほげした結果を iframeで開いたhttp://to.example.com/ のページにwindow.postMessageで渡して、 そっちのGreasemonkeyで何か処理をさせるみたいなGreasemonkeyを書いててハマったのでメモ。 こんな感じのコードだったのだが、Firebugのcosoleでなら動くのに Greasemonkeyの中で動かそうとすると動かなかった。 function executeBid(ids){ var $iframe = $('<iframe/>',{ src:'http://to.example.com/' }); $iframe.bind('load',function(){ this.contentWindow.postMessage(JSON.stringify({comma

何が出来るのか どんな脆弱性かの詳細はこちらを参照2010 年 9 月 21 日現在のツイッターのバグ(脆弱性)について 外部JavaScriptを読み込むコードを仕込めたので、 どんなJavaScriptでも実行できる状態でした。 以下、JavaScriptの実行によってTwitter上で出来る事。 セッションハイジャック JavaScriptからcookieを参照できるのでログイン状態のセッションIDも参照できます。 また、任意のJavaScriptが実行できる以上、参照したセッションIDを攻撃者のサーバ等に送信することも出来ます。 攻撃者は奪ったセッションIDをcookieに設定すれば、被害者のアカウントでtweet,direct messageの閲覧・送信が出来ます。 確認してみたところ、ログイン状態のセッションIDはログアウトしても無効にはなりません。 設定→パスワードからパスワ

Firebugのconsoleに下のコードをコピペして、 Excelの表を範囲選択してコピーしたものを"ここ"って書いてあるところに突っ込む。 で、実行。 copy( <> <![CDATA[ ここ ]]> </>.toString().replace(/^|\t|$/gm,'|') );

minifyされたJavaScriptへのブレークポイントでの処理の挟み込み Firebugのブレークポイントは行に貼るのでminifyされたJavaScriptと相性が悪い。 例えばjQuery.ajaxが定義されている行にFirebugで元のJavaScriptのコードに手を入れずにdebug用のconsole出力を入れる方法 - 文殊堂の要領でconsole出力を挟んだとして、 無関係な関数の呼び出しまで対象になってしまう。 それを回避するためにブレークポイントに設定する条件を変えてみる。 !(!(arguments.callee === jQuery.ajax) || (/* やりたい事(式)をカンマ区切りで start */console.info(arguments.callee.toSource())/* end */,true)) コピペ用 !(!(arguments.ca

Firebugで元のJavaScriptのコードに手を入れずにdebug用のconsole出力を入れる方法 - 文殊堂の応用編 参照が欲しい無名関数の中の適当な所で、 breakpointを設定し、条件を↓にする。 (window.someFunction = arguments.callee),false この無名関数が1度でも実行されれば、someFunctionで参照できるようになっている。 someFunction.toSource(); とかやると以下のようになる。 (function ($) {var map = new Array;$.Watermark = {ShowAll: function () {for (var i = 0; i < map.length; i++) {if (map[i].obj.val() == "") {map[i].obj.val(map[i

カレーが相変わらず酷かったので言及 * id:cheapcode 不安なのは業界じゃなくて自分の将来だろ。30代までに技術を磨き、更に40代までにキチンとマネジメントや営業スキルを積み上げていれば失業の不安はない。スキルが結果に繋がるって意味ではフェアな業界だと思うけど 何をデタラメ言ってるんだコイツは………． 失業の不安はない？まるで数年前にJALを志望した学生のセリフのようだ．*3 http://d.hatena.ne.jp/JavaBlack/20100127/p1 「失業の不安がない」で想定する状況が「会社から解雇されず。会社は破綻しない。」なのが終わってる。 サラリーマンだったらいつでも次に行く会社があるってのが失業の不安がないってことだと思うんだよね。 行く先があるなら会社をクビになろうが会社がつぶれようが問題ない。 というか、多分その前に次のところに移っている。 で、数年前の

BPStudy#28 : ATNDの発表資料。 スライドなどは用意しておらず、これで発表する。 自己紹介 技術方面でのキーワード jQuery 主にevent周りを追っかけている Mercurial 俺々管理からチーム開発まで、開発をより上手くまわせるバージョン管理の仕方を追求中 Struts2 今仕事で使ってる 気に入った 技術者相手では名前で損してる印象 Python Be PROUD社員だったりDjango・Pyhonハッカソン、Python温泉によく参加してたりで誤解されがちだが全然書けない Perlの方がまだ書ける Be PROUD 株式会社ビープラウドの社員 ついったでbeproudハッシュタグ付き発言を時々している 今日の本題jQuery1.4 先日jQuery1.4のアルファ版がリリースされた。 jQuery 1.4 Alpha 1 Released | Official

若手ITゾンビにオンラインで参加した。 liveメソッドについては.live() | jQuery API Documentationを参照 liveでeventを貼って、実際にeventが発火した場合、 以下のliveHandlerが呼ばれる。 l2989-3012 function liveHandler( event ){ var check = RegExp("(^|\\.)" + event.type + "(\\.|$)"), stop = true, elems = []; jQuery.each(jQuery.data(this, "events").live || [], function(i, fn){ if ( check.test(fn.type) ) { var elem = jQuery(event.target).closest(fn.data)[0]; if

EclipseのJava projectをMercurialのリポジトリとして管理していて、 その中に何かclassがあるとします。 Eclipseのリファクタリング機能でpackage移動とclass名変更すると、 変更／移動元classのファイル削除と、 無関係の新規ファイル(変更／移動)追加になっている。 これは嬉しくない。 そこで、右クリックメニューからGuess Renamesを選択する。 類似度を自動判定し、後付けでhg renameにしてくれる。 ちゃんとファイルの移動になっています。 annotateで見てもちゃんと、 (自動で)変更されたpackage宣言／class宣言の行だけが 先ほどcommitしたリビジョンになっています。 参考･公式ドキュメントより Bitbucket | The Git solution for professional teams

Eventbug (alpha) Released | Software is hard JavaScriptで貼付けられたeventを見ることができるFirebugのextension。 現在はFirefox3.6b2以降、Firebug1.5b1以降じゃないと動かない。 http://www.mozilla.com/en-US/firefox/all-beta.html http://getfirebug.com/releases/firebug/1.5X/

jquery ui droppable とかを JSTAPd でテストするいい方法ないかなー。。。 http://twitter.com/Yappo/status/5416937057 これが気になったので、やってみた。 前提としてjQuery UIの各pluginはplugin用のオブジェクトを持っていて、 jQueryオブジェクトでのpluginメソッドの呼び出しは、 内部的にはplugin用のオブジェクトのメソッド呼び出しだというのがある。 例えば、$(someElement).dialog('open');というpluginメソッドの呼び出しは、 $(someElement).data('dialog')で取得出来るplugin用のオブジェクトのopenメソッドを呼ぶというのと等価、 つまり、$(someElement).dialog('open'); ＝ $(someElemen

jQuery.event.trigger(eventType); で、やる。若手ITゾンビで読んだ。 主な用途はDOM要素に紐づかないcustom eventの通知用(例：ajaxSend)と思われる。 (全DOM要素への通知って用途はあるのかな?) 実行すると、jQuery.cacheに入っている全てのオブジェクト(DOM要素に限らない)に対して、このeventを通知する。 なので、Ajax中にページ更新する際の注意点 - to-RのtipsでajaxSendをbindする対象はbodyでなくても良い。 ただし、jQuery.event.global[eventType]がtrueの場合(一度でもこのeventTypeのeventをbindしたことがある場合)のみ、この処理は行われる。 なので、例えばajaxSendを一度もbindしていなければ全cacheを舐めるような処理は行われない

Firebugのconsoleでhoge,fuga,piyoの3つのcustom eventの通知を監視する。 後から追加した要素に後からbindしたとかでも監視出来る。 難点として動かしているとFirefoxがものすごい勢いでメモリを食っていき、 1window・1tabで2時間弱動かした程度でメモリ使用量1GB超過とか平気でなるので、 監視したくなったときだけ__startEventLog();して動かすべき。 見せ方とかもう少し工夫出来そうなものなのでもう少し考える。 var __startEventLog; (function($){ __startEventLog = function(){ var __timerId = setInterval(function(){ if(typeof console === 'undefined'){ clearInterval(__tim

jQueryでは非DOMオブジェクトにもeventをbind/triggerできる Binding Events To Non-DOM Objects With jQuery この例だとwindow.location.hrefが変化しているかどうかTimerで監視し続け、 変化したタイミングで$( window.location ).trigger('change',data);で変更前後の情報を通知している。 なので、$( window.location ).bind('change',function(ev,data){});で通知を受け取る事ができる。 hashで状態を管理しているAjaxアプリで有効そうなテクニック。 select boxでcustom eventを活用 http://trulyevil.com/2009/05/07/custom-events-in-jquery/