📌
JavaScript
コールバック関数
コールバック関数は、関数に引数として渡される関数のことで、渡ってきた関数を任意のタイミングで実行できる。
function greet(name, callback) {
console.log("こんにちは、" + name + "さん!");
callback();
}
function sayGoodbye() {
console.log("さようなら!");
}
greet("太郎", sayGoodbye);
実行結果
こんにちは、太郎さん!
さようなら!
分割代入
基本的
const array = [1, 2, 3];
const [a, b, c] = array;
console.log(a); // 1
console.log(b); // 2
console.log(c); // 3
スキップ可能
const [x, , z] = [10, 20, 30];
console.log(x); // 10
console.log(z); // 30
オブジェクトの分割代入
const user = {
name: "Taro",
age: 25
};
const { name, age } = user;
console.log(name); // "Taro"
console.log(age); // 25
プロパティ名と変数名が違うとき
const user = {
name: "Taro",
age: 25
};
const { name: userName, age: userAge } = user;
console.log(userName); // "Taro"
console.log(userAge); // 25
関数の引数で使うこともできる
function greet({ name, age }) {
console.log(`こんにちは、${name}さん(${age}歳)`);
}
const person = { name: "Hanako", age: 30 };
greet(person);
// → こんにちは、Hanakoさん(30歳)
スプレッド演算子(...)
基本的
const arr1 = [1, 2, 3];
const arr2 = [...arr1]; // [1, 2, 3]
配列のコピー・結合
const a = [1, 2];
const b = [3, 4];
const copy = [...a]; // [1, 2]
const merged = [...a, ...b]; // [1, 2, 3, 4]
関数の引数展開
function sum(x, y, z) {
return x + y + z;
}
const nums = [1, 2, 3];
console.log(sum(...nums)); // 6
オブジェクトのコピー・マージ(ES2018以降)
const obj1 = { name: 'Alice' };
const obj2 = { age: 25 };
const mergedObj = { ...obj1, ...obj2 };
// { name: 'Alice', age: 25 }
配列の一部を取り出して新しい配列に
const original = [1, 2, 3, 4];
const [first, ...rest] = original;
console.log(first); // 1
console.log(rest); // [2, 3, 4]
なお、シャローコピーである。
falsy(ファルシー)
falsy(ファルシー)とは、偽(false)とみなされる値のこと。
false
0 // 数値のゼロ
-0 // マイナスゼロ(あまり使わないけど存在する)
0n // BigIntのゼロ
"" // 空文字列
null
undefined
NaN // 計算不能な数値(例: 0 / 0)
非同期処理
どちらも非同期処理だが、async / awaitの方がコードが分かりやすい
Promise
async / await
use strict
use strictとは、コードに対してエラーチェックを強化し、より安全な書き方を強制する。
テンプレートリテラル
文字列を扱うときにとても便利な機能
変数展開(埋め込み)
const name = "太郎";
const message = `こんにちは、${name}さん!`;
console.log(message); // → こんにちは、太郎さん!
式の評価
const a = 5;
const b = 10;
console.log(`合計は ${a + b} です`); // → 合計は 15 です
複数行の文字列
const text = `これは
複数行に
またがった文字列です`;
console.log(text);
関数との組み合わせ(タグ付きテンプレート)
function emphasize(strings, ...values) {
return strings[0] + values.map((v, i) => `**${v}**${strings[i + 1]}`).join('');
}
const name = "太郎";
const age = 20;
console.log(emphasize`名前は${name}、年齢は${age}歳です`);
Discussion