filterableproducttable(橙色):包含整個例子
searchbar(藍色):接收所有使用者輸入
producttable(綠色):基於使用者輸入顯示與過濾資料集
productcategoryrow(青綠色):顯示每組資料歸類標題
productrow(紅色):顯示每一行資料
層次結構如下：
現在你已經有了層次結構，是時候要實現應該了，最簡單的方法就是用你的資料模型來做乙個版本然後渲染ui但不需要互動。最好就是把過程解偶開，只需要寫不需要想太多互動的東西。
建的時候，你將要想用props傳資料的方式來重用別的元件。props是一種資料由父傳子的方式。如果你熟悉state的概念，不要只用state來做靜態版本。因為它只用來做互動，即資料經常改變時用上。
你可以由上而下或者由下而上來做，即你可以從最高層filterableproducttable或者由最低層productrow開始。但通常，簡單專案一般是由上而下；大型專案，則由下而上更好，並要編寫測試。
最後，你將有乙個可以重用的元件庫來渲染資料模型。元件只有render()方法，因為它只是乙個靜態版本。最高層filterableproducttable將負責接收資料模型作為prop使用。如果你修改資料模型，再呼叫reactdom.render()就可以更新到ui。非常簡單就能看到你的ui更新了什麼和**做了修改，因為react是通過單向資料流或者叫單向資料繫結來同步資料與ui並且速度非常快。
思考我們例子中所有資料碎片. 我們有:
那讓我們看看哪個是可以用作state。簡單的對這些資料問3個問題。
它是從父用過props傳過來的嗎？如果是它很可以就不是state。
它是經常變化的嗎？如果不是，它不是state。
你可以通過其他的元件中的state或者props來計算到它嗎？如果是，它就不是state。
初始列的所有產品是通過props傳進來的，所以它不是state。搜尋輸入框文字內容和勾選框狀態非常似state，因為他們可以經常改並且不能從其他元件計算得到。最後，過濾後的產品列表不是state，因為它是可以通過搜尋輸入框文字內容和勾選框狀態結合初始列的所有產品計算出來的。
所以最後，我們的state是：
好，現在我們已經識別出應用的state集。下一步，我們需要識別哪些元件修改或者擁有這些state
記住：react是單向資料流結構。它可能不會馬上清晰是哪個元件擁有什麼state。這對新手來說經常是最有挑戰性的部分,因此要跟著這些步驟來弄清楚:
對於你的應用中的每乙個state:
讓我們用這策略來應該到我們的應用上吧:
好，那我們就這樣做吧。首先，為filterableproducttable增加乙個getinitialstate()方法，返回值是來反映應用的初始狀態。然後，把filtertext和instockonly作為props傳給producttable和searchbar。最後用這些props來過濾producttable的行和設定producttable中表單的值。
你可以開始看到你的應該將如何表現：設定filtertext為"ball"並重新整理頁面。你應該可以看到資料表已經正確更新。
如果你嘗試去在這版本上輸入或者打勾 ，你將看到react會忽略你的輸入。這是有意為之，因為我們已經設了輸入框的 prop值總是等於filterableproducttable傳過來的state值。
react使得資料流 準確地容易的明白你的程式如何工作，但比傳統的雙向資料繫結需要寫得更多一點 **。react提供乙個叫reactlink的外掛程式讓這模式使用起來與雙向資料繫結一樣式 方便，但這文章的目的，是要保持所有東西都清晰。
如果你嘗試去在這版本上輸入或者打勾 ，你將看到react會忽略你的輸入。這是有意為之，因為我們已經設了輸入框的 prop值總是等於filterableproducttable傳過來的state值。
讓我們想想我們要些什麼。我們想要確保無論何時使用者改變了表單，我們 就更新state值去反映使用者輸入。既然元件應該只更新他們自己的state，那麼無論 何時state應該更新時，filterableproducttable將傳乙個**函式給searchbar並觸發它。我們可以用輸入框的onchange事件去接收它。然後filterableproducttable傳來的**函式將執行setstate()函式，之後我們的應 用將被更新。
雖然這樣聽起來比較複雜，但也就那麼幾行**。你的資料如何在應用中流轉將會很清晰 。
runjs原始碼：
引用自：
折半查詢思想及實戰程式設計
1.折半查詢要求是陣列是有序為前提 如果不是有序的不能使用 2.提及查詢存在兩種情況，要麼資料存不存在要麼存在下標是多少 下面講解折半查詢的思想 首先定義乙個有序陣列 int array 10 1 10一共有10個資料，將這10個數進行編號，從0開始編號，即0 9 令left 0,right 9,m...
程式設計思想基礎學習（介面）
public class processor object process object input class upcase extends processor class downcase extends processor class splitter extends processor pu...
程式設計思想及範例 7 ,迭代問題
在這裡主要介紹其中的非線性方程求根問題，及其兩種常用的方法。設有非線性方程 代數方程或超越方程 若存在數字使得，則稱為方程的根。在數學中除了極少數的簡單方程的根可以通過解析式表達外，一般方程的根都無法用簡單表示式來表示，因此必須研究求根的近似值的方法。假設在區間連續，且。根據連續函式的性質知在內至少...