相互调用自定义函数(p5)

时间:2017-12-03 19:51:01

标签: javascript function constructor p5.js

在我的文件中,我目前正在尝试使用函数start()打开文件,而在mousePressed上,我希望函数helpless()能够运行(类似于阅读在线漫画,点击我想要一个" page"导致下一个)。最后,我将构建更多页面来为我的编码类讲述一个有凝聚力的故事,但是我很难让它正常工作以开始。是否可以将函数作为数组的一部分调用?或者我会这样做,因为我目前正在尝试使用if语句?

此外,我正在无助地运行构造函数,当我尝试运行start()时会干扰,而且我不确定为什么会发生这种情况。

jsfiddle链接:https://jsfiddle.net/afo7vzwg/

var superFont;
var drops = [];
var count = 0;

function preload(){
    superFont = loadFont("VollkornSC-Regular.ttf")
}

function setup() {
    createCanvas(windowWidth, windowHeight);
    textFont(superFont);
    for(var i = 0; i < 500; i++){
       drops[i] = new Rain();
   }
}

function draw(){
    background(0);
    start();
}

function start() {
    background(246, 253, 71);

    fill(0);
    noStroke();
    rectMode(CENTER);
    rect(width/2,height/2,250,400,80,80,40,40);
    ellipse(width/2,(height/2)+400,width,800);
    textSize(40);
    textAlign(CENTER);
    text("For a time, I always looked down upon myself, and always felt like I wasn’t doing enough.",width/2,100,800,200);

    fill(255);
    ellipse((width/2)-55,height/2,50,50);
    ellipse((width/2)+55,height/2,50,50);

    noStroke();
    fill(255); 
    rect(width/2,500,90,100,80,80,40,40);
    rect(width/2,600,100,150,40,40,40,40);
    rect(width/2,660,300,40,40,40,40,40);
    rect((width/2)-130,640,40,80,40,40,40,40);
    rect((width/2)+130,640,40,80,40,40,40,40);

}

function helpless(){
    background(255,100,80);
//      BIGMAN
    fill(0);
    noStroke();
    ellipse((width/2)-640,(height/2)+400,width,800);
        push();
        translate(-130,700);
        rotate(PI*-2.2);
        fill(0);
        ellipse((width/2)+150,100,700,150);
        pop();
    rect((width/2)-410,300,250,400,80,80,40,40);
    fill(255);
    ellipse((width/2)-450,300,50,50);
    ellipse((width/2)-330,300,50,50);
//    littleguy
    fill(0);
    ellipse((width/2)+350,(height/2)-40,40,40);
    ellipse((width/2)+375,(height/2)+20,30,30);
    ellipse((width/2)+325,(height/2)+20,30,30);
    rectMode(CENTER);
    rect((width/2)+350,height/2,40,60,40,40,40,40);
    rect((width/2)+360,(height/2)+40,20,60,40,40,40,40);
    rect((width/2)+340,(height/2)+40,20,60,40,40,40,40);
    rect((width/2)+335,(height/2)+65,30,20,40,40,40,40);
    rect((width/2)+365,(height/2)+65,30,20,40,40,40,40);
    fill(255);
    ellipse((width/2)+335,308,10,10);
    ellipse((width/2)+355,308,10,10);
//    ARMS

    fill(0);
    ellipse((width/2)+350,600,300,100);
  for (var i = 0; i < drops.length; i++){
      drops[i].move();
       drops[i].display();
    }
    fill(0);
    ellipse((width/2)+350,100,300,100);
    ellipse((width/2)-140,600,700,150);

    fill(255);
    textSize(30);
    textAlign(LEFT);
    text("I felt helpless, and trapped. As if everything I did was useless, futile, and pointless.",(width/2)-300,650,650,200);   
}
//    
//function Rain() {
//    this.x = random(((width/2)+350)-150,((width/2)+350)+150);
//    this.y = random(200,400);
//    this.display = function() {
//        noStroke();
//        fill(255);
//        rect(this.x,this.y,1,10);
//    }
//    this.move = function() {
//        this.y = this.y + random(-100,100);
//    }
//}
//
function mousePressed(){
    count++;
    if(count==1){helpless();}

    else(start();)
}

非常感谢任何和所有帮助!

1 个答案:

答案 0 :(得分:0)

请尝试发布MCVE而不是整个草图。您发布了大量与您的问题无直接关系的代码,这使您更难以帮助您。重新开始使用更简单的示例草图。

  

是否可以将函数作为数组的一部分调用?或者我会这样做,因为我目前正在尝试使用if语句?

两种方法都没问题。老实说,你应该选择对你最有意义的方法。但是要回答你的问题,是的,可以将函数存储在数组中。在JavaScript中,函数可以像任何其他值一样被引用,所以这样的东西可以工作:

function thingOne(){
  // do the thing
}

function thingTwo(){
  // do the other thing
}

var myFunctions = [thingOne, thingTwo];
var index = 0;

function draw(){
  myFunctions[index]();
}

但老实说,只使用if语句可能就是这样。保持代码简单易懂。

如果您有后续问题,请在新问题帖子中发布MCVE。祝你好运。