如何使用函数来改变另一个函数的属性?

时间:2017-04-06 05:15:10

标签: javascript html5-canvas

我对JS很新,并且经历过在线课程,但是,非常令人沮丧的是,我似乎很难独自一人,所以如果这个问题有明显的答案,我很抱歉。基本上,这个程序会在一个盒子里弹出一个彩色的球。我希望每次撞到墙壁时都会改变颜色。我找到了一种方法,通过将所有信息放在一个函数下,但我使用的教程是说(为了整洁的代码目的)2个函数会更好,所以我真的只想了解如何做什么我希望在有不同功能的信息时这样做,因为我知道我将来必须这样做。我将评论重要的代码行。非常感谢能够提供帮助的任何人。

#include<iostream>
#include<iomanip>
using namespace std;

#include "StringList.h"

int main()
{
    //testing StringList
    StringList slist;

    string movie1 = "Star Wars";
    string movie2 = "Fargo";
    string movie3 = "Back to the Future";
    string movie4 = "Titanic";

    // Testing add/display/count
    cout << "Testing add/display/count: " << endl;
    cout << "count is: " << slist.count() << endl;

    slist.add(movie1);
    slist.display();
    cout << "count is: " << slist.count() << endl;

    slist.add(movie2);
    slist.display();
    cout << "count is: " << slist.count() << endl;

    slist.add(movie3);
    slist.add(movie4);
    slist.display();
    cout << "count is: " << slist.count() << endl;

    // Testing remove
    cout << endl;
    cout << "Testing remove: " << endl;
    bool delResult;
    delResult = slist.remove(movie4);
    cout << "remove result movie4 = " << boolalpha << delResult << endl;

    delResult = slist.remove(movie3);
    cout << "remove result movie3 = " << boolalpha << delResult << endl;

    delResult = slist.remove("Not There");
    cout << "remove result Not There = " << boolalpha << delResult << endl;

   cout << "display after remove: " << endl;
   slist.display();
   cout << "count is: " << slist.count() << endl;

   //Testing minimum
    cout << endl;
    cout << "Testing minimum: " << endl;

    cout << "Test minimum 1: " << endl;
    slist.display();
    cout << "minimum: " << boolalpha << slist.minimum() << endl;

    cout << "Test minimum 2: " << endl;
    slist.add(movie4);
    slist.display();
    cout << "minimum: " << boolalpha << slist.minimum() << endl;

    cout << "Test minimum 3: " << endl;
    slist.add(movie3);
    slist.display();
    cout << "minimum: " << boolalpha << slist.minimum() << endl;

    //Testing sort and display

    cout << endl;
    cout << "Testing sort/display: " << endl;
    slist.sort();
    slist.display();

    cout << endl;
    cout << "Testing sort/display after add: " << endl;
    slist.add("Jurassic Park");
    slist.display();
    cout << "now sorted: " << endl;
    slist.sort();
    slist.display();


}

2 个答案:

答案 0 :(得分:3)

您可以做的是传递将改变该功能行为的参数 在这种情况下,你将传递你想要的颜色。

var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");

var x = canvas.width/2;
var y = canvas.height-30;

var dx = 4;
var dy = -4;

var ballRadius = 30;

function drawBall(color) {                         // draws the ball
    ctx.beginPath();
    ctx.arc(x, y, ballRadius, 0, Math.PI*2);
    ctx.fillStyle = color;
    ctx.fill();
    ctx.closePath();
}

function draw() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    drawBall();
    x += dx;
    y += dy;
    if(x + dx > canvas.width-ballRadius || x + dx < ballRadius) {    // says when to bounce
        dx = -dx;
        drawBall("#ff0000");    
    }                                          
    if(y + dy > canvas.height-ballRadius || y + dy < ballRadius) {
        dy = -dy;
        drawBall("#0095DD");
    }
}

答案 1 :(得分:1)

似乎你混合了JavaScript的一些概念。因此,出于可读性和设计的原因,我会创建一个&#39;类&#39;为了球。像这样:

function Ball(x, y, radius, color) {
     this.x = x;
     this.y = y;
     this.radius = radius;
     this.color = color;
}

您可以使用以下方法创建球的实例:

var ball = new Ball(x, y, radius, color);

并以Java风格访问属性:

ball.color = "#0095DD";

您还可以为球添加一些方法:

function Ball(x, y, radius, color) {
     this.x = x;
     this.y = y;
     this.radius = radius;
     this.color = color;

     this.draw = function(ctx) {
              ctx.beginPath();
              ctx.arc(this.x, this.y, this.radius, 0, Math.PI*2);
              ctx.fillStyle = this.color;
              ctx.fill();
              ctx.closePath();
     }
}

您可以使用此类和代码扩展代码。我想,你明白了。