タグ

javascriptに関するkobakeのブックマーク (7)

  • JSX誕生秘話

    ※この記事は、JSX Advent Calendar 2013の一部です。 今日は12月24日、クリスマス・イヴです。それにちなんで、JSXがいかにして生まれたのか、というお話をしましょう。 元々は、2012年2月17日にさかのぼります。私は翔泳社開催の「Developers Summit 2012」の講演が終了し、登壇者の皆様と控え室で歓談しながら10周年コラボパーティの開場を待っておりました。そこでJenkinsの生みの親である川口耕介さんとお話をする機会がありまして、もう付き合いが20年近くになるんですかね、まあ会うたびにお互いに歯に衣を着せないで相手を容赦なくディスるんです。 で、そのとき私は川口さんに「お前まだJavaScriptなんて書いてんの?型がない言語を使うとか正気か?(意訳)」というツッコミを受けまして、もう完敗だったわけです…。 というわけでその場(控え室)で川口さん

  • Bookmarkleter

    Options URL-encode reserved characters: [space], %, ", <, >, #, @, &, ? Wrap in an IIFE (anonymizing function). Mangle variables and remove dead code to reduce size. Transpile for browsers using Babel. Make sure a modern version (≥ 1.7) of jQuery is available for your code.

  • コード進行を五度圏で可視化してみた - 西尾泰和のはてなダイアリー

    Songleの外部埋め込みプレイヤーがJavaScriptでカスタマイズできるので、それを利用して五度圏の可視化をするデモを作ってみました。 スピッツの「ロビンソン」 中島みゆきの「地上の星」 きゃりーぱみゅぱみゅの「ファッションモンスター」 ロビンソンはコードの動きがわりとおとなしいですね。一方ファッションモンスターはGm Fmを交互にピコピコ動いてダンスを見ているような楽しさが。 Songleは音楽の理解を支援するサービスで、楽曲からコード進行などの情報を抽出し、可視化したり、コード進行を強調して再生したりしてくれます。詳しくはSongleのサイトの解説をごらんください。外部埋め込みプレイヤーを使うと、JavaScriptからそのコードの情報が取れるようになるので、以前から興味のあった五度圏での可視化を試してみました。100行未満のソースコードで実現できてとても手軽でした。このデモのソ

    コード進行を五度圏で可視化してみた - 西尾泰和のはてなダイアリー
  • JavaScript で if 文を書くとき必ず波括弧を書くべきと主張しているスタイルガイド - @kyanny's blog

    新人さんの JavaScriptコードレビューをしていて、 if 文の体部分を波括弧で囲っていないコードを見つけた。 おれは体が一行しかなくても必ず波括弧で囲うようにしており(そのほうがわかりやすいと思っているから)、できればそうして欲しいけど個人の好みを押し付けるのはよくないので、広く支持されているコーディングスタイルガイドの類いで同様の主張をしているものが無いか探した。 Google とか Mozilla とか GitHub あたりのドキュメントを眺めてみたが if 文の波括弧についてはっきり言及している箇所を見つけられずにいたら、該当するドキュメントをいくつか教えてもらった。 http://contribute.jquery.org/style-guide/js/#spacing if/else/for/while/try always have braces and alw

    JavaScript で if 文を書くとき必ず波括弧を書くべきと主張しているスタイルガイド - @kyanny's blog
  • たった130行のコードだけでリアルな地形を作り出す

    神様もこんなプログラムを使ったに違いない。 Hunter Loftisさんが制作したこのサイトにアクセスすると、リアルタイムで岩でできたような山脈と湖の地形が生成されます。ただの1枚の画像を毎回表示してるだけではなく、毎回ちゃんと計算してレンダリングして、この大山脈を作り出してるんです。ぜひ何度かリロードしてみてください。 インタラクティブなウェブサイトが制作できる「JavaScript」が使われており、約130行のコードでたったの約4KB。ドイツのプログラミング大会で優勝した64KBのリッチなCGアニメーションや、たったの4KBのアニメーションを思い出しますよね。 このプログラムで使用しているのは「ダイヤモンド-スクエア法」と呼ばれる手法で、正方形を4つに分割していき、その中心点をランダムな位置にずらしていくことで、自然にできたようなフラクタルの図形を作ることができるんです。これはコンピ

  • JavaScriptの変数名で最初の文字に「$」を付けるのは《本当に》アリなのか?

    概要 ▶ Rolled dollar by MoneyBlogNewz前回の「jQueryで簡単な画像のスライドショー《slideswitchを勝手に解説》」という記事でまずimgタグで「active」というclassが付いている要素を$activeという変数に代入します。(なんで$を頭に付けているのかは謎…)jQueryで簡単な画像のスライドショー《slideswitchを勝手に解説》と、変数名の頭に$を 前回の「jQueryで簡単な画像のスライドショー《slideswitchを勝手に解説》」という記事で まずimgタグで「active」というclassが付いている要素を$activeという変数に代入します。(なんで$を頭に付けているのかは謎…) jQueryで簡単な画像のスライドショー《slideswitchを勝手に解説》 と、変数名の頭に$を付けているのはなぜなのかと書きました。 謎

    JavaScriptの変数名で最初の文字に「$」を付けるのは《本当に》アリなのか?
  • 頭が$で始まる JavaScript の変数名―jQuery の命名則でドルマークを使う意味・由来 | 黒くないすべてのものはカラスではない

    買ったまま長いことツンドクだった jQuery Cookbookを最近パラパラと読んでいます。 発行が2年前ということもあり、updateの速いjQueryの解説書としてはもうそろそろ 2nd Editonが出てもおかしくない時期(※)ですので今買うのはあまりお勧めしませんが、basic部分では十分役に立つ内容です。 ※ただし2013年1月5日時点ではまだ2nd editionはオライリの近刊予告リストにも入っていません。 パラパラとめくっているうちに、いくつか次のような変数宣言があるのに気が付きました。 var $element = … var $item = … JavaScriptで、$で始まる変数宣言というのをみた記憶がなかったので「アレッ」と思いました。 一瞬、著者が perlのコードと書き間違えたのではないかと思ったのですが、同書をよく読むと次のような一説がありました。 “…

  • 1