JavaScript で「こんにちは世界」

 今日はプログラミング定番の「HelloWorld」です。


1 画面に文字を表示する

 JavaScript で文字を出力するにはどうしたらよいのでしょうか?

サンプル

HelloWorld.

HelloWorld.

 1行目は <h1>、2行目は <p>、3行目は <script> のタグの内容です。
 2行目と3行目は全く同じ内容ですね。
 なお、title で囲まれた部分は、ブラウザの左上の帯に表示されるものです。


2 オブジェクト指向

 ここで書籍のほうでは「オブジェクト指向」の説明となります。
 プログラムを「もの」として扱い、それには「動作」「値」がある。
 具体的にはそれぞれ「自動車」「発進する」「止まる」「スピード」「走行距離」でたとえられています。
 JavaScript では、それぞれ「オブジェクト」「メソッド」「プロパティ」と呼ばれています。
 そして、そのメソッドが処理を行うために必要なのが「引数」(ひきすう)です。


3 オブジェクト指向(メソッド)

サンプル

 documentオブジェクトwriteメソッド、”<p>HelloWorld.</p>” が引数となります。メソッドは「 .」の後に記述され、また、引数は( )で囲まれます。
 なお、この document はあらかじめ用意されたオブジェクトですので、write というメソッドを使って画面に文字「HelloWorld.」を表示させることができました。(ビルト イン オブジェクト といいます。)


4 オブジェクト指向(プロパティ)

 では、プロパティはどのように使うのでしょうか?
 値なので表示することができるはずです。
 次の例では、title タグが「こんにちは」と書かれています。

タイトル

こんにちは

 まずかっこ内は、documentオブジェクト、「 . 」を挟んで、title プロパティです。
 ということは、document.title は、このサイトのタイトル部分を取得するということになり、結果として、(document.title) が (こんにちは) と認識されます。
 その置き換えられた「こんにちは」が、メソッドである write により表示されるというわけですね。
 <p> タグの位置が、前の例と異なる(<script> タグの外側)のが疑問ではありますが。


5 次回

 これでやっとプログラミングらしくなってきましたね。
 さて、次回はいかにもプログラミングらしい要素である「演算」を勉強します。

カテゴリー

更新記事

タグ

break (1) class (3) collection (6) continue (1) CSS (2) DOM (2) for (1) function (3) HTML (8) if (2) JavaScript (28) object (5) pop (1) push (1) shift (1) switch (1) unshift (1) VBA (1) while (2) アンガーマネジメント (1) インソース (1) ココナラ (8) コーチング (1) チーズ (2) ネズミ (2) ノート (2) ブランディング (1) ブランド (1) プログリット (1) ポート (1) メモ (2) リスキリング (1) 変数 (3) 学習 (1) 小人 (2) 怒り (1) 株式 (6) 睡眠 (3) 給水器 (1) 記憶 (3) Aoba-BBT (8) IGS (8) Kラーニング (1)



Categories: