概要

JavaScriptプログラミングを一から学ぶための，やさしい入門書です。Webサーバーを利用するための環境構築から始まり，文法，構文，変数・配列の扱い方，オブジェクトの利用，HTMLの操作，イベント処理，Web APIの利用法など，JavaScriptによるプログラミングで必要になる知識を一通り解説しています。最終的に，これらの知識をもとにしてWebアプリを開発していきます。1日8時間の勤務時間内に読むことができる内容で，初心者・新人が最初に読む解説書としてふさわしい1冊です。

こんな方におすすめ

• JavaScriptプログラミングを一から勉強したい入門者

目次

CHAPTER 1　環境設定

• SECTION 01　JavaScriptの概要を理解しよう
• SECTION 02　開発環境を準備しよう
• SECTION 03　Apacheをインストールしよう
• SECTION 04　Google Chromeをインストールしよう
• SECTION 05　作成した開発環境を確認してみよう

CHAPTER 2　JavaScriptの基本的な文法

• SECTION 01　JavaScriptの基本的なルールを理解しよう
• SECTION 02　変数を使ってみよう
• SECTION 03　オブジェクトを使ってみよう

CHAPTER 3　よく利用される変数や処理の扱い

• SECTION 01　変数を操作してみよう
• SECTION 02　処理の流れを制御してみよう
• SECTION 03　処理をまとめてみよう
• SECTION 04　プログラムを効率よく作成してみよう

CHAPTER 4　HTMLを操作する

• SECTION 01　HTMLを操作する仕組みを理解しよう
• SECTION 02　要素を取得してみよう
• SECTION 03　HTMLを書き換えてみよう

CHAPTER 5　イベントを扱う

• SECTION 01　イベントの仕組みを理解しよう
• SECTION 02　イベント発生時に処理を行ってみよう
• SECTION 03　イベントを利用して動的に画面を変更してみよう

CHAPTER 6　Web APIを利用する

• SECTION 01　APIの仕組みを理解しよう
• SECTION 02　JavaScriptからWeb APIを呼び出してみよう
• SECTION 03　画像検索アプリを作成してみよう

CHAPTER 7　日記アプリを作成する

• SECTION 01　日記アプリを作成してみよう
• SECTION 02　データを保存してみよう
• SECTION 03　日付の扱いをマスターしよう
• SECTION 04　カレンダーを作ってみよう
• SECTION 05　カレンダーに日記機能をつけてみよう

CHAPTER 8　さらに開発を進めるために

• SECTION 01　JavaScriptのプログラムを1人で練習してみよう
• SECTION 02　jQueryを利用してみよう
• SECTION 03　jQueryのプラグインを利用してさまざまな機能を実装しよう

サポート

ダウンロード

以下のファイルをダウンロードできます。圧縮ファイルをダウンロードしていただき，適宜解凍してご利用ください。

ダウンロード

js_sample.zip

正誤表

本書の以下の部分に誤りがありました。ここに訂正するとともに，ご迷惑をおかけしたことを深くお詫び申し上げます。

P.63　表3-3「条件式」の説明

P.84　上のリスト（リスト4-1）下から3行目

<p id="sample">要素を取得<p>

<p id="sample">要素を取得</p>

P.94　リスト4-8下から4行目

<p id="sample">要素を取得<p>

<p id="sample">要素を取得</p>

P.159　リスト7-15上から5行目

button.setAttribute("data-diary", dateStr);

button.setAttribute("data-date", dateStr);

P.160　本文1行目

getElementByIdメソッドで取得し、data-diary属性として、

getElementByIdメソッドで取得し、data-date属性として、

P..163　リスト7-19 calendar_diary.html 45行目

window.onload = function(){

window.addEventListener("DOMContentLoaded", function(){

P..165 リスト 7-19 calendar_diary.html 18行目

htmlStr += "<a onclick='presetDiary(\"" + dateStr + "\");’>" +

htmlStr += "<a onclick='presetDiary(\"" + dateStr + "\");'>" +

最後のシングルクォートは半角文字です。

P..165 リスト 7-19 calendar_diary.html 37行目（ </script>の前行）

}

});

P..40下部　「オブジェクト型の変数の宣言」の書式

書式 var 変数名 = {キー1:値1, キー2:値2,,,キーn:値n]}

書式 var 変数名 = {キー1:値1, キー2:値2,,,キーn:値n};

P..48下から4行目　カコミの中