私が唯一書けない（？）Javascriptを学習する機会があったので、色々まとめました。
（これで側が作れないですって常套句が使えなくなりました）
型付け
Javascriptは動的型付け。また、型に一貫性を持たない（弱い型）
（個人的にはバグの温床になるから嫌いな仕様です）
静的型付け
let qiita = "qiita";
// ⇒実行時にString型で判断される
qiita = 100;
// ⇒代入可能
Javaなどの静的型付けとは挙動が異なる。
動的型付け
char qiita;
qiita = "qiita";
// ⇒記載した地点でChar型
qiita = 100;
// ⇒エラーで代入不可
変数と定数の宣言
constとletで宣言
const qiita = "qiita"; // 定数
let qiita = "qiita"; // 変数
演算子
至って普通です。
const num1 = 1;
const num2 = 2;
const num3 = 3;
// 四則演算
console.log(num1 + num2);
console.log(num1 - num2);
console.log(num1 * num2);
console.log(num1 / num2);
// 余りと累乗
console.log(num1 % num2);
console.log(num1 ** num2);
// 計算の優先度も普通
console.log(num1 + num2 * num3);
console.log((num1 + num2) * num3);
イベント処理（クリック / WEBページが読み込まれた 等）
対象要素.addEventListener(種類, 関数, イベント伝播)
// イベント伝播はデフォルトでfalse
イベント処理
function hoge() {
// 処理
}
// クリックイベントが発火した時に関数を呼び出す
addButton.addEventListener("click", hoge);
以下はNG。
（今はとりあえず理屈は置いておきます）
NG
function hoge() {
// 処理
}
function fuga(num1) {
// 処理
}
addButton.addEventListener("click", hoge());
addButton.addEventListener("click", fuga(aaa));
型の色々
型の確認
const num = 0;
console.log(typeof num);
型変換
string -> num
const str = "0";
console.log(typeof str)
console.log(typeof parseInt(str));
num -> string
const num = 0;
console.log(typeof num)
console.log(typeof num.toString());
Array型
（細かいArrayの操作は置いておきます）
Array
let array = [];
array.push("hoge"); // 要素の追加
console.log(array);
Object型
Object
const object = {
name: "John",
age: 30
};
console.log("object: ", object);
// オブジェクトの要素取得はどちらの記載でもOK
console.log("name: ", object.name);
console.log("age: ", object["age"]);
スプレッド構文 / レスト構文
スプレッド構文
const array1 = [1, 2];
const array2 = [3, 4];
const log = [...array1, ...array2];
// 配列の中身が展開される
console.log(log); // [1, 2, 3, 4]
レスト構文
const array3 = [1, 2, 3, 4, 5];
const [x, y, ...z] = array3;
// x, yには配列の要素が分割代入される
// zには残った配列が代入される
console.log(x, y, z); // 1 2 [3, 4, 5]
高階関数
高階関数 -> 関数を引数に取る関数のこと
（私のPCだと高階関数って変換が出なかったです）
filter
const words = ["a", "bbb", "ccccc"];
// filter 配列に使える高階関数
const log = words.filter(words => words.length > 4);
console.log(log) // ccccc <- 4文字以上の要素が出力される
map
const array = [1, 4, 9, 16];
// map 配列の各要素に処理を行う
const mappedArray = u.map(x => x * 2);
console.log(mappedArray) // [2, 8, 18, 32] <- それぞれの要素が2倍される
TypeScriptとJavascriptの違いで一番幸せだったところ
TypeScriptではJavascriptと違い変数に型を宣言できる。
定数
const example: string = "Hello World"
関数の引数や戻り値にも同様に型が宣言できる。
関数
const hello = (name: string): string => {
return 'hello, ' + name
}
参考