Vjeux » Javascript: Cyclic Object Detection
URLON.stringify() suffer from a problem, when passed an object that contains a cycle, it will never stop. This article shows 3 techniques in order to detect if an object is cyclical. Edit the object: Mark In order to detect a cycle in an object, the method we learn at school is to mark each visited node. When doing a traversal, if we encounter an already marked node, then it is cyclic. This method
How ECMAScript 5 still does not allow to subclass array — Perfection Kills
Why subclass an array? Naive approach Problems with naive approach Special nature of arrays Function objects and [[Construct]] The importance of array special behavior Existing solutions ECMAScript 5 accessors to the rescue [[Class]] limitations Does [[Class]] matter? Wrappers. Direct property injection. Wrappers. Prototype chain injection. Summary Subclassing an array in Javascript has never been
packerで圧縮されたJavaScriptのdebug方法 - monjudoh’s diary
minifyされたJavaScriptは各種開発者ツールのdeminifierを使えば整形された状態でdebug出来ますが、packerで圧縮されたJavaScript(以下packed JS)はどうかという話。 Google Chromeの開発者ツール前提で話をするので他のブラウザについては誰か調べてみてください。 packed JSをdebugする際の壁はそれがevalで実行されることですが、Google Chromeの開発者ツールではevalで実行されたJSもdebug実行出来ます。 問題はどうやってdebug実行に持っていくかですが、globalから辿れる何らかのAPIがあるなら呼び出し元でブレークポイントを貼ってstep intoすれば良いです。 その場実行されるようなJSの場合はそれもできないので工夫が必要です。 以下は古いjQueryを使った例でそのような工夫は本来不要ですが
Post by @hamalog
でも昔書いたのだけども、IE8以下ではopacityに対応していないので、jQueryでアニメーションしようとすると、色々なことが面倒。そこで、ばっさりIE8以下対応をさっさとやるのが以下。どうのこうのでブラウザ判別でもして
Firebug Tip: Modify variable value at runtime | Software is hard
Published:March 3rd, 2012 Comments:3 Comments Category:Firebug, Firebug Tip This powerful Firebug's feature, which you can download from the internet, could be also called Edit value and continue (to use similar terminology from Visual Studio). Even if Firefox (and so Firebug) doesn't allow to edit the code itself at run-time, being able to change value of a variable while sitting at a breakpoint
おしゃれjQuery、Good Parts、Bad Parts - 素人がプログラミングを勉強していたブログ
jQueryは互換性を保ちつつも洗練されたAPIを取り入れているので、新しく書くときは新しいAPIを使った方が良い。 liveとかセレクタの:hoverとかはBad Partsだ。 jQuery.fn.on / jQuery.fn.off live/delegate/bind/click等は滅びた。全てonを使おう。 また、data引数を使う場合は必ずdataをオブジェクトかnullにする。dataが文字列の場合、関数の場合にセレクタ等と区別がつかないからだ。 $("body").on("click", function (event) { alert("Clicked!"); }, false); また、querySelector/querySelectorAllの登場によって、:hover等のjQuery固有のセレクタは滅びた。validなCSSセレクタと、jQueryのメソッドをch
uncurryThis 関数 - hogehoge @teramako
http://wiki.ecmascript.org/doku.php?id=conventions:safe_meta_programming にて大変有用な書き方を身に着けた。 Function.prototype.bindとFunction.prototype.callの黒魔術的なもの。 obj.hasOwnProperty("prop"); と書くところをcallで書くと var func = Object.prototype.hasOwnProperty; func.call(obj, "prop"); と書ける。さらにcallをbindしてみると var func2 = func.call.bind(func); func2(obj, "prop"); となる。さらに、bindをbindすると var func3 = func.bind.bind(func.call)(func
Post by @hamalog
ポチってもうたー開発メモ。 UIだけJSでいじってる時はそこまで慎重になることでもないけども、頻繁にガシガシajaxする場合は、既に走っているajaxリクエストもうまいことハンドリングすべき。ポチってもうたーでは、ツイートをJSONで返すよう、サーバーサイドでサービスを用意しているわけだけれども、まぁ、普通に考えれば、こんな感じで、JSON返ってきたらUIを更新するってやるんじゃないだろーか。 $.ajax(url, query).then(function(){ // UI更新しちゃう }, function(){ alert('ゴメンなんか変'); }); しかし、これには問題があって、JSONが返ってくる前に、もうそのUIが用済みになってしまうような操作がされた場合、あーもうUI更新して欲しくないんだけど後から更新されちゃったよーっていうことになってしまう。 ポチってもうたーでは、ロ
[WebStorm] Complete Current Statement がとても便利な件(・∀・) : のびーの食っちゃね〜だらだらな日々。食っちゃ寝生活してても意外と平気だったりする。
April 20, 201123:59 [WebStorm] Complete Current Statement がとても便利な件(・∀・) カテゴリTemporary Comment(0)Trackback(0) WebStormが高機能すぎて全然使いこなせていない感がひどいのですが、とりあえず備忘録代わりに1つ便利な機能など書いてみようと思います。 Shift + Ctrl + Enter で実行できる「Complete Current Statement」という機能なのですが、これが便利なのです。 たとえば、 var hoge = fuga || '' こんなコードがあった場合に「Shift + Ctrl + Enter」を押すと、 var hoge = fuga || ''; こんな感じにセミコロンを追加してくれます。 var hoge = fuga || ''; もし、こんな風
![[WebStorm] Complete Current Statement がとても便利な件(・∀・) : のびーの食っちゃね〜だらだらな日々。食っちゃ寝生活してても意外と平気だったりする。](https://cdn-ak-scissors.b.st-hatena.com/image/square/7a67ece17e5ac8a7d642f23d03f991202cf1aa5e/height=288;version=1;width=512/https%3A%2F%2Flivedoor.blogimg.jp%2Fokashi1%2Fimgs%2F8%2F6%2F86b6c20b-s.png)
文字列からHTMLDocumentを作成するコード
必要に迫られて引数で渡された文字列から HTMLDocument を動的に作成するコードを書いたので紹介します。このコードはchromeコンテキスト上で、つまり拡張上で動作させることを前提としていますのでご注意ください。 下記コードを書く際にmodestで紹介されているnanot_viさんのサイトを参考にしました。またrange.createContextualFragment()実行時のセキュリティ上の課題を克服するためにkazさんのblogを参照させていただきました。 let getDOMHtmlDocument=function(str){ let doc; let range; if(document.implementation.createHTMLDocument){ // Firefox 4.0から doc=document.implementation.createHTML
innerHTML = "" まとめ - latest log
HTML5をサポートしていないIE6〜IE8で、node.innerHTML = " ..."; のように HTML5 で追加された新要素含んだ文字列を innerHTML に与えると、次のいずれかの条件が成立した場合に親子関係の崩れたサブツリーを生成してしまいます。 innerHTML の前に document.createElement() が実行されていない node が DOM Tree に参加していない(オンザフライ) これらを回避するには、IE6〜IE8で以下のようします。 document.createElement("section"); // HTML5 Shiv function build(fragment) { // @param HTMLDocumentFragmentString: "<nav>...</nav>" // @return DocumentFrag
続・IEでのa要素の各属性について - monjudoh’s diary
前置き IEでのa要素の各属性について - 文殊堂の続き。 IE 6,7 で相対URL -> 絶対 URL の変換 - #生存戦略 、それは - subtechを参考にして、 cloneNodeハックとlink.hrefによるURLの絶対URL化を組み合わせてみました。 http://jsdo.it/monjudoh/o2Mk http://jsdo.it/monjudoh/9aHd link.hrefによるURLの絶対URL化はIE6,7では使えないので割愛。 検証 IE6 なぜかhostnameがiframeではなく外側のものになってしまっている。 少なくとも短いURLについてはouterHTMLハックを使った場合に各属性の値をちゃんと取れていたので、 そっちを使ったほうが良さそう。 a要素の各属性(cloneNodeハック) ---url.length:11 href:[htt
IEでのa要素の各属性について - monjudoh’s diary
色々あってa要素でURLをパースするというコードを書いていて色々はまったのでまとめます。 IE6-8でのa.hrefの上限 IE6,7:4096bytes IE8:4121bytes でした。 なお、Firefox,Google Chrome,Safariは1MBとか普通に扱えます。 使わないけど。 http://jsdo.it/monjudoh/8Fm6/read 各属性の取得状況 a.hrefにURLを代入して各属性がどうなるか調べてみました。 URLの長さが短い⇔上限超え outerHTMLハックを使わない⇔使う a.hrefにURLを代入後、別の要素のinnerHTMLにa.outerHTMLを代入し、そのfirstChild(a要素)の各属性を見ること の二軸を変えて調べてみました。 http://jsdo.it/monjudoh/sc82 IE6 a.hrefへの代入で更新され
Javascriptでいい感じにプロトタイプを継承する - ひよこ3分07秒のはてなブログ
Javascriptでプロトタイプを継承するには function newClass(){ superClass.apply(this, arguments); } newClass.prototype = new superClass(); // superClassを継承 var newObject = new newClass(); console.log(newObject instanceof superClass); // true こんなコードを書けばいいわけだけど、 これだとsuperClassオブジェクトを作っているところがスマートじゃない。 newClass.prototype = superClass.prototype; // superClassを継承 これだと余計なオブジェクトはつくらないけど、 newClassのprototypeを拡張するとsuperClas
SCRAPBLOG : ウィンドウがアクティブ（最前面に表示されている）かどうかの判定方法
あるウィンドウが Firefox 以外のアプリケーションのウィンドウも含めた中で最前面に表示されているかどうかを判定する方法。 Firefox 3.6 の場合 最前面に表示されたウィンドウにはXULドキュメントのルート要素に active 属性（値は “true”）が自動的に付加される (参考：nsGlobalWindow.cpp)。 var isActive = document.documentElement.hasAttribute("active"); ちなみに、最初これを教わったときに最前面にあるブラウザウィンドウを DOM Inspector で一生懸命調べたものの active 属性なんてものは無かったが、その場合最前面のウィンドウは DOM Inspector になるので、無くて当然である。 Firefox 4.0 の場合 なぜか active 属性を付加する仕組みが削除さ
jsのオレオレ演算子 - latest log
jsのオレオレ演算子といえば、 Boolean値に変換する !!arg 0又は1に変換する +!!arg 小数点を切り落とす arg|0 や arg >> 0 などがありますが、若干分かりづらいので、初心者の方にはおすすめできません。 http://jsdo.it/uupaa/9YFT で実行できます。 uu.ready(function(uu, doc) { var arg = 1.23; uu.log(" !!arg = @", !!arg); uu.log("+!!arg = @", +!!arg); uu.log(" arg|0 = @", arg|0); uu.log("arg>>0 = @", arg>>0); });
Titaniumのコード補完をWebStromで
最近Titaniumを使い始めたんだけど、コード補完するための*.jsがどこにあるのかよくわからなかった。いろいろ調べていると、 http://developer.appcelerator.com/apidoc/mobile/1.4/api.jsonで公式のTitanium.*の定義情報が配布されている 上記のapi.jsonを読んでJavaScriptの定義ファイルを出力してくれるモジュール(JavaScript)がhttps://github.com/netpro2k/TiAutocompleteで配布されている という事がわかった。自分の場合は以下のようにしました。 $ git clone git://github.com/appcelerator/titanium_mobile.git $ wget http://developer.appcelerator.com/apidoc/
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
N個の配列生成 - hogehoge @teramako
in 演算子と obj.hasOwnProperty() はどちらが早い！？ - hogehoge @teramako
GREE Engineering
