JavaScript Tips
JavaScript 開発についての参考情報、Tipsをまとめました。
コーディング規約
・Google JavaScript Style Guide
・Google JavaScript Style Guide 和訳 — Google JavaScript Style Guide 和訳
・他人にやさしいソースコードの書き方 コーディング規約 JavaScript編 | Web制作会社スタイル
・Airbnb JavaScript スタイルガイド | Javacript-style-guide by mitsuruog
・最近の案件でのJavaScript開発周辺について、書いてみる | be-hase.com
JavaScript開発ノウハウ
クライアント、サーバーサイド共通
・サバクラ両方で動く JavaScript の大規模開発を行うために
クライアントサイド
・ユーザーの体感速度を高めるためのJavaScriptチューニング(前編) | HTML5Experts.jp
・ユーザーの体感速度を高めるためのJavaScriptチューニング(後編) | HTML5Experts.jp
JavaScript学習資料
・社内研修「JavaScript基礎」の資料を公開します! | mixi Engineers' Blog
はてな社の研修教材。よくまとまっているので、研修資料として流用できそう。
便利サイト
JavaScript のテストケースを共有できるサービスです。
スニペットを登録してパフォーマンスを比較することができます。
正規表現をテストできるサイト
デザインパターン
・JavaScriptアプリケーションのためのデザインパターン
jQuery
・高速で安全なjQueryを書くために今できること | Dress Cording
jQueryライブラリ
・jQuery用のシンプルなURLパーサー『jquery-url』 | IDEA*IDEA
フォームのselect要素にいい感じのデザインを適用するjQueryのプラグイン
・Minimalect by groenroos
スクロール中に特定の要素を固定してくれるjQueryのプラグイン
・hcSticky – jQuery Floating Sticky Plugin | Some Web Log
AngularJS
・AngularJS コードの構造化 | Developers.IO
JavaScript 逆引きメモ
JavaScriptで「あれしたい」というときに振り返る。
数値 Integer
・無題メモランダム: Javascriptで小数点以下X桁を四捨五入する
文字列 String
文字列の中に特定の文字列が含まれているかチェックする。
・String.indexOf – JavaScript | MDN
配列 Array
2つの配列を結合したい場合、Array.concat か Array.prototype.push.apply を使う。
・Array.prototype.concat – JavaScript | MDN
・JavaScript – 配列の連結(concat vs Array.prototype.push.apply) – Qiita [キータ]
配列の特定の要素を削除したい場合、Array.splice を使う。
・JavaScriptの配列の要素を削除する(delete演算子とspliceメソッド) – 山本隆の開発日誌
配列の要素のチェックするには、Array.indexOf を使う。
・Array.indexOf – JavaScript | MDN
function validateApiKey(api_key){ var api_keys = API_KEYS; if(api_keys.indexOf(api_key) === -1){ return false; } return true; } |
配列の中から特定の値を見つけたいだけなら Array.some() を使うと計算量を減らせる。
・Array.prototype.some() – JavaScript | MDN
Array.forEach ではなく Array.map を使うべきケース
Array.forEach を使った以下のコードは Array.map を使うほうが簡潔に書ける。
// Array.forEach を使った書き方 var resultArray = []; array.forEach(function(e) { return resultArray.push(someFunction(e.arg1, e.arg2)); }); |
// Array.map を使った書き方 var resultArray = array.map(function(e) { return someFunction(e.arg1, e.arg2); }); |
・Array.prototype.forEach() – JavaScript | MDN
・Array.prototype.map() – JavaScript | MDN
時刻 Date
UNIX timestamp を取得する(ミリ秒単位)
var timestampMsec = new Date().getTime(); |
UNIX timestamp を取得する(秒単位)
var timestamp = parseInt(new Date().getTime() / 1000); |
日付、時刻の整形には「moment.js」というライブラリがめちゃくちゃ便利!
・Moment.js | Parse, validate, manipulate, and display dates in javascript.
・[JavaScript] 日付や時刻をカンタンに扱えるライブラリ「moment.js」 | CodeNote.net
型チェック(比較)
・Javascript 型判定の方法とその処理速度について:humming bird
非同期処理を上手く使う
RIL
・【翻訳】2015年に向けたJavaScriptアプリケーションアーキテクチャ PART 1 | POSTD
applyとcall
コメントはまだありません。