はじめに
ブラウザと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についてグッと理解が深まると思います✨
