时间戳

首页 > 解决方案 > 为什么当我释放键时我的函数返回值？

javascript - 为什么当我释放键时我的函数返回值？

问题描述

我知道这可能是一个愚蠢的问题，但我无法弄清楚我在 p5.js 中的代码发生了什么（我使用在线编辑器）。

我正在制作一个简单的蛇游戏，但是当我调用该函数来添加某个值来移动头部（现在只是头部）时，它会返回我想要的值，但是当我释放键时它会再次执行，尽管我也调用了这个：

function keyReleased(){
    return false;
  }

这些是我在草图文件中调用的函数。

let w = 87;
let a = 65;
let s = 83;
let d = 68;
let stepToDo = 10;

function keyPressed(axis){
  if (axis === 0){
    if(keyCode === a){
      keyCode = 0;
      return -stepToDo;
    } else if(keyCode === d){
      keyCode = 0;
      return stepToDo;
    } else {
      return 0;
    }
  } else if (axis === 1) {
    if(keyCode === w){
      keyCode = 0;
      return -stepToDo;
    } else if(keyCode === s){
      keyCode = 0;
      return stepToDo;
    } else {
      return 0;
    }
  }
}

function keyReleased(){
    return false;
  }

这是草图文件。

let arrTest = [200, 200];


function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(220);

  arrTest[0] = arrTest[0] + keyPressed(0);
  arrTest[1] = arrTest[1] + keyPressed(1);
  keyReleased();
  //console.log(arrTest);

  rect (arrTest[0], arrTest[1], 10, 10);
}

链接到草图本身https://editor.p5js.org/antolab/sketches/_Lzz41cos

标签： javascriptfunctionscopekeyp5.js

解决方案

该keyPressed()函数是一个事件监听器。您不必从主draw()循环中调用它；相反，每次按下键时都会自动调用它。这样你就可以根据输入键使用它来改变你的位置数组。例如如下：

function keyPressed() {
  if (keyCode === a) {
    arrTest[0] = arrTest[0] - stepToDo;
  } else if (keyCode === d) {
    arrTest[0] = arrTest[0] + stepToDo;
  } else if (keyCode === w) {
    arrTest[1] = arrTest[1] - stepToDo;
  } else if (keyCode === s) {
    arrTest[1] = arrTest[1] + stepToDo;
  }
}

请注意，因为我们没有arrTest在函数中定义新变量，keyPressed()所以它将自动访问您在上面进一步定义的变量。 这是相应的修改草图。

keyPressed() 函数在您的代码中似乎被执行“两次”的原因是它作为循环的每次迭代的一部分被执行并且在按下一个键时自动执行。draw()

推荐阅读