JavaScript自分用まとめ

###変数宣言

• const : 再代入不可
• let : 再代入可能
• var : なるべく使用しないほうが良い

const a;  
let b;
var c;

###関数

function sample(a){
console.log(a);
}

const sample2 = function(a){
console.log(a);
}

const sample3 = a => console.log(a);  //引数が1つ

const sample4 = (a,b) => console.log(a+b);  //引数が2つ

const sample5 = (a,b) => {
const c = a + b;
console.log(c);
}

###配列とforEach
#####・プログラム

const arry = [1,2,3];

arry.forEach(function(a,b,ary){ //(値、添え字、配列そのもの)
  console.log(a,b.arry);
}
)

#####・コンソール

1 0 [1,2,3]
2 1 [1,2,3]
3 2 [1,2,3]

###reduceメソッド
#####・プログラム

const arrt = [1,2,3];

arry.reduce(fuction(a,b){  //1回目:(配列の最初の要素もしくは初期値,配列の2番目の要素)
                           //2回目:(戻り値,配列の要素)
console.log(a,b);
return a + b;
},0); //初期値は0に設定

#####・コンソール

0,1  //初期値,配列の最初の要素
1,2  //0+1,配列の2番目の要素
3,3  //1+2,配列の3番目の要素

###DOM

• Document Object Model (DOM) は HTML や XML 文書のためのプログラミングインターフェイス
• JavaScriptでHTMLを操作することができる

###例

• querySelector : 指定した最初の要素を取得

var el = document.querySelector(".myclass");

• add : 追加操作
• remove : 削除
• toggle : 要素を追加したり削除したりする
• trim : 空白を削除
• addEventListener : イベントの追加

function chageMyStyle(){
//処理
}

btn.addEvenrListener('click',changeMyStyle);

###クラスとオブジェクト

• クラス : 設計図
• オブジェクト : 実際のモノ
• コンストラクター : 必ず必要なモノ

class Car{
  constructor(color, company) {
    this.color = color;
    this.company = company;
  }
  run(){
   //車を走らせる
  }
   
  stop(){
   //車を止める
  }
}

const MyCar = new Car("red","nissen");  //設計図CarでMyCarというオブジェクトを作成するイメージ

console.log(MyCar.color);  //red
console.log(MyCar.company);  //nissen
Mycar.run(); //走る