canvas

###ES6建立類
關鍵字：class

構造函數：constructor
###ES6繼承
關鍵詞：extends

父類，超類：super
###HTML5內容
    HTML4：全部HTML的基礎
    XHTML：規範更嚴格，並無加新東西
    HTML5：最開始由WHATWG研發出來的，後來由W3C收購而且加入了一些新東西
    XML:可拓展標記源，存儲數據（W3C）規範很是嚴格

語義化是HTML5裏面新增的特性   
    兩大特色：
        利於SEO（搜索引擎）
        方便於屏幕閱讀器解析

###canvas
屬性，方法
    .canvas：畫板
    畫板.getContext('2d'):畫筆
    畫筆.fillStyle="":換畫筆的顏色
    畫筆.fill()：填充
    畫筆.stroke():邊框
    畫筆.lineWidth= ：加粗邊框
    畫筆.clearRect(, , , ,):清除畫布
    畫筆.translate():改畫布的圓心
    畫筆.save（）：保持狀態
    畫筆.restore（）：還原
    畫筆.beginPath():從新開始新的路徑
    畫筆.rotate（）：旋轉

畫矩形
    畫筆.fillRect(x,y,width,height):填充的矩形（實心）
    畫筆.strokeRect(x,y,width,height):邊框的矩形（空心）
    畫筆.strokeStyle ="":換空心矩形的邊框顏色
    畫筆.beginPath():開始路徑
    畫筆.rect(x,y,width,height):繪一個矩形路徑

畫圓
    畫筆.arc(x,y,r,sAngle,eAngle,counterclockwise)
    x:圓中心的x座標
    y:圓中心的y座標
    r:圓的半徑
    sAngle:起始角，以弧度計（弧的圓形的三點鐘位置是0 度）
    eAngle:結束角，以弧度計
    counterclockwise:可選；規定應該逆時針仍是順時針繪圖；false：順勢針，true：逆時針

畫三角
    畫筆.moveTo(x,y):移動
    畫筆.lineTo(x,y):線條走向
    畫筆.closePath（）：自動閉合