JavaScript

grunt を軽く触ってついでに livereload させてみた

Sphinx のビルドをファイル監視して自動で行う - AtAsAtAmAtArA でファイル監視してビルドとかやってるように、ウェブ開発でファイル監視してリロードしたいとかはある。古くは mala さんが location.href に xhr をとばすっていう方法でやってたようだし、…

JavaScript、奥が深すぎる

今まで JS 関連のことをぽつぽつエントリにしていたけど、それにはみ出るトピックを羅列する。 いちばん印象的だったところ 関数について考えること。いまのところ、JavaScript を復習するにあたってこれがいちばんの大本になると思う。プログラミング全般と…

jasmine-node で JavaScript のロジックのテストをする

JS でもテストしたい DOM や非同期はおいといて、ロジックくらいテストしたい。Sinon.js とかモックしたり、非同期処理のテストのライブラリがあったり、それこそ古くからは Selenium とかあるけど、いまはそこまでしなくていいから JS でテストをするっての…

JavaScript で文字列や日時フォーマットを自前でやる

思うところがあったのでやった。基礎練習とか素振りみたいなものです。JavaScript の標準の文字列出力はあまりに貧弱すぎるからそこらへんなんとかなんないかやってみた。ライブラリを使うなら日時フォーマットについては Underscoe.String.js とかあるし、…

JavaScript 関連のちょっとしたメモ

気になって調べたり、見つけたもの。小ネタ。基本的にはmonjudoh/BeautifulProperties.js · GitHub をみてたってのがきっかけ。 prototype 汚染しちゃだめなのって Object と Array だっけ? というか prototype 汚染しないほうがいいのってなんでだっけ?と…

いまさら JSDeferred と $.Deferred を少しさわったメモ

コールバック地獄的なそういうあれを垣間見てしまったので、たしかにもうちょっといいかんじに解決したいってのがよくわかった。そこで書き方を変えることでいい感じに . でチェインしたり例外処理をしやすくするために Deferred がある。ので、簡単なメモと…

Backbone.js をちょっとだけさわった

JS でMVC的に切り分けるということをちょっと学びたかったのですこし触った。具体的に触発されたのはタイミングもあるけど、 フロントエンドJavaScriptにおける設計とテスト をみたってのもある。なにがしたいかって、JS において DOM 操作はともかく、ロジ…

vim で JavaScript の開発するときに最近いれた設定やプラグインとか

具体的にはセンチャしてて「なんかもっとこう楽になれないの」と思ったので、いろいろ設定をしてた。メモ。 コマンドモードの補完 これは JS とは関係ないけど、知らなかったので。 : で始まるコマンドモードがあきらかに貧弱な挙動しかできないのはなんとか…

JavaScript の名前空間になぜ Function Object をつくるんだろうって話

JS で名前空間分けられないから独自に $ であるとか OreOreModule とかで一度空間を作ってしまってそこでいろいろ定義するというのがありがちなパターンだけど、なんで Object じゃだめなんだろうって思ってちょっと調べた。 keyword prototype, new, Object…

JavaScript の this, call/apply, callback のメモ

具体的には Sencha Touch 2 がきつい とはいえ仕事でちゃんとJSかいた経験って思えばないわけで*1、だいぶ学んだ。ハマったところとわかったところをメモる。 this について 最近 JavaScriptのthisの覚え方 - Qiita [キータ] がおそらくのきっかけで this に…

Cookieの値に = が入っているときの自前パース

たぶんそれ jQuery.cookie でできるよ と思うけど、今回は jQuery が使えない(使えなくはないがそれだけのためにjQueryをいれたくない)という状況だし、小さな処理なので自前実装した。 具体的な文字列 こんな感じの value からある key のときの値を取り出…

特定のオブジェクトのプロパティを一覧表示して実行する

デバッグの都合、JavaScriptから直接プロパティを参照したかった XHR 関係のレスポンスをみたいんだけど、事情によりデバッグがしづらいのでプロパティを全部アラートするようなものをかいた。以下コードコメントつき。 // XMLHttpRequest は送信済みで、失…

JavaScript で document.cookie の値を消す

超小ネタ ググればいろいろあるけどとりいそぎこれが簡単。Cookie の仕様上 expires を過去の日付にすればいい。 // 日付作成 var d = new Date(); // 1970/01/01 にする d.setTime(0) // expiresで消す document.cookie = 'hoge_cookie_key = hoge_cookie_v…

末尾の , (カンマ) を取り除きたかった話

