👌

JavaScript 本日学んだこと 8/25

2023/08/25に公開

値をバックアップしておいて、元の値を書き換えるためのコードについて

値のバックアップ設定したい場合。
まず、numの値を10として、この値は今後変化する可能性があるのでletで宣言する。
バックアップを numBackupとし、今後変化しないのでconstで宣言しておく。
途中でnum = 99;へ変更した場合、
numBackupの値はconstで宣言してるので変更されない。

   let num = 10;

    const numBackup = num;
    num = 99;
    console.log(num);//99
    console.log(numBackup);//10

上記の場合は数値の場合で、次は似たような処理を配列でしてみる。

   const nums = [10, 20, 30];
   const numBackup = nums;
   nums[0] = 99;
   console.log(nums);//[99, 20, 30]
   console.log(numBackup);//[99,20,30]

上記のようにした場合、numsは[99, 20, 30]、numBackupは[10,20,30]になると思っていたが、どちらとも[99, 20, 30]になってしまった。
これは数値と配列の違いで注意しなければならない。

スプレッド構文を使って配列のコピーを作る方法について

それでは配列のコピーを作る方法はどうしたら良いのだろうか。
スプレッド構文を使用することで配列のコピーが作れる。

   const nums = [10, 20, 30];
    // const numBackup = nums;
    // const numBackup = [10, 20, 30];
    const numBackup = [...nums];
    nums[0] = 99;
    console.log(nums);//[99, 20, 30]
    console.log(numBackup);//[10,20,30]

numsBackupに定数を入れるだけだと先ほどのようになってしまうので、
定数ではなく[10, 20, 30];この値を入れてしまえば良い。
ただ、これだと要素数が多くなると大変なのでスプレッド構文を使用すると良い。
const numBackup = [...nums];
こうすれば上の値と同じ数値が表示される。

これで関数編入門が終わりました!
次はDOM編になります。
早く自分でポートフォリオを作成したい!
頑張ろう♪

Discussion