はじめに

プログラミングの勉強を始めて半年ほど。
これまでは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には「;」がいらない

初学者がJavascriptと戦う