学べば学ぶほど基礎JavaScriptの重要性を感じます.そこで学習内容を整理するために、このシリーズを始めました.
全ての内容を知って整理すれば良いのですが、勉強や必要だと思うことを中心に整理していきます.

本文

JavaScriptのデータ型は大きく2つに分けられます.

元のタイプ:string、number、boolean、null、undefined、symbol

オブジェクトタイプ:Array、Object、Function

元の値とは?

元のタイプの値は変更できない値です.生成された元のタイプでは、値を読み取り専用に変更できません.

元の値が変数に割り当てられると、変数は実際の値を格納します.

可変値の意味

元の値を割り当てる変数は、元の値自体を値とします.
ここで変更できない値は、変数を再割り当てできないことを意味しません.
これは、メモリの値が変更されないことを意味します.
次のコードとメモリマップ

let number = 1;
number = 20;

numberという変数に1を割り当て,20を再割り当てした.

これは理解を助けるための絵です.
上記の図に示すように、格納1の元の値自体は変更されません.
20を新しいメモリ領域に保持し、numberに再割り当てします.
これは、上記の変更不可能な値を意味します.

参照値とは?

参照値は変更可能な値です.

参照値が変数に割り当てられると、その変数は参照値を格納します.

変更可能な値の意味

参照値を指定する変数は、格納されたオブジェクトのメモリ領域にアドレスを割り当てます.この値を参照値と呼びます.
例と画像を見てみましょう

var student ={
  name:'Heo'
}
student.name = 'lee'

上図に示すようにstudent変数は객체의 주소値を格納する.
また、再割り当てを必要とせずにオブジェクトに直接アクセスし、Propertyを動的に追加、更新、削除します.
これが変更可能な値の意味です.

値のコピー

元のタイプと参照タイプは、値をコピーするときにも大きく異なります.

値別転送(pass by value)

元のタイプの値がコピーされ、渡されます.これを値別転送と呼びます.
下図に示すように、copyにnumberが割り当てられ、値1がコピーされて渡されます.numberおよびcopyの値1は、異なるメモリ領域に格納される.

var number = 1;
var copy = number;

number === copy // true
number = 10;

number === copy //false

numberとcopyの値は同じですが、異なるメモリに割り当てられます.
したがって、numberの値を変更してもcopyには影響しません.

リファレンスによる転送(リファレンスによる)

参照タイプは、実際の値ではなく参照値を渡します.すなわち、参照値が格納されているメモリアドレスが渡される.

var number = {
  val:10
}
var copy = number;
number.val === copy.val // true

number.val = 20
number.val === copy.val //true

copyは、ゲストnumberを複製する.
2つの変数は、{val:10}オブジェクトを格納するメモリアドレスを共有する.
したがって、number.valを変更すると、copy.valの値も変化します.

var number1 = {val:1}
var number2 = {val:1}

number1 === number2 // false

上記の例number1とnumber2は同じ内容のオブジェクトであるが、比較演算するとfalseとなる.
参照タイプが非値の参照値(メモリアドレス)を持つため、2つの変数のメモリアドレスが異なるため、falseが生成される
reactの参照値と元の値が不明なため、reactを使用した経験があるので、以下に整理します.
リファレンス
モダンJavaScript Deep Dive
https://poiemaweb.com/js-object#5-pass-by-value
https://feel5ny.github.io/2017/11/29/JS_01/