javascriptの基礎知識
javascriptの変数と定数
変数の定義方法
1, let 変数名 = "代入する値";
※（変数名 = "再代入する値";）とすれば後から変数の中身を変更できる。
定数の定義方法
2, const 定数名 = "代入する値";
※ 後から中身を変更することはできない
javascriptの関数
javascriptにおける「関数」とは「いくつかの処理をまとめたもの」である。
関数の定義は、
const 関数名 = function() {
//まとめたい処理を記述
};
のように行う。
※関数を定数に代入することで関数を定義している
関数名();
のように書くことで、関数を呼び出すことができる。
アロー関数
関数の定義は、
const 関数名 = function() {
//まとめたい処理を記述
};
この方法以外に、
const 関数名 = () => {
//まとめたい処理を記述
};
とすることでも定義することができる。
これはjavascriptのバージョンES6から導入された新しい書き方で、「function」を用いて関数を定義するよりも、シンプルに書くことができる。
この書き方を「アロー関数」と呼ぶ。
呼び出し方はどちらも同じ。
javascriptの引数
javascriptにおける「引数」とは関数に与える追加情報のようなものである。
関数を呼び出すときに、一緒に値を渡すことで、関数の中でその値を利用することができる。
引数を受け取る関数の定義
const 関数名 = (引数名) => {
//処理
};
引数を受け取る関数の呼び出し
関数名(値);
関数内で引数を使用する
const introduce = (name) => {
console.log("こんにちは");
console.log(`私は${name}です`);
};
introduce("さかい");
→こんにちは
私は酒井です
introduce("ゆう");
→こんにちは
私はゆうです
関数を呼び出す際の引数によって出力結果が変わる。
複数の引数を受け取る関数
const 定数名 = (第一引数, 第二引数, ...) => {
//処理
};
複数の引数を受け取る関数の呼び出し
const introduce = (name, age) => {
console.log(`私は${name}です`);
console.log(`私は${age}歳です`);
};
introdece("さかいゆう", 18);
→私はさかいゆうです
私は18歳です
戻り値のある関数
呼び出し元で受け取る関数の処理結果を「戻り値」と呼ぶ
関数の中でreturnを記述すると、呼び出し元で値を受け取れるようになる
「return 値;」と書くことで、関数はその値を戻り値として返す。
const add = (a, b) => {
return a + b;
};
この場合、aとbを足した値が戻り値として呼び出し元に返る。
戻り値を受け取る
呼び出した関数に戻り値がある場合、関数の呼び出し部分がそのまま戻り値に置き換わる。
関数の呼び出し部分を定数に代入することもできる。
const add = (a, b) => {
return a + b;
};
const sum = add(1, 3);←関数呼び出し部分を定数sumに代入
console.log(sum);←戻り値が関数呼び出し部分に置きかわっているので4が出力される。
→4
さまざまな戻り値
戻り値も引数と同様に、さまざまな値を用いることができる。
例えば、条件式をreturnとすると、その条件式の結果として得られる真偽値（trueもしくはfalse）を返すことができる。
const check = (number) => {
return number % 2 === 0
};
console.log(check(6));
→true
console.log(check(7));
→false
returnによる処理の終了
returnは、戻り値を返すだけでなく、関数の処理を終了させる性質も持っている。
よって、returnの後にある関数内の処理は実行されないので注意する。
オブジェクト
オブジェクトは複数の値をプロパティという名前をつけて管理できるもの。
const user = { name: "さかいゆう", age: 18" };
プロパティ：name、値：さかいゆう
プロパティ：age、値：18
console.log(user.age);
→18
定数名.プロパティ名で値を取得できる。
オブジェクトと関数
オブジェクトの値の部分には関数を用いることもできる。
const 定数名 = {
プロパティ名: () => {
//処理
}
};
※値の部分に関数
定数名.プロパティ名()
※関数の呼び出し
オブジェクトと関数（具体例）
greetプロパティに対応する値に「こんにちは！」と出力する関数を定義。
const user = {
name:"さかいゆう",
greet: () => {
console.log("こんにちは！");
}
};
関数の呼び出し
user.greet();
→こんにちは！
javascriptにおけるクラスとは
効率よくオブジェクトを作成していくための方法として、最初に「設計図」を用意する方法がある。この「設計図」のことをjavascriptでは「クラス」と呼ぶ。
class User{
}
のようにすることでクラスを用意することができる。
インスタンスの生成
インスタンスとは、クラスから生成されたオブジェクトのこと。
クラスからインスタンスを生成するためには、以下のようにする。
class Animal{
}
const animal = new Animal();
※Animalインスタンスを定数animalに代入
インスタンスの確認
class Animal{
}
const animal = new Animal();
console.log(animal);
→Animal{}
※空のオブジェクト
コンストラクタとは
クラスには、コンストラクタと呼ばれる機能が用意されている。コンストラクタはインスタンスを生成するときに実行したい処理や設定を追加するための機能である。
class Animal{
constructor(){
}
}
のように記述する。
コンストラクタの処理
class Animal {
constructor () {
console.log("こんにちは");
}
}
const animal1 = new Animal();
→こんにちは
const animal2 = new Animal();
→こんにちは
プロパティと値を追加する
コンストラクタの中で、「this.プロパティ名 ＝ 値」とすることで、生成されたインスタンスにプロパティと値を追加することができる。
class Animal {
constructor () {
this.name = "レオ";
}
}
インスタンスとプロパティ
インスタンスはオブジェクトなので、コンストラクタの中で追加した値は、オブジェクトと同様に、「インスタンス.プロパティ」とすることで、クラスの外で使用することができる。
class Animal {
constructor () {
this.name = "レオ";
}
}
const animal = new Animal();
console.log(animal.name);
→レオ
