最強木修

最近在學習中遇到一些問題，就順手記錄下來。

說到這里，我們先來看看存在的“問題”。

這是一個非常經典的例子，頁面上呈現了三個。當我單擊時，頁面被重新呈現為。

這個時候，當我點擊按鈕時，因為計時器的原因，不會立即完成。此時，我正在單擊修改。

兩秒鐘后，您將發現頁面上顯示的最新值，并且彈出窗口保持不變。

讓我們先給出這個簡單代碼的結論:

演示函數每次運行的時候，我們稱之為每次渲染，每個渲染函數都有自己獨立的和。當調用代碼進行渲染時，每個渲染將在其自己的渲染范圍內獲得總和。

當然，這不是人類。我們繼續吧。

本質上，這里實現響應的原理是完全不同的。我們都知道它是在。當響應值被修改時，會觸發相應的trap函數，從而觸發更新操作，更新集合對應的模板。

這里只是渲染函數中定義的一個數字。沒什么，...它只是代表一個數字。

當我們第一次調用一個函數時，我們給它一個初始值。當我們點擊按鈕調用時，我們將再次渲染組件(運行演示函數)。此時，新函數的內部值為，然后用內部值再次調用函數進行頁面渲染。以此類推，就像下面的代碼一樣:

每次我們更新狀態時，(修改值)。該組件將被重新渲染，每次渲染可以獲得一個獨立的狀態。這個狀態值獨立于每個渲染函數中的一個常數，它的作用只是渲染輸出并在其中插入數字。

你可能想知道每次我們調用函數時，它的值是從哪里來的。當我們調用來修改其值時，新值由提供。會用新的值重新運行函數來再次渲染，以保證渲染和輸出是一致的。

這里有一個關鍵點。任何渲染周期(函數調用)的值(直觀的說是值)都不會隨時間變化，因為每次調用渲染函數中的值都是常數(在各自渲染函數的范圍內)。

渲染輸出發生變化是因為組件函數被反復調用，而每次調用導致的渲染函數中包含的值在函數內是相互獨立的。

這就是為什么我們在書中得到的仍然是最新的。由于封閉性，當我們點擊時，我們得到當前渲染函數的內部值。記住每個渲染的和是相互獨立的(因為是各自函數范圍內的變量)，每個獨立渲染函數的和是常數。

每一個改變都導致功能組件被重新執行，從而每一個渲染功能都是獨立且固定的。

這里注意固定和獨立的關鍵詞。Fixed表示當函數開始執行時，這個時間的值已經確定。(特別注意上面的訪問是固定的，是由于封閉而確定的)。獨立是指函數每次運行都在自己獨立的范圍內。

上面我們談到了和聲在不同渲染中的獨立性，這就引出了我們的主角。日常生活中主要有兩個作用。下面說說剛才遇到的問題，以及如何利用它們來解決。

我們之前學過，每個渲染都是相互獨立的，所以很自然的我們就想到了如何在每個渲染之間產生一種關系。這時，他顯示了他的作用。

讓我們來看看返回值類型的定義:

可以看出，返回值是一個包含屬性類型作為范例的值。

它和直接在中定義一個的區別在于。

將維護對所有返回值的唯一引用。因為pairs的所有賦值和值都得到最終狀態，所以不會因為條件不同而產生不同的隔離。

簡單來說，你可以把的返回值想象成一個全局變量。

讓我們重新編寫這個演示，看看:

按照前面的步驟，此時我們可以看到彈出的值是最新的值。而不是范圍隔離的值。

當然，需要注意的是，修改返回值不會導致執行函數重新呈現。demo中的頁面渲染不是因為修改了值，而是因為我們同時修改了中的，造成了頁面渲染。

更改的值不會導致頁面重新呈現，這可以做很多事情。例如，您可以查詢頁面是首次呈現還是更新。

綜上所述，返回值的改變不會引起頁面更新。而且，類似于中的全局變量，不同程度上沒有作用域隔離機制。這是和這兩個的主要區別。從...獲取DOM

當然，與在以下位置獲取DOM節點相比，這也是一種常見的用法:

接下來，您只需要傳遞來獲取節點。從...獲取DOM

說到上面，你已經可以知道了，沒錯，還有一個用途就是通過它來獲取頁面上的元素。

通過創建變量()保存。通過將屬性添加到。頁面掛載后，可以通過傳遞獲得相應節點的真實DOM元素。

對于上面的演示，我們可以總結出一些特點。

我們可以把返回值看作一個組件中的全局共享變量，它將在呈現中共享相同的值。它們在不同程度上相對獨立于內部范圍值。

同時需要額外注意的是，返回值的改變不會導致組件被重新創建，這一點也不同于。

當然，當我們想要得到相應的實元素時，這樣做也可以得到相應的元素。