uupaa looper 見っけたよー - latest log
(ε・◇・)з hasOwnProperty を使った for in ループより 20%～84% 低コストな、うーぱー式 ループのご紹介だよ～ Object.keys を使い、key を列挙することで、hasOwnProperty を使った for in ループよりも速くなります。 var keys = Object.keys(obj), i = 0, iz = keys.length; for (; i < iz; ++i) { var key = keys[i]; var value = obj[key]; ... ベンチマーク http://jsperf.com/perf-for-in-loop-vs-pre-enum-keys-for-loop/8 Browser for_in_hasOwnProperty loop uupaa-looper Chrome 16.0.912.77
JavaScript：undefined値の判定
JavaScriptでは初期化されていない変数には全て「undefined」という値が入っています。 var a; alert(a); //undefinedが入っている これを利用して、変数が定義済みかどうかを判別することが可能です。…が、やり方がいろいろあるみたいなので、まとめてみることにします。 undefinedと比較する if (a === undefined) { alert("aは未定義"); } グローバル変数として、そのまんまundefinedという名前の変数が用意されているので、それと比較するやり方。一番素直な方法ですが、JavaScriptにおいては良くない書き方とされています。 undefinedは予約語ではなく、単なる変数です。だから上書きすることができるし、関数スコープ内で同名のローカル変数を作ることもできます。（ただし最近の処理系ではconst扱いになって上書
必殺の .apply()フックを打つべし！ 打つべし！（JavaScript おれおれ Advent Calendar 2011 – 17日目） | Ginpen.com
JavaScript おれおれ Advent Calendar 2011 – 17日目 .apply()で成り済ましができたり仕事をスルーして丸投げしたりする事ができますが、さらにもうひとつ、フックを行う事ができます。 フック(hook)というのはフック船長のフック、鉤爪の事で、処理を「ひっかける」ような事です。ある関数が実行される際に、独自のコードを実行させる事ができます。 フック (プログラミング) – Wikipedia フック（Hook）は、プログラム中の特定の箇所に、利用者が独自の処理を追加できるようにする仕組みである。また、フックを利用して独自の処理を追加することを「フックする」という。 あの処理がどこで呼ばれてるかわからないときに 具体例をひとつ。例えばjQueryで「どこかのタイミングで勝手にクラス名が追加されてしまって困っている」という場合を考えます。その場合は .add
Post by @0-9
// 任意の連続した文字列生成 (new Array(10)).join(‘a’); // 任意の内容で初期化された配列生成（要Underscore.js） _(_.range(100)).map(function(n) { return ‘hoge’ }); // 高速なepoch秒生成 +(Date.now ? Date.now() : new Date()) // event throttle（scrollイベントの発生を100msに1回以下に抑える） var timer; $(window).on(‘scroll’, function (e) { if (timer) { return; }; /* hoge */ timer = setTimeout(function () { timer = undefined; }, 100); }); // 最初に一回実行するsetInte
実行間隔を調整する - はてなダイアリー - 無料で簡単。広告のないシンプルなブログをはじめよう！
JavaScriptDebouncing Javascript Methods | Unscriptable.com 密に処理が実行されてしまうのを避けるため、二つのかたちがあるとのこと。下のデモ。throttleは、0.5秒ごとに点の位置が変わる。debounceは、0.5秒いると赤くなる。 デモ throttleひとつ目は一定間隔以内の呼び出しは間引いて無視する方法。イベントの発生頻度が多く、処理が重い場合に使う。 Function.prototype.throttle = function(threshold, alt){ threshold = threshold || 100; var me = this; var last = Date.now(); return function(){ var now = Date.now(); if(now - last debounceも
jQuery Easing Plugin のイージング関数を直接利用する方法
jQuery Easing Plugin のイージング関数を直接利用する方法 はいどうも。ここのところ JavaScript に熱中してます。ということで今回は jQuery の Easing 関数を直接利用する方法をご紹介します。 Easing (イージング) 関数って？ イージング関数とは加速・減速を数式で表したもので、滑らかなアニメーションを表現する際に使われる関数です。jQuery においては jQuery.animate() メソッドの内部で利用されています。標準では linear と swing しか用意されていませんが、jQuery Easing Plugin にて 30 種類ものイージング関数を追加することができます。それぞれの効果についてはこちらのサイトの解説が詳しいです。 そんな素敵なイージング関数ですが jQuery.animate() 以外の処理に応用できたら夢が広
多様なページ内スクロールを選択できる「jQuery.easing.scroll.js」｜LabPad （ラボパッド）
demo 前書 ルネ･クレールと喜劇 ルネ･クレールとチャップリン ルネ･クレールと諷刺 前書 ルネ・クレールに関する一文を求められたのであるが、由来クレールに関してはほとんどもう語り尽された観がある。しかし考えてみると私には別な見方がないでもない。それを書いて見ようというのであるが自分の仕事のことなどを考えると気恥ずかしくてクレール論などは書けないのがほんとうである。今日はひとつ批評家になつて書いてみようと思う。 ルネ・クレールと喜劇 ルネ・クレールについてまつたく何も知らない人から「ルネ・クレールとはどんな人だ」ときかれたならば、私は「非常に喜劇のうまい人だ」と答えるにちがいない。 少しいい方を変えるならば、ルネ・クレールは私に喜劇を見せてくれるただ一人の映画芸術家だともいえる。正直な話、私のクレール観は以上でおしまいなのであるが、これでやめてしまつたのでは『キネマ旬報』の印刷所がひま
jQuery Easing - jQuery 日本語リファレンス
Easing/jQuery easingとは、エフェクトの動きを加速/減速させるための関数です。 例えばフェードアウトの動きを考えたとき、通常は透明度の変化量は経過時間に対して線形です。全体で1秒かかって消える処理であれば、0.5秒経過時の透明度は0.5になります。 しかし、ここでeaseInQuadの動きを適用すると、変化量は線形ではなく2次関数の曲線になります。（下記サンプル参照） そのため、最初はゆっくりと薄くなっていき、後半に急激に消えていくような効果が得られます。 特別なことをしなくても使うことの出来るeasingは"linear"と"swing"の2種類だけですが、プラグインなどを入れることで多くのeasingを利用することができます。 このeasingプラグインでは、version 1.3時点で32パターンが提供されています。 これ以外にもeasingは比較的容易に自作するこ
JavaScriptからメモリ情報を取得する方法
JavaScriptにおいてメモリ管理は基本的にエンジン任せなのであまり意識することは無いかもしれませんが、メモリリークの調査やパフォーマンスの実験のためにメモリ情報をJavaScriptから扱いたいときがあると思います。 メモリリーク調査は専用のソフトウェアなどがあるので、 JavaScript Memory Leak Detector (v2) – GPDE Team Blog – Site Home – MSDN Blogs IE Overview – JavaScript Memory Validator Firefox Debugging memory leaks – MDC Doc Center そちらを使うのでもいいかもしれませんが、new Dateを使った実行時間の記録みたいにJavaScript内からメモリ情報を取得して計測できるとおもしろいと思うので、ブラウザ毎にやる方
JavaScriptのデバッグTips - os0x.blog
JavaScript Advent Calendar 2010 8日目担当のid:os0xです。 JavaScriptネタは案外範囲が広くて色んなネタがあるので、毎回が楽しみですね。 さて、私はデバッグをネタにしたいと思います。テストではなくデバッグです。誰かが書いたコードをメンテナンスしなきゃー、とか。jQueryプラグイン導入しようとしたけど、なんかうまく動かないーみたいなケースのおはなしです。 JavaScriptのデバッグは大変なので、多くの方が日々苦労されていると思います。なぜJavaScriptのデバッグが大変なのか少し整理してみましょう。 ブラウザ依存 まず、なんといってもJavaScriptはウェブブラウザ上で実行されるので、環境が一定ではありません。特定の環境だけを対象にJavaScriptを書くことは滅多にありません。PC向けではIE、Firefox、Chrome、Sa
jQueryとCSSでリスト表示を簡単に切り換えるTips「Easy Display Switch with CSS and jQuery」
TOP > WebDesign > jQueryとCSSでリスト表示を簡単に切り換えるTips「Easy Display Switch with CSS and jQuery」 サムネイル一覧と詳細に説明を付けた一覧をページの遷移無しでスムーズに切り換えたいそんな人ともいるかと思います。今日紹介するのはjQueryとCSSを使ったリスト表示を簡単にスムースに切り換えるTips「Easy Display Switch with CSS and jQuery」を紹介したいと思います。 上記のような二種類のリストの見せ方をボタン一つで切り換え縷々用になります。ギャラリーページや情報が多いサイトではかなり便利そうです。 詳しくは以下 画像だけではいまいち分からないとおもいますので下記からデモをご覧下さい。 View Demo of Display Switch 構造自体はものすごく簡単なも
jQueryを良くする25のTIPS
jQueryを良くする25のTIPS ネタ元：Improve your jQuery - 25 excellent tips ちょっと多いですが、かなり良いTIPSがまとまっています。 Google AJAX Libraries APIを利用しよう Google AJAX Libraries APIを活用すればすばやくライブラリを読み込むことが出来ます。 <script src="http://www.google.com/jsapi"></script> <script type="text/javascript"> // Load jQuery google.load("jquery", "1.2.6"); google.setOnLoadCallback(function() { // Your code goes here. }); </script> 直接読み込むことも出来ます。
ウノウラボ Unoh Labs: jQueryのパフォーマンス最適化に関するTips
GT Nitro: Car Game Drag Raceは、典型的なカーゲームではありません。これはスピード、パワー、スキル全開のカーレースゲームです。ブレーキは忘れて、これはドラッグレース、ベイビー！古典的なクラシックから未来的なビーストまで、最もクールで速い車とカーレースできます。スティックシフトをマスターし、ニトロを賢く使って競争を打ち破る必要があります。このカーレースゲームはそのリアルな物理学と素晴らしいグラフィックスであなたの心を爆発させます。これまでプレイしたことのないようなものです。 GT Nitroは、リフレックスとタイミングを試すカーレースゲームです。正しい瞬間にギアをシフトし、ガスを思い切り踏む必要があります。また、大物たちと競いつつ、車のチューニングとアップグレードも行わなければなりません。世界中で最高のドライバーと車とカーレースに挑むことになり、ドラッグレースの王冠
Ajax » jQuery Tips » jQueryプラグインの作り方 | PHP & JavaScript Room
PHP、JavaScript、CSS、Webページ埋め込みによる音声・動画配信方法など、実用的なプログラミング・テクニックを解説jquery.basic.js(function($){ /* プラグイン名（myplugin）を指定 */ /* 関数にオプション変数を渡す */ $.fn.myplugin=function(config){ /* 引数の初期値を設定（カンマ区切り） */ var defaults={ defColor:"#ff6699", defPadding:5 } var options=$.extend(defaults, config); /* 一致した要素上で繰り返す */ return this.each(function(i){ /* プラグイン内での現在の要素はthisで参照 */ $(this).text(this.tagName
20 Top jQuery tips & tricks for jQuery programmers. jQuery Tips Tricks
20 Top jQuery Tips & Tricks for jQuery Programmersby Viral Patel · August 17, 2009 Following are few very useful jQuery Tips and Tricks for all jQuery developers. I am sharing these as I think they will be very useful to you. Disclaimer: I have not written all of the below code but have collected from various sources from Internet.1. Optimize performance of complex selectors Query a subset of the
JavaScript初心者におくる24のグレイトなtips - 三等兵
私が作ったわけではなく海外の記事です。自分も学習してみました。 phpスポーツ啓発日誌や、コカトリスさんや、アイスクレアームパラダイスさんのような、品質の良い訳は私にはできませんので見出しは意訳もしくは誤訳、文章は無視して訳してません。かつ、私がいろいろコードや文章つけたしてます。内容的にはほとんどズレてはないと思いますが、適当なのでおかしいところがあるかもしれません。 うっとうしい場合は原文をどうぞ。 24 JavaScript Best Practices for Beginners 1. 等価演算子で==使うなよボケ===だろナスチン野郎 ひぃぃぃ。 ==|!= だとねー、型は自動に変換されるんすよねー。ねー。 s = '1'; i = 1; alert(s == i); // true alert(s === i); //false えーと、==は「わし、数値も文字列も中身が一緒だ
「JavaScriptでconcatはもう使うべきではないのかも」なんてことはない - os0x.blog
JavaScriptでconcatはもう使うべきではないのかもしれない (Kanasansoft Web Lab.)に早まるなとツッコミを入れる。 まず、当たり前ですがpushを使うべきところでconcatを使う理由はありません。配列に要素を追加したいならpushを使うのは当然ですね。 あえてconcatを使うのは配列を複製したい場合です。*1 で、複製する場合のベンチをとってみました。 http://ss-o.net/test/array_clone.html Firefoxは配列の長さが大きくなってくるとpushのほうが高速になる傾向が見られるものの、基本的にconcatのほうが安定して高速です。なにより、配列を複製していることが明確なconcatを使わない理由はありません。 ちなみにIE8はconcatが最適化されているらしく、上記ベンチではっきりとした差が出ます。シンプルに書いてお
8のjQueryのすごいTIPS
8のjQueryのすごいTIPS 原文：8 awesome JQuery tips and tricks 微妙なTIPSもあるのですが、役に立つのもあるのでご紹介。 target="_blank" のリンクの作成 XHTML 1.0 Strict ではtarget=blank属性が利用できない。そこでjQueryを利用して別ウィンドウを開く方法を紹介しよう。 $('a[@rel$='external']').click(function(){ this.target = "_blank"; }); <a href="http://www.lepinskidesign.com.br/" rel="external">lepinskidesign.com.br</a> [to-R補足] 実際に利用する際はjavascript部分を$(function(){...})などで包む必要があります。[
Firebugについてまとめ - monjudoh’s diary
随時更新 公式ドキュメント Firebug Console API http://getfirebug.com/commandline.html 気になったところ $$(selector) 複雑なCSSセレクタでなければjQueryの$関数の変わりとして使える感じ。 dirxml(node) outerHTML相当のHTMLを出してくれる感じ $$(selector)と組み合わせると便利そう。 inspect(object[, tabName]) 指定したオブジェクトを指定したタブで表示できる。特定要素をHTMLタブで表示させる時、「inspect($$('table#some-id td')[0],'html');」みたいにできる。今まで、「console.log($$('table#tab td')[0]);」を実行してconsoleタブに表示させた後、そこをクリックみたいにやっていた
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[デモ]jQueryで簡単なページスクロール 改良001｜factory.yusukenakanishi.com