More than 1 year has passed since last update.

mutable immutableとはなんぞや

Posted at 2022-12-20

補足

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

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

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

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

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

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は同じメモリブロックを参照しているので値は同じ