Premitive&Reference(元の値と参照値)
🧵 データ型別に分類
🧵 動作原理による分類
💍 Premitive
初期
🏐 同じ値の場合は同じです
const string1 = "string";
const string2 = "string";
const result = string1 === string2;
console.log(result); // ?
StringはPrimitive(元の値)です.
元の値の形状が同じであれば、同じ値で簡単に判別します.
🏐 指定した値はそのままです
let a = 10;
const b = a;
a = 30;
console.log(b); // 10
aが10の場合、bに1回値が割り当てられるため、aの値が変化するが、aを再割り当てしない場合、bは変わらない.
💎 Reference
(参照)データ型
const string1 = "string";
const string2 = "string";
const result = string1 === string2;
console.log(result); // ?let a = 10;
const b = a;
a = 30;
console.log(b); // 10(参照)データ型
🏐 変数作成プロセス
const a = { id: '1', count: 0};
const b = { id: '2', count: 0};
const c = b;同じbオブジェクト
b変数とc変数は同じ参照値を持つため、同じオブジェクトを指す.
🏐 同じ参照値がある場合は、同じ変更値が適用されます。
const a = { id: '1', count: 0};
const b = { id: '2', count: 0};
const c = b;
b.count = 1;
console.log(b,c);
//{ id: '2', count: 1}
//{ id: '2', count: 1}🏐 参照値が異なる場合は、同じように見える場合でも、異なる値として識別されます。
const list1 = [1, 2, 3];
const list2 = [1, 2, 3];
const result = list1 === list2;
console.log(result); // false🏐 同じ参照値がある場合は、同じ変更が適用されます。
const ref1 = {
num: 10,
};
const ref2 = ref1;
ref1.num = 20;
console.log(ref2); // 20ref 1のnum値を変更すると、ref 2の参照値ref 1のnumも
変更後の値は20で、適用範囲は同じです.
🏐 配列内のオブジェクト-浅いコピー(展開オペレータ)
const arr = [
{id: '1', count: 0},
{id: '2', count: 0},
];
const arr2 = arr;
const arr3 = [...arr];作成されたオブジェクトは3つあります.
2個の
arr 2はarrと同じ参照値を有する.
arr 3はSpread Operatorを使用して浅いレプリケーションを行うため、新しい配列が作成され、新しい参照値が割り当てられます.
ただし、配列内のオブジェクトは同じ参照値をコピーします.
したがって、オブジェクトが変更されると、arr、arr 2、arr 3に変更が表示されます.
しかしarr 2とは異なりarr 3ではアレイに新しいオブジェクトが追加されてもそれらは見えない.配列オブジェクトの参照値が異なるためです.
Reference
この問題について(Premitive&Reference(元の値と参照値)), 我々は、より多くの情報をここで見つけました https://velog.io/@gygy/Premitive-Reference-원시값과-참조값テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol