ドットインストールで、JavaScriptの学び直しを行いました。
大切だと思ったことをメモに残していきます。✍🏻

数値操作編

`Math.ceil`

どの値でも、切り上げ整数。
「自分より大きい方向」へ進んで、最も近い整数を見つけます。

Math.ceil(5.1) は 6
Math.ceil(5.8) は 6
Math.ceil(5.0) は 5
Math.ceil(-5.1) は -5（-5.1の天井は-5、より大きい方向へ）
Math.ceil(-5.8) は -5

`Math.floor`

どの値でも、切り捨て整数。
「自分より小さい方向」へ進んで、最も近い整数を見つけます。

Math.floor(5.1) は 5
Math.floor(5.8) は 5
Math.floor(5.0) は 5
Math.floor(1.7) は 1
Math.floor(-5.1) は -6 （-5.1の床は-6、より小さい方向へ）
Math.floor(-5.8) は -6

`Math.round`

1.6以上だったら切り上げ整数。
1.6未満だったら切り捨て整数。

`.toFixed(桁数)`

桁数で四捨五入した値を算出。
戻り値は文字列となる。

(n / 138.91).toFixed(2);

`.toLocaleString()`

３桁ごとにカンマを入れてくれる。
数値にしか使用できない。

`Math.random()`

0以上1未満のランダムな少数を生成してくれる。

上限の値を変えたい場合はかける。
以下だと、0以上3未満となる。

Math.random() * 3

`Math.max() / Math.min()`

`Math.max()`

与えられた複数の数値の中から、最も大きい（最大の）数値を見つけて返すメソッドです。

console.log(Math.max(10, 5, 20, 3)); // 20
console.log(Math.max(100, 50));     // 100
console.log(Math.max(-1, -5, -2));  // -1 (負の数でも最大値を見つける)
console.log(Math.max(0, 0, 0));     // 0

`Math.min()`

与えられた複数の数値の中から、最も小さい（最小の）数値を見つけて返すメソッドです。

console.log(Math.min(10, 5, 20, 3)); // 3
console.log(Math.min(100, 50));     // 50
console.log(Math.min(-1, -5, -2));  // -5 (負の数でも最小値を見つける)
console.log(Math.min(0, 0, 0));     // 0

それぞれのポイント

配列の中に含まれる数値の最大値を見つけたい場合は、スプレッド構文 (...) を使うと便利です。

const numbers = [15, 8, 30, 2];
console.log(Math.max(...numbers)); // 30

引数がない場合:
Math.max()を引数なしで呼び出すと、-Infinity (負の無限大) を返します。これは、比較対象がないので「どんな数よりも小さい」という状態を表します。
非数値が含まれる場合:
引数の中に数値に変換できないもの（例: NaN、文字列など）が含まれていると、結果はNaNになります。

文字列操作編

文字列.lengthで長さを取得できる
[x]で文字へのアクセスができる（読み取り専用）

`toLowerCase()`

文字列を全て小文字にする。

`toUpperCase()`

文字列を全て大文字にする。

`trim()`

前後の空白を除去する。

`includes()`

ある文字列や配列の中に、特定の文字列や要素が「含まれているかどうか」を調べるメソッドです。
結果は true（含まれている）または false（含まれていない）の真偽値で返されます。

元の配列.includes(検索したい要素, [検索開始位置]);

大文字・小文字を区別します。

`indexOf()`

ある文字列や配列の中に、特定の文字列や要素が「どこにあるか（最初の位置）」を調べるメソッドです。
見つかった場合はそのインデックス（位置番号）を、見つからなかった場合は -1 を返します。

元の配列.indexOf(検索したい要素, [検索開始位置]);

検索開始位置は省略可能で、デフォルトは 0 です。

大文字・小文字を区別します。

`startsWith()`

ある文字列が、特定の文字列で「始まっているかどうか」を調べるメソッドです。
結果は true または false で返されます。

このメソッドは文字列にのみ使えます。配列には使えません。
大文字・小文字を区別します。

`slice()`

元の文字列や配列の一部を「切り出して」、新しい文字列や配列を作成するためのメソッドです。
元のデータは変更されません。

元のデータ.slice(開始インデックス, [終了インデックス]);

開始インデックス (startIndex):
- 切り出しを開始したい位置のインデックス（番号）を指定します。
- 負の数を指定すると、末尾からの位置を示します。
  （例: -1 は最後尾の要素/文字、-2 は最後から2番目）
終了インデックス (endIndex):
- 切り出しを終了したい位置のインデックスの直前を指定します。
- このインデックスの要素/文字は含まれません。
- 省略した場合、開始インデックスからデータの最後までが切り出されます。
- 負の数を指定すると、末尾からの位置を示します。

実行例をみてみましょう。

const colors = ["red", "green", "blue", "yellow", "purple"];
// インデックス:    0       1       2         3         4

