下圖是一個從0°到360°（或0~2π弧度）的所有值，從左到右是正弦函數所接收的角度值（以弧度為單位），y軸上是這些角度對應的正弦值。
由圖我們可以看到，從0°到360°，正弦值從0開始逐漸增長至1，隨後下降到0， 再下降到-1，最後增長到0， 如此不斷循環，其軌跡便是我們經常所說的正弦波。
物體的平滑上下運動效果如下圖：
思路：通過不斷增加角的度數 angle，可以模擬實現正弦值從0變到1，再變到-1，最後回到0的效果。
即假設一個物體位於座標原點（0, 0）處，通過不斷增加角angle的度數值，得到 y = Math.sin(angle) 的是從0 ~ 1 ~ 0 ~ (-1) ~ 0 如此不斷的一系列y值，將這些 y 值不斷更新到物體的y座標，x座標為0不變，則實現了物體不斷上下平滑運動的軌跡。
一、創建一個物體（笑臉）
首先我們需要用 canvas 繪製一個笑臉來模擬物體。
創建一個Smile類，實際上笑臉就是根據 Smile 類創建的新對象，即 我們模擬的物體，Smile類 代碼如下：
構建物體笑臉的構造函數對象（即其原型對象），定義了主要屬性包括：
半徑、顏色、座標、線寬等屬性。
然後通過prototype為大笑臉對象添加 draw() 屬性如下：
draw() 屬性主要用於繪製整個物體的圓臉、眼睛以及嘴巴。
到此，該笑臉Smile類便已完成！
二、上下波形動畫實現
思路：
1、不斷增加的角度值：angle；
2、角度變化的幅度值：speed；
3、正弦值變化範圍值：range
（為了使效果更加明顯）；
4、改變物體的 y 座標值：
smile.y =
centerY + Math.sin(angle) * range;
angle += speed;
如此一來，笑臉在座標 x 不變的情況下，座標 y 以屏幕中心點為中心進行著平滑的上下波動。
實現代碼如下：
本章小結
物體平滑的上下運動：
最終效果：
https://www.latehuiwan.com/dd_js/1_1_sxbd.html
閱讀更多 大宇JS 的文章
