0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

JavaScriptについて

Last updated at Posted at 2025-03-15

このコースでは、JavaScriptの基本的なコードの書き方や変数の扱い方について学んでいきます。

JavaScriptとは

主にWebサイトやWebアプリケーションを開発する際に利用されるプログラミング言語です。
HTMLに動的な処理を実装することができ、Webサイトでよく見られるスライドショーやプルダウンメニューなどは、JavaScriptを使って実装されていることが多いです。

Webページは、HTMLによって構造が作られ、CSSによって装飾が施され、JavaScriptによってアニメーションなどの動きが作られます。

JavaScriptはDOM(Document Object Model)という仕組みを使い、HTMLをツリー構造のオブジェクトデータとして取得します。
そのデータを操作することで、HTMLに動きを付与することができます。

現在、「ライブラリ」という便利な機能を集めたものが多く開発され、世界中で利用されており、 代表的なJSのライブラリやプラットフォームは「jQuery」、「React」、「Node.js」などがあります。

JavaScriptを実行してみよう (JSと略して呼ぶこともあります。)

まずは、JSのコードを実行してみましょう。
コンソールという画面に文字を出力(表示)します。 console.log("○○");というJSのコードを書くと、丸括弧の中の◯◯という文字がコンソールに出力されます。

スクリーンショット_2025-02-09_6.42.49-removebg-preview.png

コンソールとは

コンソールとは、エラーや重要なメッセージを表示するウィンドウです。
通常、私たちが書くコードはコンソールに表示されませんが、意図的にメッセージを表示させることができます。 例えば、デバッグ情報や確認したいデータをコンソールに出力することで、プログラムの動作を確認する際に非常に便利です。
画面で表示させる際に、(JavaScriptではconsole.log())を用いることで、コンソールにデータを出力することができます。

-- コンソール画面の開き方について --

①ブラウザを開いて、右クリックを押して「検証」をクリックします。

スクリーンショット 2025-02-09 6.47.08.png

②以下のような画面が開きます。

以下の画面のことをデベロッパーツールと呼びます。今後頻繁に使いますので必ず覚えておきましょう。
デベロッパーツールを開き、「コンソール」タブをクリックします。すると、JSの実行結果を確認することができます。

スクリーンショット_2025-02-09_6.51.53-removebg-preview.png

それでは、早速JSで書いてみましょう。

console.log()は、括弧内に入力された値をコンソールに出力します。
文字列を出力する場合は、シングルクォーテーション(')かダブルクォーテーション(")でその文字列を囲みます。

スクリーンショット_2025-02-09_6.58.53-removebg-preview.png

JavaScriptの文の最後はセミコロン(;)で終わります。
セミコロンはなくても正常に動作する場合が多いですが、思わぬ不具合が生じる可能性があるので、忘れずにつけましょう。

スクリーンショット_2025-02-09_7.01.34-removebg-preview.png

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?