JavaScript オブジェクト入門

JavaScript では、文字列や配列などの JavaScript のコア機能から、JavaScript の最上部に構築されたブラウザー API まで、ほとんどのものがオブジェクトです。関連する関数や変数を効率的なパッケージにカプセル化して、便利なデータコンテナーとして動作する独自のオブジェクトを作成することもできます。JavaScript のオブジェクト指向の性質を理解することは、言語に関する知識をさらに深め、より効率的なコードを書く場合に重要です。したがって、このモジュールを用意しました。ここではオブジェクトの理論と構文を詳しく説明し、独自のオブジェクトを作成する方法を見ていきます。

フロントエンドのウェブ開発者になりたい方へ

目標に向かって取り組むために必要な情報をすべて盛り込んだコースを用意しました。

始めましょう

前提条件

このモジュールを始める前に、HTMLCSS にいくらか精通している必要があります。JavaScript を始める前に HTML 入門CSS 入門をひととおり学習することをオススメします。

また、JavaScript オブジェクトを詳細に調べる前に、JavaScript の基本についていくらか精通している必要があります。このモジュールを試す前に、JavaScript の第一歩JavaScript の構成要素を通して学習してください。

メモ: もしあなたが作業しているコンピューター、タブレット、その他の端末で自分でファイルを作れない場合は、JSBinGlitch といったようなオンラインコーディングプログラムで (ほとんどの場合) 試すことができます。

ガイド

オブジェクトの基本

JavaScript オブジェクトについて記載している最初の記事では、基本的な JavaScript オブジェクト構文を見てみます。コースの初期段階で既に見た JavaScript の機能を再び見てみたり、すでに扱っている機能の多くは実際にオブジェクトであるという事実を繰り返し述べています。

オブジェクトプロトタイプ

プロトタイプは、JavaScript オブジェクトが互いに機能を継承するメカニズムであり、古典的なオブジェクト指向プログラミング言語の継承メカニズムとは異なる働きをします。この記事では、その違いを探り、プロトタイプチェーンの仕組みを説明し、prototype プロパティを使用して既存のコンストラクターにメソッドを追加する方法を見ていきます。

オブジェクト指向プログラミング

この記事では、「古典的」オブジェクト指向プログラミングの基本的な原則をいくつか説明し、JavaScript でのプロトタイプモデルとは異なるところを見ていきます。

JavaScript でのクラス

JavaScriptは、「古典的な」オブジェクト指向プログラムを実装したい人のためにいくつかの機能を提供しています。この記事では、これらの機能を説明します。

JSON データの操作

JavaScript Object Notation (JSON) は、JavaScript オブジェクト構文に基づいて構造化されたデータを表現するための標準のテキストベースのフォーマットであり、ウェブサイト上でデータを表現し、送信するために一般的に使用されます (すなわち、サーバーからクライアントへデータを送信して、その結果ウェブページ上に表示することができます)。これはとても良く見るものなので、この記事では、JSON を解析してその中のデータ項目にアクセスしたり、独自の JSON を記述したりするなど、JavaScript を使用して JSON を操作するために必要なことをすべて説明します。

オブジェクト構築の練習

これまでの記事では、基本的な JavaScript オブジェクトの理論と構文の詳細をすべて見てもらい、あなたには出発できるしっかりとした基本が与えられました。この記事では実践的なエクササイズを行い、もっと楽しい色とりどりの色付きのボールを作成するカスタム JavaScript オブジェクトを作る練習をしていきます。

評価

バウンスボールのデモに機能を追加する

この評価では、前の記事のバウンスボールデモを出発点として使用し、新しい興味深い機能を追加する予定です。

関連情報

Learn JavaScript

ウェブ開発者を目指す人のための優れたリソース - 短いレッスンとインタラクティブなテスト、自動評価によるガイドで、インタラクティブな環境で JavaScript を学ぶことができます。最初の 40 レッスンは無料で、少額の 1 回払いでこのコースの全容を利用することができます。