変数を参照&コピーした際の「"プリミティブ値"と"オブジェクト"の挙動」についての備忘録です。
基礎的な内容ではありますが、初心に帰ってまとめていく。
1: 参照とコピーに入る前に。
■プリミティブやオブジェクトなどの「データ型」について。
・変数は「データ型」という8種類のデータを持っている。
・その8種類のデータ型もJavaScriptでは2つに分けられる。それが【プリミティブ型とオブジェクト】の2つ。
⬇
①プリミティブ型(7種類)
・真偽値(Boolean)、数値(Number)、文字列(String)、undefind(Undefind)、null(Null)、シンボル(Symbol)、BigInt(BigInt)
②オブジェクト(1種類)
・Object(プリミティブ型以外の全て)
オブジェクトというのは「プロパティとその値を次いで格納する入れ物」
■プリミティブ型とオブジェクトの図
| プリミティブ型 | オブジェクト |
|---|---|
| String / Null Number / Symbol Boolean / BigInt Undefind |
Object(プリミティブ型以外の全て) |
■参照とコピーについて(概念)
・参照
「変数などの値や、オブジェクトのプロパティ」を参照すること。
let a = 'hello'; //変数aは「'hello'」を参照している。
let c = {
prop: 'hello' //変数cは「オブジェクト{}」と「プロパティ&値prop: 'hello'」を参照している。
};
・コピー
変数aから変数bにコピーすること。
let a = 'hello';
b = a; //変数bは「変数aの値'hello'をコピー」している。
1: 「プリミティブ値」のコピー
■プリミティブ値のコピー
・プリミティブ値をコピーすると「コピー元とコピー先の値は変更される。」
これはコピーすると「メモリ空間(プログラミングの記憶装置)」のようなものに値が保管され、その値を各自管理しておくためのもの。
下記の例で言うとlet aは'hello'を参照している。その変数aを変数bにコピーすると「プリミティブ値'hello'は新しいメモリ空間に新しくコピーされ、変数bが参照している'hello'は全くの別物となる。」
その後「変数bに新しいプリミティブ値'bye'」を代入すると【変数bの参照先は'bye'に変更されます。】
let a = 'hello';
let b = a; //ここで変数aをコピー。
b = 'bye'; //この時の変数bの参照先は「新しい値'bye'」です
2: 「オブジェクト」のコピー
■オブジェクトのコピーは「変数の参照先」だけをコピーする。
⬇︎
変数bにコピーするとどうなるか？
・変数bは「変数aが保持しているオブジェクトへの参照だけをコピー」します。
変数aのプロパティpropと、値'hello'を共有します。
これは、変数bの参照が保持している値は【変数aのオブジェクトへの実態】なので、コピーされた後も「変数aのプロパティpropと、値'hello'」を共有します」。
⬇︎
・そして「変数bのプロパティpropに新しい値として'bye'」を入れると【変数aのprop参照先も'bye'に変更】されます。
let a = {
prop: 'hello' //変数aは「オブジェクト{}」と「プロパティ&値prop: 'hello'」を参照している。
};
let b = a; //変数aが保持しているオブジェクトへの参照だけをコピー。
b.prop = 'bye'; //b.propに新しい値'bye'を入れると「変数aのprop参照先も'bye'に変更される。」
⬇︎
■上記を図解
3: まとめ
・プリミティブ値のコピー
「参照先の値」がコピーされる。
・オブジェクトのコピー
「オブジェクトへの参照」がコピーされる。
「初歩的な参照とコピーをうっかり間違えてしまった！」なんてことがあると思いまとめてみました。（何を学ぶにしてもこのような感じでメモしておくと良いですね…）
以上、参照&コピーの備忘録でした。