学習中に忘れてしまうことがありましたので、書き留めます。
特に初学者の方の参考になればと思います。
JavaScriptES6
##コンソール出力
nicotine.js
console.log("文字列");
##コメントアウト
nicotine.js
//コメント
##変数の定義
nicotine.js
let 変数名 = 値1;
//値を上書き
変数名 = 値2;
##定数の定義
nicotine.js
const 定数名 = 値;
//上書きできない
##テンプレートリテラル
nicotine.js
//変数を文字列に連結
console.log(`こんにちは、${変数名}さん`);
##条件分岐
nicotine.js
//if文
if (条件式){
処理;
} ←セミコロン不要
//switch文
switch (条件の値){
case 値1:
処理;
break;
case 値2:
処理;
break;
default:
処理
break;
}
##比較演算子
- 等号 ===
- 不等号 !==
##繰り返し処理
nicotine.js
//while文
while(条件式){
処理;
インクリメント;
}
//for文
for(変数定義; 条件式; インクリメント){
処理;
}
##配列
nicotine.js
//定義
const 配列名 = [値, 値, 値];
//値の参照
let 変数名 = 配列名[インデックス番号];
//値が無ければundefinedを返す
//undefinedは条件分岐ではfalse扱い
//配列の長さ
配列名.length;
##オブジェクト
nicotine.js
//定義
const オブジェクト名 = {プロパティ1:値1, プロパティ2:値2};
//値の参照
オブジェクト名.プロパティ
//値が無ければundefinedを返す
//undefinedは条件分岐ではfalse扱い
##配列、オブジェクトの組み合わせ
nicotine.js
//定義
const 配列名 = [
{プロパティ:値, プロパティ:値},
{プロパティ:値, プロパティ:値}
];
//値の参照
配列名[インデックス番号].プロパティ;
##関数
nicotine.js
//定義
const 関数名 = (引数名)=>{
処理;
};
//オブジェクトに定義
const 定数名 = {
プロパティ: ()=>{
処理;
}
};
//呼び出し
関数名(引数);
//オブジェクトに定義した場合
定数名.プロパティ();
##クラス
nicotine.js
//定義
class クラス名 {}
//インスタンス生成
const 定数名 = new クラス名();
//コンストラクタ
class クラス名{
constructor(引数){
this.プロパティ = 値;
}
}
//インスタンスのプロパティ参照
インスタンス名.プロパティ
//メソッド定義
class クラス名{
constructor(引数){
this.プロパティ = 値;
}
メソッド名(){
処理;
}
}
//メソッドの呼び出し
インスタンス.メソッド();
//メソッド内でのインスタンスのプロパティ参照
this.プロパティ
//クラス継承
class 子クラス名 extends 親クラス名{}
//コンストラクタのオーバーライド
constructor(引数1, 引数2, 引数3){
super(引数1, 引数2)
this.プロパティ = 引数3;
}
##ファイルの分割
nicotine.js
//デフォルトエクスポート
//クラス
export default クラス名;
//値
export default 値;
//ファイルがインポートされると自動でインポートされる
//エクスポート時とインポート時の名前が違っても良い
//一つのファイルに一つの値のみ
//名前付きエクスポート
export{値1,値2};
//デフォルトインポート
import 名前(クラス名) from "ファイル";
//名前付きエクスポート
import {値1,値2} from "ファイル";
##パッケージのインポート
nicotine.js
import 定数名 from "パッケージ名";
##配列操作
nicotine.js
//値の追加
配列名.push(値);
//配列繰り返し
配列名.forEach((変数名)=>{
処理;
});
//find(条件に合う一つ目の要素取得)
const 定数名 = 配列名.find((変数名)=>{
return 条件式;
});
//オブジェクトにも使える
//filter(条件に合う要素全ての要素取得)
const 配列名 = 配列名.filter((変数名)=>{
return 条件式;
});
//配列として取得
//オブジェクトにも使える
//map(配列の全ての要素に処理を行い、新しい配列に取得)
const 新配列名 = 配列名.map((変数名)=>{
return 処理;
});