// 例1: 開始インデックスのみ指定 (そこから最後まで)
console.log(colors.slice(2));      // ["blue", "yellow", "purple"] (インデックス2 'blue' から最後まで)

// 例2: 開始インデックスと終了インデックスを指定
console.log(colors.slice(0, 3));   // ["red", "green", "blue"] (インデックス0 'red' からインデックス3 'yellow' の直前まで)
console.log(colors.slice(1, 4));   // ["green", "blue", "yellow"]

// 例3: 負のインデックスを使用 (末尾から数える)
console.log(colors.slice(-3));     // ["blue", "yellow", "purple"] (最後から3番目 'blue' から最後まで)
console.log(colors.slice(-4, -1)); // ["green", "blue", "yellow"] (最後から4番目 'green' から最後から1番目 'purple' の直前まで)

// 例4: 引数なし
console.log(colors.slice());       // ["red", "green", "blue", "yellow", "purple"] (配列全体のシャローコピーを作成)
// これは、元の配列を変更せずに新しい配列のコピーを作りたい場合によく使われます。

引数なしで呼び出すと、元の配列や文字列の完全なコピーが作成されます。

`replace()`

文字列の中から「最初に見つかった」指定のパターン（文字列または正規表現）を、別の文字列に置き換えるメソッドです。

元の文字列.replace(検索パターン, 置換する文字列);

検索パターン: 置き換えたい文字列、または正規表現を指定します。
置換する文字列: 置き換え後の文字列を指定します。

replaceのポイント

大文字・小文字を区別します。
「最初に見つかったものだけ」を置換します。
元の文字列は変更しない。

`replaceAll()`

文字列の中から指定のパターン（文字列または正規表現）に一致する「すべて」の箇所を、別の文字列に置き換えるメソッドです。

const sentence2 = "Hello World! Hello JavaScript!";

// 例1: すべての"Hello"を"Hi"に置き換える
console.log(sentence2.replaceAll("Hello", "Hi"));
// 出力: "Hi World! Hi JavaScript!" (すべての"Hello"が置き換わる)

// 例2: 見つからない場合
console.log(sentence2.replaceAll("Goodbye", "See you"));
// 出力: "Hello World! Hello JavaScript!" (元の文字列がそのまま返される)

`repeat()`

文字列を「指定した回数だけ繰り返して」、新しい文字列を作成するメソッドです。

元の文字列.repeat(繰り返す回数);

繰り返す回数: 文字列を繰り返したい回数を整数で指定します。

const star = "*";
const dash = "-";
const greeting = "Hello ";

// 例1: 5回繰り返す
console.log(star.repeat(5));     // "*****"

// 例2: 3回繰り返す
console.log(greeting.repeat(3)); // "Hello Hello Hello "

// 例3: 0回繰り返す
console.log(dash.repeat(0));     // "" (空文字列 - 繰り返さないので何も表示されない)

// 例4: 小数点以下の回数を指定した場合 (切り捨てられる)
console.log(star.repeat(3.8));   // "***" (3回繰り返される)

// 例5: 負の数を指定した場合 (エラーになる)
// console.log(star.repeat(-1)); // RangeError: Invalid count value

repratのポイント

元の文字列は変更しない。
負の数を指定すると RangeError というエラーが発生します。

`padStart()/padEnd()`

padStart() は、文字列の「先頭」に、指定した文字を挿入して、文字列全体の長さを特定の長さにするメソッドです。

padEnd() は、文字列の「末尾」に、指定した文字を挿入して、文字列全体の長さを特定の長さにするメソッドです。

元の文字列.padStart(目標の長さ, [埋める文字]);

目標の長さ (targetLength):
- 新しく作りたい文字列の最終的な長さを数値で指定します。
- もし元の文字列の長さがこの目標の長さ以上であれば、パディングは行われず、元の文字列がそのまま返されます。
埋める文字 (padString): （省略可能）
- パディングに使う文字を文字列で指定します。
- 省略した場合、デフォルトで半角スペース (' ') が使われます。

const num = "42";
const id = "123";
const word = "hello";

// 例1: 先頭を0で埋めて5桁にする
console.log(num.padStart(5, '0'));   // "00042"
console.log(id.padStart(5, '0'));    // "00123"

// 例2: 目標の長さが元の文字列より短いか同じ場合
console.log(num.padStart(2, '0'));   // "42" (元の長さと同じなので変化なし)
console.log(num.padStart(1, '0'));   // "42" (目標の長さが短いので変化なし)

// 例3: 埋める文字を省略 (デフォルトで半角スペース)
console.log(word.padStart(10));      // "     hello" (5つの半角スペースで埋められる)

// 例4: 埋める文字が複数文字の場合 (足りない分だけ繰り返し使用)
console.log(num.padStart(7, 'abc')); // "abc0042" (abcabc0042 とはならず、必要な分だけ埋められる)

repratのポイント

このメソッドは文字列にのみ使えます。
元の文字列は変更しない。