振り返りと個人的メモを共有します。
JavaScript ES6
変数の宣言
var name = "xxxx";//再宣言可、再代入可、関数スコープ(ES5以下でも動作)
let name = "xxxx";//再宣言不可、再代入可、ブロックスコープ
const name = "xxxx";//再宣言不可、再代入不可、ブロックスコープ
算術演算子
| 演算 | 数式 |
|---|---|
| 加算 | a+b |
| 減算 | a-b |
| 乗算 | a*b |
| 除算 | a/b |
| 剰余 | a%b |
if文
if (a === b) {
proc();
} else if {
proc();
}else{
proc();
}
switch文
switch (val) {
case 1:
関数
const 定数名 = function(){
//纏めたい処理
};
定数に対し、function()の内容を代入することで
関数を定義する。
関数を定義しただけでは処理は実行されない
「定義した定数名();」と書くことで実行される。
アロー関数
関数定義時のfunction()を()=>と記載することも可能。
これはES6から導入されたアロー関数と呼ばれるもの。
const 定数名 = ()=>{
//纏めたい処理
};
引数
const 定数名 = (第1引数,第2引数,・・・)=>{
//纏めたい処理
};
戻り値
関数の中でreturnを使うと、呼び出し元で値を受け取れるようになる。
値の返却
const 関数A = (第1引数,第2引数,・・・)=>{
//纏めたい処理
return 値;
};
const 結果用変数 = 関数A(引数1,引数2);
console.log(結果用変数); // =>returnされた値
真偽値の返却
const 関数A = (第1引数,第2引数,・・・)=>{
//纏めたい処理
return 値 === x; //条件に応じたtrue/falseを返却
};
if(関数A(引数)){ //関数の真偽を条件に処理を実行
//関数Aが真の場合に実行する処理
}else{
//関数Aが偽の場合に実行する処理
}
文字列中の変数展開
テンプレートリテラルによる文字列中での変数展開
const val = "World"
// ダブルクォート
const output1 = "Hello " + val + "!" // => Hello World!
// テンプレート構文
const output2 = `Hello ${val}!` // => Hello World!
プレースホルダー内での値の取り扱い
プレースホルダー${...}内では計算や関数呼び出しが可能。
const num1 = 2, num2 = 3
console.log( `num1 + num2 = ${num1 + num2}` )
// => num1 + num2 = 5
function sub(a, b) {
return b + a
}
console.log( `num1 + num2 = ${sub(num1, num2)}` )
// => num1 + num2 = 5