uhyohyo.net

JavaScript初級者から中級者になろう

JavaScript。「ジャヴァスクリプト」と読みます。主にWebページを動きを与えるのに使われるほか、現在ではさまざまなところで活躍しているプログラミング言語です。

現在では多くのWebページに使われていますが、とてもレベルが低く不適切なものも多数あります。もっと質の高いJavaScriptを使える人が増えるといいなという思いから、この講座を作りました。

よく「上級」といいながら低レベルなサンプルを紹介するサイトがありますが、中級講座であるこのサイトを読めば大体のものを自力で創れるようになると思います。ぜひ自分で作りたいものを作れるようになりましょう。

最近の更新

概要

コンテンツは第一篇と第二編に分かれています。

JavaScriptは昔からWebページに動きを与えるものとして用いられてきましたが、第一篇ではそのような、昔からあるJavaScriptの側面を解説します。

第二篇では、だいたい2010年代に入ったくらいから用いられるようになってきた、新しいJavaScript技術について紹介しています。

それぞれの篇は話題ごとに章にわかれています。基礎知識があれば好きな章から読むことができますが、あとの章では前の章の内容を用いた説明をすることがあります。

現在では、専らブラウザ上で動くJavaScriptについて解説しています。

第一篇 古典的なJavaScript

第一篇と称して、昔から親しまれてきたJavaScriptについて紹介します。JavaScriptの基本といってもよいでしょう。

初級者の基礎知識

本文を理解するにはJavaScriptの知識がそれなりに要るので、JavaScriptがそもそもあまり分からない初心者の人は、この辺を読んでみましょう。入門レベルから始めることができます。

  1. 基礎第一回
  2. 基礎第二回
  3. 基礎第三回
  4. 基礎第四回
  5. 基礎第五回
  6. 基礎第六回

第一章 オブジェクト

  1. オブジェクトとは
  2. オブジェクトの実体
  3. 配列のコピー
  4. オブジェクトと関数

第二章 DOMの基礎

  1. HTMLと木構造
  2. DOMとは
  3. 基本的な操作とテキストノード
  4. 木構造の操作:ノードの除去
  5. 木構造の操作:ノードの追加
  6. 木構造の操作:さまざまな機能
  7. 木構造の操作:さまざまな機能2
  8. テーブルの操作
  9. THEADとTFOOT
  10. img要素とその他
  11. スタイルシートの操作
  12. フォームの操作
  13. フォームの操作2
  14. nullとundefined

第三章 DOMとイベント

  1. イベントプロパティ
  2. イベントリスナ
  3. イベントバブリング
  4. イベントキャプチャリング
  5. イベントオブジェクト
  6. mouseoverとmouseout

第四章 文字列の基本と正規表現

  1. 文字列の操作
  2. 正規表現
  3. 正規表現2

第五章 CSSの操作

  1. 計算済みスタイル
  2. CSSの構造
  3. CSSの操作

第六章 XMLとXHTML

  1. XML・XHTMLとは
  2. 名前空間
  3. XHTMLとDOM

第七章 さまざまな機能

  1. 複数のドキュメントを扱う
  2. ノードどうしの位置関係を知る
  3. 条件を満たすノードをまとめて処理する: TreeWalker
  4. ノードをまとめて扱う
  5. サンプル:見出しのリスト
  6. サンプルの改良

第八章 Range

  1. Rangeとは
  2. Rangeの機能
  3. Rangeの活用とSelection
  4. サンプルの改良

第九章 オブジェクト指向

  1. オブジェクト指向とは
  2. prototypeの活用
  3. 継承
  4. プロトタイプベース
  5. クロージャ
  6. ゲッタとセッタ
  7. プリミティブとオブジェクト
  8. 例外処理

第十章 XPath

  1. XPathとは
  2. DOMでのXPathの利用
  3. 属性の取得と型
  4. 述語による絞り込み

第二篇 新しいJavaScript

JavaScriptの中でも割と新しい部類の技術について紹介します。

具体的にはECMAScript5やHTML5の関連技術、最近標準化されたようなものなどを紹介します。

第十一章 ECMAScript5

  1. 配列
  2. bind
  3. console
  4. Objectとプロパティ
  5. プリミティブについて
  6. プリミティブについて2
  7. 継承2

第十二章 HTML5+JavaScript

HTML5講座を作りました。HTML5が分からない方は、そちらを読んでから読むと理解が深まります。

  1. classList
  2. フォーム
  3. History API
  4. dataset
  5. File API
  6. DnD API

第十三章 JavaScriptの通信

JavaScriptは、HTTP通信とかをすることもできます。その方法を解説します。

  1. XMLHttpRequest
  2. Servet-Sent Events
  3. HTML5 Web Messaging
  4. HTML5 Web Messaging2

第十四章 JavaScriptとデータの保存

JavaScriptは、ブラウザにデータを保存しておくことができます。ゲームのセーブデータとかにも使えますね。

  1. Storage
  2. Indexed Database
  3. Indexed Database2
  4. Indexed Database3
  5. Indexed Database4

第十五章 Web Performance

  1. Page Visibility
  2. Navigation Timing
  3. Performance Timeline
  4. Resource Timing
  5. User Timing

質問と回答

  1. 質問と回答1

索引