mutable immutableとはなんぞや

補足

内容が間違っていれば教えていただけると嬉しいです(書き直しました)🙇‍♂️

immutable とは

オブジェクトが生成された後は状態を変更できないオブジェクト
文字列や数値が当てはまる

var str = 'string'
str = str + 'string'

1行目のstrと2行目のstrは指しているメモリブロックが違う
2行目のstrが1行目のstrのメモリブロックを指すことはできない(=状態を変更できない?)

mutable とは

オベジェクトが生成された後に状態を変更することができるオブジェクト
配列やオブジェクトが当てはまる

var array = [8, 8, 8]
var array_copy = array
array_copy.push(0)
// array -> [8, 8, 8, 0]
// array_copy -> [8, 8, 8, 0]

arrayとarray_copyは同じメモリブロックを指している(=状態を変更できる?)
arrayに破壊的なメソッド(pushなど)を実行するとarray_copyも変わってしまう

array(array_copy)だけを変更したいときは新しい配列をスプレッド構文やconcatを使って生成する

余談

var foo = [8, 8, 8]
var bar = foo.push(0)
console.log(Object.is(foo, bar)) // true

ReactのuseStateがObject.isを利用して変更を検出しているため、
上記(push)のように配列を変えると再描画が走らない
→fooとbarは同じメモリブロックを参照しているので値は同じ

参考文献