ReactのStateの更新について

実現したいこと

TypeScript & Reactでstateの値を更新する。

前提

お世話になっております。現在Typescript勉強中です。

以下のinputを更新した際にstateの値を更新する処理を実装したいと考えています。
実装したコードでわからない点があったのでご教授いただけないでしょうか？

発生している問題・エラーメッセージ

このコードで// XXXの記載がある処理がよくわかりません。
testStateの値を更新する場合、setTestStateを呼び出す必要があると認識していましたが、直接testStateに値を代入しても意図通りの挙動になっているように思います。なぜ意図通りの動きをするのか教えていただけないでしょうか？

該当のソースコード

typescript
1function Test () {
2  let [testState, setTestState] = useState([
3    {
4      name: "test1"
5    },
6    {
7      name: "test2",
8    }
9  ]);
10
11  return (
12    <div>
13      <input 
14        type="text"
15        defaultValue={testState[0].name}
16        id='input0'
17        onChange={(event) => {
18          // setTestStateを呼び出して値を更新
19          let tmp = testState;
20          tmp[0].name = event.target.value;
21          setTestState(tmp)
22        }}
23      />
24      <input 
25        type="text"
26        defaultValue={testState[1].name}
27        id='input1'
28        onChange={(event) => {
29          // XXX: setTestStateを呼ばなくても値の更新ができる？？？
30          testState[1].name = event.target.value
31        }}
32      />
33      <input type='button' onClick={() => {
34        console.log(testState)
35      }} value="testbutton" />
36    </div>
37  )
38}