あるチェックボックスのチェックが入っている一覧をクエリストリングにしてやりたかった。 ?hoge=1,2,3 みたいに。でも ?hoge=1,2,3, になってしまった。 こんな風に無理やりやろうとしてた $.each でまわして末尾を消し去る var checked__ids = $("input[na…

JSのSyntaxまわりのvim環境を整える(ついでにPythonも)

CoffeeScriptは好きです だけど結局JavaScriptで書かなきゃいけないことも多いだろうし、せっかくなのでJSのSyntax関係を整えようと思った。 まずは処理系が必要です もっぱらNodeに頼ってるので(というかNodeの開発しようとしてるし)Nodeをインストールする…

スカンディナヴィア半島3をリリースしました

これです Webから主にリストをだらっとマルチカラムで一気に見れるクライアントです。WebクライアントなのでOS非依存、動作確認したのはOpera 11.62、Chrome 18です。Firefoxはたぶん動きます。IE9はたしかうごかなかったです。詳しい内容はリンクからどうぞ…

(jQuery)Eventをとった時にtoElementを使えるのはChromeだけだったという話

いつもChromeで開発していた clickしたときの event で toElement ってのがあって、それを使うとイベント発生元のもろもろの情報がとれて便利だった OperaとFirefoxでは動かなかった また console.log ev して調べたら srcElement ってのが使えた。これでOpe…

Operaの場合XHR2対応してないからiframeでクロスドメインでPOSTする

ああ哀しいかなOpera使い JavaScriptでTwitterのOAuthを取り付けて通信する方法 - atas これの続き。OperaだとXHR2対応してない(Operaの場合はこういうところが厳密すぎる)ので、結局Operaの場合iframeにPOSTすることにした そもそもなんでiframeに対してPOS…

JavaScriptでTwitterのOAuthを取り付けて通信する方法

以下の記事とTwicliのソースをコピペして作成しました おれにこんな難しいことができるはずがない TwitterクライアントのOAuth対応(Javascript編) | tomatomax.net NeoCat/twicli · GitHub JavaScriptでクロスドメイン通信したい 方法としては2つある XMLHtt…

動的に追加される要素に対する .hover は mouseenterとmouseleaveで対処する

hoverを使いたかった CoffeeScriptです $("#hoe").hover( -> $(@).attr("src", "image1") -> $(@).attr("src", "image2") ) でも、$.ajaxでとってきた(Callback)動的な要素に対しては結局そのままhoverはつかえなかった。じゃあこれは? $("hoge").live("hov…

$.ajaxしたらsuccessする必要があるよ!!!!

出オチ こんなの書いたりしてた #APILimit #========================= createAPILimitFormat = (json)-> remaining = json.remaining hourly_limit= json.hourly_limit reset_time= createDateTimeFormat(new Date(json.reset_time)) return "#{remaining}/…

jQuery使うときはちゃんとjQueryに閉じた使い方をしないとハマるって話

こんなの書いてた + createTimeLink = (arg) -> + timelink = $('<a>') + timelink.attr('href', "#{twitter_url.url}#{arg.screen_name}/status/#{arg.status_id}") + timelink.attr('class', 'time') + time = createDateTimeFormat(new Date(arg.created_at)</a>…

Node環境を整えてCoffeeScript+lessをvim vim しちゃうメモ

JavaScriptを直接記述するのはそれなりに骨が折れそうだった 解決するアプローチとしては JSLint JSHint CoffeeScript と3つあるとして、JSLintは厳しすぎる、JShintは悪くなさそうだけどなんかまぁ環境を整えるのが面倒そうなのでとりあえずCoffeeScriptに…

Togetterの「続きを読む」を自動的に展開して、さらに非公式RTの表示を薄くするUserScript

Togetterの「続きを読む」を自動的に展開するUserScritpt // ==UserScript== // @name auto page more load for toggeter // @description Togetterの続きを読むを自動的に表示する // @include http://togetter.com/li/* // @namespace http://twitter.com/…

スカンディナヴィア半島の開発を終了します

おかげさまで300ブクマ超えしました JavaScriptでオブジェクト志向的に、MVC的に書く - AtAsAtAmAtArA MVCとかオブジェクト志向とかJavaScriptとか釣りっぽいタイトルしてるからとってもホイホな感じでしたかね!!!!おれにとってはああいう設計できなかっ…

JavaScriptでオブジェクト志向的に、MVC的に書く

スカンディナヴィア半島というサービスをリファクタリングしていた これはTwitter List クライアントです。OAuthに対応していないのでPublicなリストしか取れませんがそのかわりマルチカラム対応、また簡単なコメントを読めば自分で好きに設定できます。自分…

正規表現のtestとmatchでハマった

アホかおれは 正規表現のmatchとtestで示している内容は違う スカンディナヴィア半島 スカンディナヴィア半島 — Gist これの if (/shindanmaker/.test(text)) text = 'また診断メーカーか。'; if (/#[一-龠ぁ-んァ-ヴー0-9]{10,}/.test(text) ) text = 'ま…

名前が衝突していただけとかアホか

こんなんかいてた var skz = (function(){ //twitterのURL var TwitterModel = function(url, api_url){ return { url: url, api_url: api_url, }; }; //DateModel var DateModel = function(){ return { getDate: function(){ return new Date; }, getTimeF…

今更ながらJavaScriptのcallについて学んでいた

callは関数がもつメソッドだということは知っていた あとapplyはcallの引数の撮り方の違いがあるだけということはしっていた。 主体と客体が逆転する var node_list = document.getElementsByTagName('a') var arr = Array.prototype.scile.call(node_list);…

今更ながらにクロージャについて少し学んだ

合ってるかは知らん 参考 [JavaScript] 猿でもわかるクロージャ超入門 まとめ - DQNEO起業日記 JavaScriptクロージャを完全理解!スコープチェインを知る(後編) - builder クロージャは「関数内関数」ということだけは覚えていた 馬鹿の一つ覚えというやつ…