タグ

javascriptとJavaScriptに関するchottのブックマーク (78)

  • JavaScriptでオブジェクトの配列を filter() を使ってフィルタリングする | Try Lifelog

    JavaScriptでオブジェクトの配列(普通の配列でもOK)に対し、あるプロパティの値をキーとして、条件を満たす要素のみを抽出したいときは、array.filter() メソッドを使う。(ソートしたい場合は、ここを参照。) 例えば、以下のような配列があるとする。 // JavaScript gLines = [ { ln_file: "T1301451.json" ln_key: "1301451" ln_name: "[JR]岩泉線 (茂市~岩泉) " }, { ln_file: "T1301541.json" ln_key: "1301541" ln_name: "[JR]北上線 (北上~横手) " }, { ln_file: "T1301671.json" ln_key: "1301671" ln_name: "[JR]磐越東線(ゆうゆうあぶくまライン) (いわき~郡山) " }]

  • flexibleSearch.js - ページ送りに対応した高速 Ajax 検索が可能な jQuery プラグイン | かたつむりくんのWWW

    flexibleSearch.js とは flexibleSearch.js とは、あらかじめ作成しておいた JSON ファイルを検索することにより、柔軟で高速な Ajax 検索を実現する jQuery プラグインです。 ページ送りや検索項目の絞り込みなどにも対応しています。 また、ページ送りについては、hashchange.js を併せて使うことで、ブラウザの「戻る」「進む」の動作にも対応しています。 検索用 JSON の準備 flexibleSearch.js は、あらかじめ用意された JSON ファイルを読み込み、その内容を検索する仕組みです。 当プラグインで利用する JSON の形式は次のようになります。 {"item":[ { "key1":"値1", "key2":"値2", "key3":"値3" }, ...(略)... { "key1":"値1", "key2":"値2"

    flexibleSearch.js - ページ送りに対応した高速 Ajax 検索が可能な jQuery プラグイン | かたつむりくんのWWW
  • JS ArrayのforEach, filter, map の速度を調べてみた。 - webとかmacとかやってみようか R

    最近のモダンブラウザのJS実装には、Array#forEach や filter, map などがビルトインされている。 jQuery とかの each使うより、ネイティブ実装のほうが早そう。しかし forEach、filter、map の速度に違いがあるのかちょと気になったので実験してみた。 環境は Mac OS X 10.7.4,  MacBook Air(Late 2010) 2012/06/22 追記:  −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− Sencha Touch, iPad等を追加しました → JavaScript の Array.forEach vs jQuery.each vs Ext.each −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−

    JS ArrayのforEach, filter, map の速度を調べてみた。 - webとかmacとかやってみようか R
  • [JavaScript] Array.indexOf()メソッドは遅い : iPhoneアプリ開発メモ

    2013年05月01日12:01 by idyn [JavaScript] Array.indexOf()メソッドは遅い カテゴリJavaScript調査 ツイート 1. 導入JavaScriptのArray.indexOf()メソッドは、配列中である値が出現する位置が何番目かを、ループを書かずに調べることができる大変便利なメソッドで、私自身、一途にこのメソッドばかり使っていたのですが、先日以下の2つの問題に気づいてしまいました。 比較的最近追加されたメソッドで、IE8以前では対応していないforループで探すより3倍程度遅い1つ目の問題は、Mozilla Developer Networkのリファレンスに含まれるArray.indexOfの項目に対処法が書いてありますので、そちらを参照していただくとして、このエントリーでは2つ目の問題について調査を行います。また、Array.indexOf

  • SLOBSERVER - L'actualité de Second Life

    This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

    SLOBSERVER - L'actualité de Second Life
  • JavaScriptのコメントは不要か? | POSTD

    コード中にコメントを書くべきでしょうか? 是が非でも避けるべきでしょうか? それとも控えめに書けばいいでしょうか? 開発者たちはそれぞれ、ソフトウェアを開発する際にどのように、そしてどんな時にコメントを書くかについて、独自の考え方を持っています。この記事では私の意見を述べますが、これが誰にも当てはまるというわけではありません。 なお、関数型プログラミングまたはオブジェクト指向プログラミングの原則に則ってJavaScriptで書かれたソフトウェアに絞った上で、私の意見を述べることにします。 コメントと保守性 この記事では、保守性のあるコードを書く場合について考えます。つまり、以下のようなコードです。 簡単に理解できる 簡単に拡張できる 簡単にデバッグできる 簡単にテストできる 保守性のあるコードには、大量のコメントが必要でしょうか? 明確に書かれたコードであるならば、大量のコメントは不要だと

    JavaScriptのコメントは不要か? | POSTD
  • [JS]操作が気持ちいいさまざまなアニメーションでモーダルウインドウを表示させるスクリプト -animatedModal.js

    最近のUIの傾向として、ユーザーが操作して楽しくなるようなアニメーションは大切なポイントです。そんな気持ちいいCSS3のアニメーションでモーダルウインドウをページ全体に表示するjQueryのプラグインを紹介します。 横からアニメみたいにひゅっとスライドさせたり、ぼい~んとバウンドさせたり、気持ちよくて面白いものが簡単に実装できます。 animatedModal.js animatedModal.js -GitHub animatedModal.jsのデモ animatedModal.jsの使い方 animatedModal.jsのデモ デモでは、3種類のアニメーションを使ったモーダルウインドウを試せます。 アニメーションはanimate.cssを利用しているので、80種類以上のエフェクトが利用できます。 デモページ:Demo 3 In: bounceIn, Out: bounceOut a

    [JS]操作が気持ちいいさまざまなアニメーションでモーダルウインドウを表示させるスクリプト -animatedModal.js
  • ページャNight 1ページ目という勉強会やりました - その手の平は尻もつかめるさ

    そういえば昨日「ピクシブ株式会社」って言おうとして3回くらい噛んだ気がする— プリントゴッコ (@moznion) 2014, 7月 5 ページャNight,僕が当初想定していたよりも1000倍位有益な会になって当に嬉しかったです.あとで記事等書きます.— プリントゴッコ (@moznion) 2014, 7月 5 録画したustの様子はこちら http://www.ustream.tv/recorded/49544381 ページャNight <[1]> on Zusaarというイベントを開催致しました. 実に冗談みたいな理由から興ったイベントでしたが,ページャ (ページネーション) というWebサービスの1コンポーネントに焦点を絞った非常に濃厚かつ興味深いトークの数々を聞くことができて,非常に良い勉強会になったと思います. 以下,発表の一覧です. 15分トーク @mizchiさん お前

    ページャNight 1ページ目という勉強会やりました - その手の平は尻もつかめるさ
  • はてなブログ編集画面JSのページャ見どころ紹介 #pagernight - hitode909の日記

    昨日,ページャNightという勉強会で,はてなブログのJSの見どころを紹介するLTをした.(昨日の日記). 資料公開しようかと思ったのだけど,発表資料そのまま公開しても意味不明なので,エントリに書き直すことにした. たとえば,このLGTM画像は発表資料の1枚目で,もし発表資料をそのまま公開したら,こういう謎の画像を解説もないまま見ることになっていたはず. JSのページャいっぱいある はてなブログの編集画面には編集サイドバーというのがあって,写真とかAmazon検索とかTwitterとかinstagramとかあれこれ貼れるようになってる. Amazon検索しても画面遷移するわけじゃなくて,ウェブ2.0という感じで,XHRでJSONを取ってきて,HTMLを組み立てて表示,クリックすると選択,貼り付けを押すとエディタに挿入される,という仕組み. 編集サイドバーから貼れるサービスは10種類くらいあ

    はてなブログ編集画面JSのページャ見どころ紹介 #pagernight - hitode909の日記
  • JavaScriptグラフライブラリHighchartsをPHPから使いやすくする·HighRoller MOONGIFT

    HighRollerはJavaScriptのグラフライブラリHighchartsをPHPでラッピングしたソフトウェアです。 非商用であれば無料で使えるCanvasタグベースのグラフ表示ライブラリがHighchartsです。そんなHighchartsをPHPから使いやすくしてくれるライブラリがHighRollerになります。 グラフのサンプルです。円グラフ。 棒グラフ。円グラフの項目にマウスを当てるとフローティングが表示されます。 横および縦の棒グラフ。 折れ線グラフと曲線のグラフ。 エリアグラフも折れ線および曲線でも。 プロットだけのグラフもできます。 タイトルに日語を使うこともできます。 jQuery版の他、Mootools版も。 利用法。requireするファイルが多数あります。 円グラフの描き方。とても簡単です。 折れ線グラフ。こちらも同じくらいシンプルです。 HighRoller

  • Flow.js

    非同期プログラミングを驚きのシンプルさに ver 1.0.1 and more. http://uupaa.hatenablog.com/entry/2013/03/12/185555 http://uupaa.hatenablog.com/entry/2013/03/14/131556Read less

    Flow.js
    chott
    chott 2014/11/04
    待ち合わせに便利そう、直列処理は書き方がめんどくさそう
  • jQuery deferredの使い方 | 前編 deferredの基本

    jQuery deferredの使い方 前編 deferredの基 jQuery deferredをなんとなく知っているが使い方がよくわからない人のために短期シリーズでおさらいをします。第1回目は非同期処理の概念からdeferredの基機能までをおさえます。 なぜ、今、jQuery deferred? この短期シリーズでは、2回に分けてjQuery deferredについて解説します。 jQuery deferredは、jQuery1.5で追加された機能であり、特に新しいものではありません。 しかしながら、私が昔書いたjQuery deferredに関するブログ記事をブックマークする人が、いまだにちょこちょこいるのが見受けられるのです。 もしかして、deferredの存在はなんとなく知っているけれど、どのように使ったらいいのかよくわからないという人が多いのかもしれないと思い、改めてまと

    jQuery deferredの使い方 | 前編 deferredの基本
  • Deferred挫折したけど非同期をスマートに書きたい人へ - Qiita

    ============================================= 簡単&低機能なものを作りました。 使い方 chain()とnextだけ覚えて下さい var img,img2; chain( function( next ){ img = new Image(); img.onload = next; img.src = "http://dummyimage.com/600x400/000/fff"; }) .chain( function( next ){ img2 = new Image(); img2.onload = next; img2.src = "http://dummyimage.com/600x400/000/fff"; }) .chain( function( next ){ setTimeout( next, 1000 ); }) .chai

    Deferred挫折したけど非同期をスマートに書きたい人へ - Qiita
  • http://foreignkey.jp/archives/763

    See related links to what you are looking for.

  • 非同期プログラミングを驚きのシンプルさに (するかもしれない) Flow.js を公開しました。 - latest log

    (ε・◇・)з o O ( (ミ・◇・ミ) o O ( あたし。ずっと思ってた… (ミ・◇・ミ) o O ( あたしの脳みそだと Deferred/Promises は、ちょっと難しすぎるって… (ミ・◇・ミ) o O ( jQuery.Deferred 解説記事をいくつかみたけど、すごく… モジモジしてて、ちょっと縦長すぎるんですもの… (ミ・◇・ミ) o O ( だから作っちゃった… ).done(); 非同期処理をシンプルに書ける、とても小さなライブラリをリリースしました。 Deferred/Promises は既存の構造や, そもそもの考え方を大きく改変する必要がありますが、 flow.js はあまり大きな違和感もなく、現在の流れを維持したまま導入できると思います。 使い方はこちらをごらんください http://www.slideshare.net/uupaa/flowjs リポジ

    非同期プログラミングを驚きのシンプルさに (するかもしれない) Flow.js を公開しました。 - latest log
    chott
    chott 2014/11/03
    非同期処理用のdeferredとは別の選択肢
  • Closure Tools  |  Google for Developers

    Stay organized with collections Save and categorize content based on your preferences. The Closure Compiler compiles JavaScript into compact, high-performance code. The compiler removes dead code and rewrites and minimizes what's left so that it downloads and runs quickly. It also checks syntax, variable references, and types, and warns about common JavaScript pitfalls. These checks and optimizati

    Closure Tools  |  Google for Developers
    chott
    chott 2014/10/24
    難読化など
  • Closure Compilerを使う!

    「Closure Compilerを使う!」は、Googleが提供しているコード圧縮・最適化ツールであるClosure Compilerの使い方を紹介するサイトです。 このサイトのコンテンツの大部分は公式サイトやチュートリアルの記述をベースに日語で再構成したものですが、その内容はあくまで管理人の個人的な理解に基づくものです。ご利用は自己責任でお願いします。 Closure Compilerとは Closure CompilerはGoogleが無償で公開しているJavaScriptコードの圧縮・最適化・難読化ツールです。ライセンスはApache License 2.0です。 JavaScriptのコード圧縮・難読化ツールとしては他にpackerやYUI Compressorなどが有名ですが、Closure Compilerも基的な機能としてそれらと同等のコード圧縮機能を有しています。以下

    Closure Compilerを使う!
    chott
    chott 2014/10/24
    難読化
  • 「JavaScript アプリケーションのメモリー・リークを理解する」を読んだのでメモ - 破棄されたブログ

    今更ながら読んだ。思い違いとかもあったりで色々とメモ。 JavaScript アプリケーションのメモリー・リークを理解する まずは定義から メモリーリークというのは、不要になったオブジェクトが存在し続けること。 JavaScript におけるオブジェクトのライフサイクル +------------------+ | オブジェクト作成 | +------------------+ | v +----------------------+ | メモリの自動割り当て | +----------------------+ |<---------+ v | 破棄されるまでループ +---------------+ | | GC による評価 |--+ +---------------+ | 参照カウントがゼロ OR 唯一の参照が互いに循環参照のみ v +------+ | 破棄 | +------+

    「JavaScript アプリケーションのメモリー・リークを理解する」を読んだのでメモ - 破棄されたブログ
  • シングルページアプリづくりのJavaScriptフレームワーク比較 - ワザノバ | wazanova

    http://blog.andyet.com/2014/08/13/opinionated-rundown-of-js-frameworks 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約1時間前 開発言語やフレームワークの比較は、参考になるところはありつつも、その結果、不愉快な気分になる人がいるわけですが、それを懸念して、「(これを読んだ人は、他人の)意見を読んでいるだけだと思い返してほしい。貴方にどうすべきだと言ってるのではなく、自分にもしくはチームのために何がよいかは自分で判断すべきこと。」と前置きして、Henrik Joretegが、JavaScriptフレームワークについて私見をシェアしています。 反対意見も併記しようと思ったのですが、TwitterやHNでの反応がまだないようなので、注目すべきコメ

    chott
    chott 2014/08/15
    フレームワーク比較
  • 直感的に使える便利なjavascriptライブラリ「Sugar」 - 世界中の羊をかき集めて

    「Sugar」公式サイト http://sugarjs.com/ すごくいいです。 ネイティブオブジェクトを拡張し、便利なメソッドをたくさん使えるようにしたライブラリ。 Ajaxやアニメーション、Dom操作をするためのライブラリではありません。 Javascriptで面倒な日付操作や、配列、数値、文字列、オブジェクト等の操作を楽にするためのライブラリです。 もちろんクロスブラウザ対応されており、jQueryとも併用できます。 また、下でも書いてますが、日語を考慮した処理がなされていて、日人には嬉しいライブラリだと思います。 「Sugarの機能について」 http://sugarjs.com/features 「SugarのAPI一覧」 http://sugarjs.com/api もう、上のページを見れば、その便利さがすぐ分かると思います。 その中でも、便利そうなメソッドを見ていきまし

    直感的に使える便利なjavascriptライブラリ「Sugar」 - 世界中の羊をかき集めて
    chott
    chott 2014/08/13
    ユーティリティライブラリ。かなり色々できるが、実装方法がちょっと心配の模様。