Deep Insider の Tutor コーナー
>>  Deep Insider は本サイトからスピンオフした姉妹サイトです。よろしく! 
書籍転載:JavaScriptライブラリ実践活用[厳選111]

書籍転載:JavaScriptライブラリ実践活用[厳選111]

処理を短く記述する[CoffeeScript]

2013年6月27日

書籍転載の15本目(書籍内の番号は「64」)。CoffeeScriptの基本構文のうち、数値や文字列表現、配列、for~in、unless/untilの記述方法を説明する。

WINGSプロジェクト 安西 剛
  • このエントリーをはてなブックマークに追加

書籍転載について

 本コーナーは、技術評論社発行の書籍『JavaScriptライブラリ実践活用[厳選111]』の中から、特にBuild Insiderの読者に有用だと考えられる項目を編集部が選び、同社の許可を得て転載したものです。

 『JavaScriptライブラリ実践活用[厳選111]』の詳細や購入は技術評論社のサイト目次ページをご覧ください。

ご注意

本記事は、書籍の内容を改変することなく、そのまま転載したものです。このため用字用語の統一ルールなどはBuild Insiderのそれとは一致しません。あらかじめご了承ください。

JavaScriptは、初心者でも始めやすい言語ですが、深く理解しバグの少ないコードを書くには言語仕様上の「罠」が潜んでいます。そこで、CoffeeScriptに沿ってコードを記述することによって、その「罠」を回避し、安全で高性能なJavaScriptを生成、実行することが可能になります。ここでは、文字列や配列などの記述方法を解説します。

 ここでは、CoffeeScriptの基本構文を1つずつ見ていきます。

数値、文字列表現

 リスト064-01をご覧ください。

CoffeeScript
###
  変数
###
# 1数値
i = 225
f = 5.23
sum = i + f + 3 * 6

# 文字列
name = "安西"

# 2変数の展開
hello = "こんにちは、" + name + "さん" #「こんにちは、安西さん」
hello = "こんにちは、#{name}さん" #「こんにちは、安西さん」

# 3複数行に渡るヒアドキュメント
html = '''
<ul>
  <li>アプリを作ろう! Android入門~ゼロから学ぶアプリの作成から公開まで</li>
  <li>TECHNICAL MASTER はじめてのJSP&サーブレット Eclipse 3.7 Indigo+Tomcat 7対応版</li><li>Windows Azure Platform開発入門</li>
</ul>
'''
リスト064-01 変数への格納と演算子(syntax_variable1.coffee)

 1変数の格納や演算子はJavaScriptと同じです。

 2「#{変数名}」と記述することにより、変数内に変数の展開をすることができます。JavaScriptと同じように「+」でつなげることもできます。

 3複数に改行した値を変数に格納したい場合、「'''」または「"""」で囲むことによって変数に格納することができます。このような書き方をヒアドキュメントと言います。

配列

 配列の表現力が格段に上がっています(リスト064-02)。1JavaScriptと同様に宣言も可能ですが、2Rangeで宣言も可能です。連想配列は、3JavaScriptと同様にハッシュで宣言できるほか、4YAML形式でも宣言が可能です。

CoffeeScript
###
  配列
###
# 1配列の宣言
music = ["C", "D", "E", "G", "F", "A", "H"]
# 配列への格納
music[6] = "B"
# 改行して宣言
bitlist = [
  1, 0, 1
  0, 0, 1
  1, 1, 0
]

# 2Rangeで配列宣言。ここでは、1~10の値の配列が作成できている
numAry = [1..10]
# 3連想配列の宣言
yamada = {name: "yoshihiro", age: 27}
# 個別に格納
yasunishi = []
yasunishi["name"] = "tsuyoshi"
yasunishi["age"] = 3

# 4YAML形式で宣言
members =
  yamada:
    name: "yoshihiro"
    age: 28
  yasunishi:
    name: "tsuyoshi"
    age: 3
リスト064-02 syntax_array.coffee

for~in、unless/until

 最後に、CoffeeScriptで特徴的な2つの命令を説明します。リスト064-03は、for~in命令とunless/until命令のサンプルです。

CoffeeScript
# 1for ~ in
eat food for food in ['sushi', 'tenpura', 'sukiyaki']

# 2unless
x = 2
unless x is 1
  x

# 3until
until x is 5
  x++
リスト064-03 syntax_other.coffee

 1配列やオブジェクトのループを行う際にfor~in命令を使えます。配列の内容をfoodに入れてループをし、eatメソッドの引数として実行しています。このように、JavaScriptではfor文で記述する必要がある構文を、for~inで1行で記述することができます。

 JavaScriptでは、if/whileはありますが、否定形の命令は用意されておらず、演算子を使って否定する必要があります。CoffeeScriptでは、否定形であるunless/until命令を用意しています。2unless命令は「条件式がfalseの場合に」、3until命令は「条件式がtrueになるまで」、それぞれ配下のブロックを実行します。

※以下では、本稿の前後を合わせて5回分(第13回~第17回)のみ表示しています。
 連載の全タイトルを参照するには、[この記事の連載 INDEX]を参照してください。

書籍転載:JavaScriptライブラリ実践活用[厳選111]
13. 短くかつ安全で高性能なコードを書く[CoffeeScript]

書籍転載の13本目(書籍内の番号は「62」)。短い記述で、安全かつ高性能なJavaScriptコードを生成できる「CoffeeScript」の基本的な使い方を説明する。

書籍転載:JavaScriptライブラリ実践活用[厳選111]
14. オブジェクト指向でコードを記述する[CoffeeScript]

書籍転載の14本目(書籍内の番号は「63」)。CoffeeScriptを使用すると、クラスベースのオブジェクト指向で記述できる。その内容を説明する。

書籍転載:JavaScriptライブラリ実践活用[厳選111]
15. 【現在、表示中】≫ 処理を短く記述する[CoffeeScript]

書籍転載の15本目(書籍内の番号は「64」)。CoffeeScriptの基本構文のうち、数値や文字列表現、配列、for~in、unless/untilの記述方法を説明する。

書籍転載:JavaScriptライブラリ実践活用[厳選111]
16. JavaScriptでクッキーを簡単に操作する[jquery.cookie]

書籍転載の16本目(書籍内の番号は「61」)。JavaScriptでのクッキー操作をごくシンプルなコードで実装できる「jquery.cookieプラグイン」の基本的な使い方を説明する。

書籍転載:JavaScriptライブラリ実践活用[厳選111]
17. HTML5+JavaScriptベースでゲームを作る[enchant.js]

書籍転載の17本目(書籍内の番号は「65」)。HTML5+JavaScriptで作られたゲーム・エンジン「enchant.js」の基礎と、基本的な使い方を解説する。

サイトからのお知らせ

Twitterでつぶやこう!