JavaScriptStackTraceApi邦訳。Errorオブジェクトのstackについて。 | Ginpen.com
Google ChromeやNode.jsで利用可能なAPIです。Firefox等には搭載されていません。（まーあんまり使う場面なさそうですけど。） http://code.google.com/p/v8/wiki/JavaScriptStackTraceApi 以下、翻訳です。 All internal errors thrown in V8 capture a stack trace when they are created that can be accessed from JavaScript through the error.stack property. V8 also has various hooks for controlling how stack traces are collected and formatted, and for allowing custom
Dashを入れてみたらjQueryやらのドキュメントを見るのが想像以上に快適だったよ。 | Ginpen.com
自分も正直「え、別にブラウザーで見れば良いじゃん？」と思ってたんだけど、想像以上に快適だったので、皆さんにもお薦めしておきますよ。 なにそれ？ jQueryやBackbone.js、HTMLにCSS、あるいはRubyやJava、PHPといったもののドキュメントを閲覧するソフトウェアですよ。 事前にダウンロードしておくのでさくさくだし、検索が簡単だから欲しい情報がすぐ手に入るし、グローバルキーボードショートカットなんか設定しておくと一瞬で検索開始できるからお手軽です。 ウェブブラウザーのブックマークから開いて見れば良いじゃん、てな人も一度使ってみてくださいな。 インストールも簡単です。 検索してみたところ。 公式サイト Dash – Documentation Browser, Snippet Manager – Kapeli インストール App Storeからインストールします。公式サイ
CSS3のtransformを素敵に扱えるjQueryプラグインを作った。 | Ginpen.com
ダウンロード リポジトリ … https://github.com/ginpei/jQuery.transform JSファイル … jquery.transform.js なにこれ？ CSSのtransformプロパティの値を素敵に扱うやつです。 .css()からtransformを扱う際に既存の値を完全に上書きしてしまう問題を解消します。 transform ？ transformはご存知CSS3で追加されたプロパティで、要素を変形(transform)させる事ができます。このプロパティ複数の値を取り得、例えば「小さめで傾ける」という指定の場合は のような指定になります。 詳しくはこのあたりとか。 transform－CSS3リファレンス jQuery + transformの問題点 jQueryでスタイルを操作する場合は .css()を利用します。 しかし、これはプロパティの名前と値
次世代JavaScript、ECMAScript6の話を聞いてきたからサンプルコードとかメモしときます。 | Ginpen.com
これ行って来ました。 Web先端技術味見部#15 （今回は「ECMAScript6をそろそろ触る」！） : ATND 楽しかった！ JavaScript (JS)とECMAScript (ES)の違いとか、そういうのはググってください。 Firefox Auroraが現状ES6最先端ぽい。次点Chromeは chrome://flags から「JavaScript の試験運用機能を有効にする」を有効にして再起動でES6の機能が使えたりするらしい。 Firefoxで メニューのツール＞Web開発＞スクラッチパッド でスクラッチパッド。なんかコンソールより便利なやつ。 配列内包表記も使えるように。でも見づらいので三項演算子（?:演算子）みたいな扱いになりそうに思った。 サンプルコードいろいろ let ブロックスコープになる。varと有効範囲が異なる。
典型的なJavaScripter3+1種類と、それぞれの勉強法。 | Ginpen.com
一口にJSerといっても、色々な分野の人がいます。あなたはどんなJSerになりたいですか？ 方向性により学ぶべき事も変わってきます。目標を明確にしましょう。 というわけで、独断と偏見……というか主に偏見で三種類にまとめてみました。 追記: 「勉強法」とかタイトルに付けておきながら勉強法に触れてませんでしたので「勉強範囲」に修正しました。ひー。 三種類 アニメーションを作る人 アプリを作る人 サーバ側を作る人 基本的にプログラマ視点です。コーダー視点も最後に。 では、それぞれ見てみましょう。 アニメーションを作る人 Flashの代わりにJavaScriptやCSSを使う人。Flasherさんがシフトしてくる位置。 発注側が想定するJavaScripter。最近の携帯ゲームで需要がある。 お仕事 JSだけでなくCSSや画像を駆使して画面を描く。 UIだけならいなくても困る事はないけれど、UXま
JavaScriptのDateの挙動が面白かったのでまとめてみた。 | Ginpen.com
typeof ( Date ); // => "function" typeof ( Date()); // => "string" typeof ( new Date()); // => "object" typeof ( +new Date()); // => "number" typeof (1+new Date()); // => "string" typeof ( !new Date()); // => "boolean" Date はJavaScriptのコアに組み込みのコンストラクターですね。関数です。なので typeof Date は当然 "function" になります。 いやJavaScriptじゃないけど 正確にはJavaScriptじゃなくてECMAScriptの仕様になります。 というわけで、本記事はECMA-262の15.9 Date Objectsとかを参照し
JavaScriptみたいな最近噂の新言語、JSXのお話を聞いてきたよ！ | Ginpen.com
これ行ってきました。 Web先端技術味見部#4 （仮テーマはJSX！） : ATND JSXなにそれ JavaScriptっぽい新言語。本日DeNAが発表。 JavaScript風の記述 って言ってたけどそうでもないと思った。ActionScriptに近い？ 静的型付け →高速 クラスベース →高速 JavaScriptに変換しても →高速 玄人が書いたJavaScript並 クライアントサイドでもサーバーサイドでも動く というかJavaScriptが動く環境なら動く JavaScriptを置き換えるのが目標 リンク DeNA開発、高速なJavascriptコードを生成できる新言語「jsx」への反応まとめ – Togetter JSX – a faster, safer, easier alternative to JavaScript 公式サイト JSX – Statically-typ
JavaScriptをもっと上達したい人へのヒント（JavaScript おれおれ Advent Calendar 2011 – 24日目） | Ginpen.com
JavaScript おれおれ Advent Calendar 2011 – 24日目（最終日） JavaScriptを書くプログラマーさんでも、JavaScriptも書くデザイナーさんでも。 僕なんかがおこがましいとは思うんですが。 いっぱい書く とにかく書く事です。何でもいいです。作りたいものがあれば作ってもいいし、面白そうなものを見かけたら真似してみましょう。 ライブラリーやフレームワークは躊躇なく使う 簡単に書けるならそれに越した事はありません。どんどん使いましょう。そもそも便利なライブラリーを習得する事だって大切です。 分かりやすいと最近評判の本ですね。プログラミングの知識が全く無い状態の読者を想定しているそうです。 「Webデザイナーのための jQuery入門」という本を書きました – Takazudo hamalog で、私が書いた本の話に戻りますが、「Webデザイナーのため
JavaScriptの型は6種類だけど大きく分けた2種類を絶対に覚えておくべき（JavaScript おれおれ Advent Calendar 2011 – 20日目） | Ginpen.com
JavaScript おれおれ Advent Calendar 2011 – 20日目 これだけ。 undefined null boolean number string object 配列とか日付とかは、全部オブジェクトの一種です。 さらにこれらもobjectとそれ以外でも分かれていて、objectじゃない方をプリミティブ型と呼びます。 （※primitive … （形）原始的な、根本的な） null以外の型を調べるにはtypeof演算子を利用します。 console.log(typeof undefined); // => "undefined" console.log(typeof null); // => "object" // "null"じゃない！ console.log(typeof true); // => "boolean" console.log(typeof 1);
jQuery.gpKeyでキー操作が楽々に。 | Ginpen.com
概要 keypress、keydown、keyupのイベントを管理できるjQueryプラグインです。大きな特徴はふたつ。 まずひとつ目は、要素単位で設定できること。通常キーボード系のイベントはinput等の入力系要素かdocumentで発生しますが、jQuery.gpKeyは任意の要素で発生したものとして管理する事ができます。 もうひとつは、キーごとの操作をわかりやすく設定できること。例えば”Ctrl+S”を拾う場合は"^s"という文字列と処理内容をセットにして指定します。 キーボード操作のあるウェブアプリでの利用を想定しています。 ダウンロード jquery.gpkey-0.1.min.js [4KB] jQuery.gpKey.zip [57KB] jQuery.gpKey.tar.gz [57KB] 基本的な使い方 要素をクリックすると反応するようになり、また要素外をクリックした場合
.apply()を駆使してスルー力を極めろ（JavaScript おれおれ Advent Calendar 2011 – 16日目） | Ginpen.com
JavaScript おれおれ Advent Calendar 2011 – 16日目 （※「スルー力」は「するーか」じゃなくて「するーりょく」です。） .apply()を使って他の関数を実行できる事は昨日示しました。 これを応用して、メソッドが呼ばれた際にそのままスルーして、別のメソッドが呼ばれたかのように振る舞う事ができます。
必殺の .apply()フックを打つべし！ 打つべし！（JavaScript おれおれ Advent Calendar 2011 – 17日目） | Ginpen.com
JavaScript おれおれ Advent Calendar 2011 – 17日目 .apply()で成り済ましができたり仕事をスルーして丸投げしたりする事ができますが、さらにもうひとつ、フックを行う事ができます。 フック(hook)というのはフック船長のフック、鉤爪の事で、処理を「ひっかける」ような事です。ある関数が実行される際に、独自のコードを実行させる事ができます。 フック (プログラミング) – Wikipedia フック（Hook）は、プログラム中の特定の箇所に、利用者が独自の処理を追加できるようにする仕組みである。また、フックを利用して独自の処理を追加することを「フックする」という。 あの処理がどこで呼ばれてるかわからないときに 具体例をひとつ。例えばjQueryで「どこかのタイミングで勝手にクラス名が追加されてしまって困っている」という場合を考えます。その場合は .add
他人の能力を自分のものにできる .apply()で高度な成り済ましを（JavaScript おれおれ Advent Calendar 2011 – 15日目） | Ginpen.com
JavaScript おれおれ Advent Calendar 2011 – 15日目 JavaScriptの関数は関数オブジェクト（Functionのインスタンス）なので、メソッドを使う事ができます。中でも最も使用頻度が高いのが .apply()だと思います。 .apply()を使うとその関数を実行する事ができます。……というと「はてな？」ですが、着目すべきは実行する際のコンテキストと引数を自由に設定できるという点です。 例えば配列風のオブジェクトを考えます。このオブジェクトは配列じゃないので、Arrayインスタンスなら使えるはずのメソッドが使えません。 var arr = ["a", "b", "c"]; console.log(arr.length); // => 3 console.log(arr[1]); // => "b" console.log(arr.join("/"));
JavaScriptで123.toString()はエラーになるけど、123..toString()は正常に動作する。これってトリビアの種になりませんか？ （JavaScript おれおれ Advent Calendar 2011 – 12日目） | Ginpen.com
JavaScript おれおれ Advent Calendar 2011 – 12日目 JavaScriptで123.toString()はエラーになるけど、123..toString()は正常に動作する。これってトリビアの種になりませんか？ — 高梨ギンペイ / Ginpei (@ginpei_jp) 12月 11, 2011 というわけで、123.toString()は駄目だけど、ドット.を二つにした123..toString()はvalidです。 なんでかっていうと、123.までが数値として解釈されるから、です。 ですから123.toString()というコードは、123.という数値の直後にメソッド名toStringが出現する、と解釈されるため、パースエラーになっちゃいます。次のコードと等価です。 ドット.を二つにすると123.という数値の次にはドット演算子.があって、それからメソッ
カラーコードを素敵に扱うビット演算（JavaScript おれおれ Advent Calendar 2011 – 8日目） | Ginpen.com
JavaScript おれおれ Advent Calendar 2011 – 8日目 CSSで色を表現する方法の一つにカラーコードというものがありまして、#55CC2Aみたいな感じで色を表現できますね。光の三原色RGB (Red, Green, Blue)を2桁の16進数で表現して連結したものです。 これをJavaScriptから扱うなら、そのまま16進数で0x55CC2Aみたいに扱うと見た目が似ていて楽チンそうです。（ちなみにアルファベットは大文字でも小文字でも可。） この中から一色分だけ取得したりするには、ビット演算でムニャムニャするのが良いです。 （あるいはrgb()の形の表現でも良いでしょう。） 先に結論 // 取得 var code = 0x55cc2a; var red = code >> 16; // => 0x55 var green = code >> 8 & 0xff;
2文字で何でも整数にするコード（JavaScript おれおれ Advent Calendar 2011 – 6日目） | Ginpen.com
これだけで実数→整数も文字列→整数も行けますし、文字列が"12a"でも"xxx"でもNaNにもなりません。 ビット演算はOR|の他にAND&とXOR^、単項のNOT~がありますが、JavaScriptではいずれも辺々を数値化し整数化してから、演算を実行します。 また0はビットが全てゼロですから、それとのORを取っても元の数値と同じ数値が返ってきます。こうして、結果的に整数化する事ができました。 ぱっと見は分かりづらいので、コメントを書くとか、まあ工夫してください。
parseInt()の甘い罠（JavaScript おれおれ Advent Calendar 2011 – 4日目） | Ginpen.com
JavaScript おれおれ Advent Calendar 2011 – 4日目 <input />の入力値は文字列なので、数値として扱うには変換してやる必要がありますね。そんなときには組み込み関数であるparseInt()が便利です。 var numText = document.getElementById('num').value; var num = parseInt(numText); console.log(num);
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScriptをもっと上達したい人へ、最後のヒント | Ginpen.com
配列の .lengthは代入できる（JavaScript おれおれ Advent Calendar 2011 – 10日目） | Ginpen.com
Ruby on Rails 3.1で簡単なブログっぽいシステムを作ってみるテスト。 | Ginpen.com
