loop
函式中的相關說明1、
requestanimationframe(loop);
讓函式每隔一段時間執行一次2、如何讓小球避免長蛇軌跡,並稍微有一點之前的運動軌跡?
可以在下一次小球出現的時候重繪畫布,讓他變為黑色,再給一點透明度,就可以顯示之前的一點運動軌跡了
<
!doctype html>
"en"
>
"utf-8"
>
"viewport" content=
"width=device-width, initial-scale=1.0"
>
"x-ua-compatible" content=
"ie=edge"
>
彈跳小球<
/title>
<
/head>
1、利用canvas畫布畫畫布 --
>
<
/canvas>
const canvas = document.
queryselector
('canvas');
const ctx = canvas.
getcontext
('2d');
const width = canvas.width = window.innerwidth;
const height = canvas.height = window.innerheight;
//讓小球動起來
const balls =
;//存放小球
//畫小球 小球顏色
//生成隨機數
function
random
(min, max)
//隨機顏色
function
randomcolor()
//小球屬性設定 建構函式
function
bbb(x, y, r, color, vx, vy)
bbb.prototype.
draw
=function()
;//小球運動軌跡 x,y,vx,vy
bbb.prototype.
run=
function()
if((this
.x -
this
.r)<=0)
if((this
.y +
this
.r)>= height)if(
(this
.y -
this
.r)<=0)
this
.x +=
this
.vx;
this
.y +=
this
.vy;};
//小球碰撞
bbb.prototype.
click
=function()
}}};
//迴圈動畫
function
loop()
;for
(let i =
0; i < balls.length; i++
)// console.log(balls)
requestanimationframe
(loop);}
loop()
;<
/script>
<
/body>
<
/html>
js建立物件(js小知識)
工廠模式function person name,age return o var p newperson viven 28 console.log p.constructor person false工廠模式最大的問題就是不能識別物件,可以用建構函式解決。建構函式建構函式的建立會經歷一下幾個步驟 ...
物件導向知識點小總結
what when where why whom,how 類與物件的關係 類是物件的抽象,物件是類的實現 類是由方法和屬性構成,它的每乙個物件都有對應的屬性和方法 方法 方法的過載 目的 針對同乙個行為的多種表現,對應相同方法名的多個方法 方法名相同,引數列表不同 類方法 static方法 類名.方...
物件導向的程式設計C 小知識點
1 類是將不同型別的資料和對這些資料的操作封裝在一起的集合體。2 類的型別,也僅僅 是一種資料型別。3 類是物件的抽象,物件是類的例項。4 類中的資料成員的型別可以是任意的。包括整型 浮點型 字元型 陣列 指標和引用。5 在類體中不允許對所定義的資料成員進行初始化。因為類的定義只是在建立乙個型別,而...