Как использовать windowWidth и windowHeight за пределами настройки ()?

Question

Я пытаюсь сделать лазер, от которого игрок должен уклоняться, выбрать случайный y, пройти вперед до конца экрана, а затем выбрать новый случайный y и начать все сначала. Мне нужны размеры экрана, так как это меняет длину осей X и Y. Я пробовал windowWidth и windowHeight, но я получаю сообщение о том, что я не могу использовать их вне setup (). Я также попытался определить windowWidth и Height для новой константы, но она просто говорит, что константа не была определена.

Вот текущее состояние моего кода (не работает, но дает довольно хорошее представление окод):

function setup() {
    createCanvas(windowWidth, windowHeight);
}

var x = 0;
var y = 0;
var speed = 5;
var laserSpeed = 10;
var laserY = 0;
var laserX = Xwidth;

function draw() {
    background(230);
    //changing x and y var according to keys pressed
    if(keyIsPressed) { 
        if (key.toString() === "a") {
           x -= speed;
        } 
        if (key.toString() === "w") {
            y -= speed;
        } 
        if (key.toString() === "d") {
            x += speed;
        } 
        if (key.toString() === "s") {
            y += speed;
        }
    }
    if(laserX >= width) {
        laserY = random(0, height);
    } 
    else {
        laserX += laserSpeed;
    }

    rect(laserX, laserY, 100, 20);

    //player
    rect(x, y, 20, 20);
}

Answer 1

Если вы используете глобальные переменные, такие как WIDTH и HEIGHT, это позволит вам использовать их в любом месте кода.

let WIDTH;
let HEIGHT;

function setup() { 
  WIDTH = windowWidth;
  HEIGHT = windowHeight;
  createCanvas(WIDTH, HEIGHT);
}

Answer 2

Я не знаю, как это сделать при обработке, но, как сказал @ Питер Пол Кифер , вы обычно можете использовать переменные width и 'height, и еще одно решение было бы сделать

let canvas = document.getElementById('myP5Canvas');

draw(){
 ...
 let cWidth = canvas.width;
 let cHeight = canvas.height;
 ...
}