1
1

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の役割の違いについて

1
Posted at

はじめに

ブラウザとJavaScriptの役割の違いがわかっていなかったので理解するために記事を書きます

目的(ゴール)

  • ブラウザとJavaScriptの役割についてそれぞれ理解する

ブラウザとは

ブラウザっておもうと何を思い浮かべますか?
僕はPCだとChrome、携帯だとSafariをよく使います!

Chromeって何の役割なんでしょう?
普段、使っているけど意識したことなかったw

ブラウザ(Chrome)の主な役割は2つになります!

  • HTMLやCSSを読み取って画面を表示する
  • JavaScriptの命令を実行する

つまり、ブラウザは画面を表示するだけではなく、JavaScriptの命令を実行する役割を持っている!
何となくわかってはいる、、理解を曖昧にしないことが大切かな!

JavaScriptとは

JavaScriptとは何でしょうか?

簡単に言うと、Webページに動きや処理を加えるためのプログラミング言語です!

<button id="button">クリック!</button>
<p id="message">こんにちは!</p>

<script>
  const button = document.getElementById("button");

  button.addEventListener("click", () => {
    document.getElementById("message").textContent = "こんばんは!";
  });
</script>

このJavaScriptには、

「ボタンがクリックされたら、文字を『こんばんは!』に変更してね!」

という命令が書かれています!

ブラウザに表示されるまでの流れ

1. ブラウザがHTMLを読み取って画面を表示をして
2. ブラウザがJavaScriptを実行して、クリック時の処理を登録する
3. そうするとユーザーがボタンをクリックする
4. 登録されたJavaScriptの処理が実行される
5. ブラウザが変更後の文字を画面に反映する

終わりに

JavaScript:「何をするか」を各言語
ブラウザ:「その命令を実行して、画面に反映する」ソフトウェア
ブラウザとJavaScriptの役割って何となくわかっているけど説明してと言われるとわからないですよね〜〜(わからなかった)
これが理解できると次回説明する、CORSについてグッと理解が深まると思います✨

1
1
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
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?