原创 受控組件與非受控組件

文章目錄受控組件更新state的流程例子非受控組件例子 受控組件 所謂受控組件就是每當表單的狀態發生變化時,都會被寫入到組件的state中,這種組件就被稱爲受控組件。 在受控組件中,組件渲染出的狀態與它的value或checked

原创 React的事件系統

文章目錄合成事件的綁定方式合成事件的實現機制事件委託自動綁定在React中使用原生事件原生事件和合成事件的混用 React基於Virtual DOM實現了一個合成事件層,我們所定義的時間處理器會接受到一個合成事件對象的實例,它完全

原创 數據結構--靜態查找表

文章目錄順序查找表----順序查找法性能有序查找表----折半查找法 靜態查找表:僅作查詢和檢索操作的查找表。 查找的方法取決於查找表的結構。 由於查找表中的數據元素之間不存在明顯的組織規律,因此不便於查找。 爲了提高查找的效率,

原创 數據結構--霍夫曼樹與霍夫曼編碼

文章目錄最優樹的定義如何構造最優樹(霍夫曼算法)霍夫曼編碼前綴編碼總結 最優樹的定義 節點的路徑長度定義爲:從根節點到該節點的路徑上分支的數目。 樹的路徑長度定義爲:樹中每個節點的路徑長度之和。 樹的帶權路徑長度定義爲:樹中所有葉

原创 Canvas—圖形畫刷

createPattern可以創建一個畫刷模式,進而可以設置到fillStyle裏,進行畫刷的填充。 函數原型:ctx.createPattern(image, type) type取值: ‘no-repeat’:不平鋪 ‘r

原创 Canvas—描邊與填充

文章目錄描邊strokestrokeStylestrokeRect填充fillfillRectfillStyle 描邊 stroke Canvas中常用的stroke方法就是描邊方法,它用以描繪輪廓。 const myCanvas

原创 Canvas陰影繪製

陰影的繪製主要依賴以下四個屬性: shadowOffsetX:陰影x方向的偏移距離 shadowOffsetY:陰影y方向的偏移距離 shadowColor:陰影的顏色 shadowBlur:陰影的模糊半徑 const can

原创 Canvas繪製曲線

文章目錄圓弧貝塞爾曲線 圓弧 圓弧使用arc方法繪製,畫圓的時候畫的弧度是從0到2π,而想要畫圓弧就調整參數只畫出部分圓即可。 const canvas = document.getElementById("canvas"); c

原创 Canvas—直線、矩形和圓

文章目錄直線矩形圓 直線 const myCanvas = document.getElementById('myCanvas'); const ctx = myCanvas.getContext('2d'); ctx.moveT

原创 Canvas--文字

文章目錄文字的繪製文字的對齊水平對齊垂直居中獲取文本寬度 文字的繪製 在Canvas中繪製文字,可以使用strokeText或fillText方法。從名字上可以看出,一個是用填充方法而另一個則是用描邊方法。 const myCan

原创 SVG文本

文章目錄字符、字形和字體EM框text元素文本的位置x="0" y="0"x="x1 x2 x4 x5... xn" y="x1 y2 y4 y5... yn"文本的偏移dx="dx" dy="dy"dx="x1 x2 x3...

原创 JavaScript性能—DOM編程

文章目錄瀏覽器中的DOMDOM的訪問與修改innerHTML與DOM方法HTML集合訪問集合元素時使用局部變量重繪與迴流迴流何時發生渲染樹的排隊和刷新最小化重繪和迴流批量修改DOM 瀏覽器中的DOM DOM,即文檔對象模型,是一個

原创 Canvas的寬與高

Canvas的默認寬高爲寬300px,高150px。 (因爲邊框的原因,寬高都多了2) 先畫一條簡單的線: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U

原创 數據結構--二叉樹的遍歷

文章目錄遍歷的概念搜索路徑遍歷算法(非遞歸)先序遍歷中序遍歷後序遍歷先序遍歷代碼描述遍歷算法(遞歸)中序遍歷先序遍歷由二叉樹的先序和中序序列建樹 遍歷的概念 順着某一條搜索路徑巡訪二叉樹中的結點,使得每個結點均被訪問一次,而且僅被

原创 數據結構--二叉樹的存儲結構

文章目錄順序存儲表示鏈式存儲表示二叉鏈表三叉鏈表 順序存儲表示 以存儲的數據是整型爲例。 // 二叉樹的最大節點數 # define MAX_TREE_SIZE 100 //0號單元存儲根節點 typedef int SqBiTr