はじめに
改めて基本を学びました。
##変数varとlet
・varは関数内のどこからでも呼び出すことが可能
・letはブロック{}内のみ参照可
varを使った場合
const Test = (scope) => {
if (scope === 'function') {
var message = 'テスト'
}
console.log(message) //「テスト」が表示される
}
Test('function')
letを使った場合
const Test = (scope) => {
if (scope === 'block') {
let message = 'テスト'
}
console.log(message) //エラーになる
}
Test('block')
下記の様にブロック内だとログが出力できる
const Test = (scope) => {
if (scope === 'block') {
let message = 'テスト'
console.log(message) //「テスト」が表示される
}
}
Test('block')
letの方がES6から採用された変数になります。
参照できる範囲をブロック内に限定したことで、万が一関数の別の場所に同じ変数名があったとしても、それによるバグが起きなくなり、保守性が向上しました。
#定数const
定数は基本的に代入した値を変更できません。
しかし、配列やオブジェクトは定数宣言しても変更(追加や削除)が可能です。
const name = "太郎";
name = "花子"; //変更不可
const numArray = [1, 2, 3];
numArray.push(4); //変更可能
const textObject = {id: "hoge" value: "fuga"}
textObject["name"] = "bar" //変更可能
##関数
名前付き関数
function nameFunc(message) {
console.log(message);
};
nameFunc('これは名前付き関数です。');
アロー関数
const arrowFunc = (message) => {
console.log(message)
};
arrowFunc("これはアロー関数です。");
ワンラインのアロー関数
const users = {
setUser: "Shimpex"
};
const getUsername = (userId) => users[userId]; //returnを省略し、1行で記述できる
// 複数行で書いた場合
// const getUsername = (userId) => {
// return users[userId]
// } ;
const username = getUsername('setUser');
console.log(username);