你已經學會了設計和使用變數的方式
現在我們要學習兩個特別的變數
mouseX 和 mouseY
這兩個變數不需要由你來創造
其實它們早就存在了
程式已經預先設定好這兩個變數的值
確保 mouseX 的值永遠是滑鼠位置的 x 值
mouseY 的值永遠是滑鼠位置的 y 值
這項功能可以依據使用者的滑鼠位置
輕鬆做出好玩的互動模式
來看看我在這裡畫的圓形
截至目前，我都將它的位置設定在 200, 200
如果我使用特殊的變數 mouseX 和 mouseY
就可以直接把這個圓形畫在 mouseX 和 mouseY
現在，如果我在畫面上移動滑鼠，你會發現
我的滑鼠在哪裡，圓形就被移動到那裡
圓形跟著我的滑鼠跑
真是太有趣了；你知道我在畫什麼嗎？哈
在你使用 mouseX 和 mouseY 之前，務必確認
這兩個變數是寫在 draw = funtion () 裡面
如果沒有的話會變成這樣
如果將這兩行程式碼移到 draw = function () 外面
看到了嗎？
現在這個指令只會被執行一遍
所以只畫了一次圓形
而且被畫在程式一開始
我的滑鼠位置
為什麼必須寫在 draw = function () 裡面
是因為這個函數指令
在程式執行的當下會被重複呼叫
我們希望一呼叫指令
就能擷取當下 mouseX 和 mouseY 的位置並畫出圓形
這樣來說好了，其實這和動畫很像
位置隨著時間改變，只是變動方式不同
現在我們可以做出各式各樣有趣的東西
如果我不把圓形畫在 mouseX 和 mouseY 上
而是讓 mouseX 不變，讓 mouseY 固定為 300
會怎麼樣呢？
圓形只會跟著我滑鼠位置的 x 值移動
不管滑鼠怎麼上下移動都會忽略 y 值
現在我繼續將值設定在 mouseX 和 mouseY
卻不要 background，把它變成註記
哇！快看，這就像是類似畫筆的有趣功能
真是太棒了
或者我們來交換一下這些變數
先把 background 叫回來
在這裡交換兩個變數 mouseX 和 mouseY
看看會有什麼結果
感覺真的非常怪
現在滑鼠完全往反方向走
不受我的控制
但也挺好玩的，你可以想像設計一個遊戲
使用顛倒的滑鼠控制
讓玩家嘗試畫畫或做其它事
mouseX 和 mouseY 到此結束
非常有趣，希望你喜歡！