Backbone.jsでViewからModel・DOMを操作する時の流れ - maeharinの日記
自分の頭の中の整理のために。 はじめに Backbone.jsガイドブックを読んでいたら、このような事が書いてあった。 Backbone流MVCでは、ビューとコントローラは両方ともViewが担当します。（略）これらはそれぞれViewのメソッドとして実装しますが、本書では区別のために前者をビューメソッド、後者をコントローラメソッドと呼ぶことにします。（略）重要な点は、DOMイベントに応じてコントローラメソッドが実行されることで処理が始まり、その中でmodelやcollectionを操作し、その結果生じるイベントがビューメソッドを呼ぶ、という流れを意識することです。そのためにも、コントローラメソッドには処理の起点になる以上の仕事を与えず、DOM操作はすべてビューメソッドに集めるよう明確に区別しましょう。 図にするとこんな感じになる（点線がイベントで実線が直操作） しかし、なぜこのような書き方に
Backbone.jsをRailsで使った際の、初期設定とルール - maeharinの日記
こないだまでRailsとBackbone.jsを使ったWEBサービスを作ってました。折角なので、その際の初期設定とちょっとしたルールをまとめておきます。ちなみに、規模感は以下のような感じです。 ・ModelとCollection 各約10個 ・ViewとTemplate 各約30個 ・Routerは使わない（SinglePageApplicationではないので） バージョンは ・backbone.js: 1.1.0 ・rails: 3.2.13 です ライブラリの配置 依存ライブラリは以下のように配置した // vendor/assets/javascripts/配下 . |-- backbone/ | |-- backbone-min.js | `-- backbone-min.map |-- json2/ | `-- json2.js |-- underscore/ | |-- un
や...やっと理解できた！JavaScriptのプロトタイプチェーン - maeharinの日記
JavaScriptのプロトタイプチェーンについて理解しようとしたのだけど、prototypeとか__proto__とかごちゃごちゃになって、色んなブログを読んでもなかなか理解しきれなくて悶々としていたのだが、図を書いたらパッと理解できた！以下、情報ソースはなるべくECMAScript仕様書（3rd）を元にするようにして書きました なぜ分かりづらいのか？ そもそも、なぜJavaScriptのプロトタイプチェーンは自分にとってこうも分かりづらかったのだろうか？自分なりに分析してみると、まず、「似ているが違う用語が沢山ある」という点がある。ざっとあげただけでも、「prototypeと__proto__」「__proto__と[[Prototype]]」「FunctionとFunctionオブジェクト」などがある。そして次に、「入り組んだ構造が動的に変化する」という点がある。上記のように似たよう
や...やっと理解できた！(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 変数定義の
jQueryで$(document).readyを複数実行した場合のthisやvarについて - maeharinの日記
はじめに jQueryを使う時は、$(document).ready(handler)やその省略法である$(handler)でdom構築ができてからコードを実行することが多い。（handlerは無名関数などの関数オブジェクト） で、たまに複数のファイルで何度も$(handler)を呼び出すことがあるのだけれど、その際$()の引数に渡しているhandler内のthisやvar宣言について混乱しがちだったので整理しておく。ちなみに検証環境はChrome ver24、jQuery1.9.1。概念はES3を基準にする。 前提 書き方色々 以下の3つは同義（真ん中は推奨されない） $(document).ready(handler) $().ready(handler) //this is not recommended $(handler) http://api.jquery.com/ready/
まさに忍者...JavaScriptの関数は第一級オブジェクト - maeharinの日記
JavaScriptの関数は「ファーストクラスオブジェクト（第一級オブジェクト）」である。なので、変数に代入したり、配列にセットしたり、他の関数に食わせたりできる。この変幻自在っぷりはすごい。newでコンストラクタになるところなんて変化の術のようだ。無名関数の即実行は影縫いの術みたいだし、callやapplyでthisの値を変えるとこなんて口寄せの術を彷彿とさせる。正に忍者 |--)ﾉｼｭｯ==卍 変数に代入する var foo = function() {console.log('foo');}; foo(); 配列にセットする var fnList = [ function() {console.log('foo');}, function() {console.log('bar');}, function() {console.log('piyo');} ]; for(var i =
unshift, shift, pop, pushが混乱するので、絵で整理した - maeharinの日記
配列の追加・取り出しに関する4つのメソッド（unshift, shift, pop, push）がいつも混乱するので絵で整理した。 絵にすれば覚えられそう！いちお練習のため、自分がよく使うRuby, PHP, JavaScriptでコードも書いた。 ・いずれの言語においても上記4つのメソッドは似たような名前で存在しており、用途も同じ。 ・いずれの言語のいずれのメソッドも破壊的メソッド。 ・言語、バージョンによってメソッドの返り値は異なる。 という具合だった。 Ruby ruby 1.9.2 # unshift a = [1, 2, 3] b = a.unshift 0 p a #[0, 1, 2, 3] p b #[0, 1, 2, 3] # shift a = [1, 2, 3] b = a.shift p a #[2, 3] p b #1 # pop a = [1, 2, 3] b =
PHPを愛する試み - maeharinの日記
僕はRubyが好きだ。プライベートではRubyばっかり使っている。でも、仕事ではPHPを使わなければならない。これまでPHPは書きにくいーと思い込んでいてあまり好きではなかったのだけど、仕事で使う以上PHPを好きになった方がきっと幸せになれる。何かを好きになるにはどうすればよいか。そう、相手のことを知る努力をすればいいんだ！ということで、PHPについて知る努力をしてみた。 PHP The Right Wayを読む http://ja.phptherightway.com/ ☆PHPへの愛が100上がった☆ これは... PHP好きになれるかも！ 普段Rubyで書いてるコードをPHPで書いてみる 折角なので自分が普段Rubyを使っていて便利だなーと感じていることをPHPではどう書くのか（厳密では無いにしても大体同じ内容はどう書くか）試してみた。Rubyは1.9.2、PHPは5.3.10。 多
Rubyワンライナー入門 - maeharinの日記
先日仕事中、一瞬の隙も見逃さずに情報収集できるRubyワンライナーとスクリプトというネタエントリを書いたのだが、その際Rubyのワンライナーをもう少しまともに理解したいと思ったので入門してみた。手元のRubyは1.9.2 はじめに Rubyのワンライナーは、rubyコマンドに色々なオプション（-eや-nなど）をつけて実行する。各オプションの網羅的な解説が見たければ、コマンドラインでは$ man rubyで閲覧できるし、webではるりまサーチで参照できる。ただ、これらは網羅的すぎるので、以下よく使うオプションとその周辺情報についてまとめた。 -e 一番基本的なオプション。スクリプトを実行する。（ちなみに他のオプションと組み合わせる時は必ず最後に記載する） 例: hogeと表示 $ ruby -e 'puts "hoge"' -n プログラム全体がwhile gets ... endというルー
たった3行のコードでひたすらアイドル水着画像をあつめる（Rubyだよ） - maeharinの日記
追記: C言語版書いた! 僕が参加していたUT Startup Gymの大先生である@tushuheiさんが、たった10行のコードでひたすらアイドル水着画像をあつめるという刺激的なエントリを書いておられたので、対抗したくなった ＿人人人人人 人人人人人人人＿ ＞Rubyなら3行で書けるっ！＜ ￣Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^￣ require 'open-uri' url = "http://matome.naver.jp/odai/2135350364969742801" open(url).read.scan(%r{<img src=".+".*?class="MTMItemThumb".*?/>}) {|m| puts m} 終わり！ 後はターミナルで $ ruby crawler.rb > photos.html $ open photos.htmlぐははは！ Ruby素
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
