はじめに
プログラミングの勉強を始めて半年ほど。
これまではRubyやJavaなど、バックエンド側の基礎を一通り舐めた感じの学習をしてきました。
フロントの知識も一通り触れておくため、Javascriptについて、学習を進める。
Javascriptってなんぞ？
フロントエンド側の言語の1つ。Javaとは全くの別物。
よく「HTML/CSS/Javascript」と一緒に語られることが多い。
動きやロジックを組むことができる。
個人的にバックエンドはデータベースが絡むイメージ。
フロントエンドはデータベースが絡まないロジックイメージ。
Javascriptだけではサイトは作れない
勉強し始める前は、1つの言語で1つのサービスが出来上がっていると勝手に思っていたがそうではない。
HTMLやCSSやJavascript、その他いろいろな言語がそれぞれ絡み合って、1つのサービスやサイトの作成が行われる。
JavascriptとHTML
HTMLに対してJavascriptを効かせるためには2つの方法がある。
-
<script>タグでHTMLファイル内にJavascriptの記述をする。 -
<script src = "~.js">で外部の.jsファイル(javascript)を読み込む
超基礎文法
console.log();
()内の内容を検証ツールのコンソールに表示できる。
検証ツールに表示されるので、HTML上には表示されない。
文字列は""で出力できる。
alert();
()内の内容をポップとして出すことができる。
文字列は""で出力できる。
const/let/var
変数の設定をすることができる。
- const 変数の中身は編集できない
- let 変数の中身を編集することができる
- var 少し古め、あまり使わない
例
const animal = "tanuki"; //上書きできない
let animalCount = 0; //上書きできる繰り返しとかでよく使うねanimalCount++;とか。
if文と合わせてみる
if文はいろんな言語であるんですネ。
if文でconstとalertを使う
const animal = "tanuki"; //変数animalの中身がtanuki
if(animal === "neko"){ //animalはneko??
alert("neko");
}else if(animal === "tanuki"){ //animalはtanuki??
alert("tanuki");
}else{ //nekoでもtanukiでもないの??
alert("君の名は");
}
文字列が等しいか調べるときには===をつかうよ。
余談、===と==の違い。
===は厳密等価演算子、==は等価演算子と呼ぶ。
余談
const left: any = null;
const right: any = undefined;
// falseと表示される
console.log(left === right);
// trueと表示される
console.log(left == right);
nullとundefinedは一見違うように見えるが
意味は同じなので==だとtrueになるのかぁ。ほえ～。
▼参考にしたサイト
DOMってなに？
Document Object Modelの略。
随時更新！！！！！
forとifには「;」がいらない