javascript - 全局对象即使在函数中更新后也未定义
问题描述
作为 C++ 的用户,并且对 web-dev 完全陌生,我无法理解为什么全局变量“角度”没有在函数 setup() 中更新。因为,在我运行 console.log(angle[1].arc_colour) 的最后一行,它返回给我未定义。但是,如果我尝试在控制台中打印相同的命令,则会返回一个有限的数字。
(注意:setup() 是 p5.js 中的一个函数,每次执行时首先调用它)
//quick.js
var angle = new Array(200);
function Drawn_Arc(begin_angle, end_angle, arc_colour) {
this.begin_angle = begin_angle;
this.end_angle = end_angle;
this.arc_colour = arc_colour;
}
function swap(a, b) {
a = a + b;
b = a - b;
a = a - b;
}
function setup() {
createCanvas(windowWidth, windowHeight);
background(230);
noStroke();
colorMode(HSL, 2000);
for (let i = 1; i <= 200; i++) {
angle[i - 1] = new Drawn_Arc(((i - 1) * PI) / 100, (i * PI) / 100, random(0, 2000));
fill(angle[i - 1].arc_colour, 2000, 1000);
arc(windowWidth / 2, windowHeight / 2, windowHeight - 12, windowHeight - 12, angle[i - 1].begin_angle, angle[i - 1].end_angle, PIE);
}
}
console.log(angle[1].arc_colour);
//---html---
<html style="margin : 0px; padding : 0px">
<head>
<meta charset="utf-8" />
<title>Quick Sort</title>
</head>
<body style="margin : 0px; padding : 0px">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.2/p5.js"></script>
<script type="text/javascript" src="quick.js"></script>
</body>
</html>
解决方案
[...] 全局变量 'angle' 在函数内部没有得到更新
setup()
。因为,在我运行的最后一行console.log(angle[1].arc_colour)
,它返回我未定义。
该行onsole.log(angle[1].arc_colour);
不在setup
函数中,但它在全局范围内的脚本末尾。
进入setupconsole.log(angle[1].arc_colour);
函数,以便在数组初始化后完成:
function setup() {
createCanvas(windowWidth, windowHeight);
background(230);
noStroke();
colorMode(HSL, 2000);
for (let i = 1; i <= 200; i++) {
angle[i - 1] = new Drawn_Arc(((i - 1) * PI) / 100, (i * PI) / 100, random(0, 2000));
fill(angle[i - 1].arc_colour, 2000, 1000);
arc(windowWidth / 2, windowHeight / 2, windowHeight - 12,
windowHeight - 12, angle[i - 1].begin_angle, angle[i - 1].end_angle, PIE);
}
console.log(angle[1].arc_colour);
}
// console.log(angle[1].arc_colour);
如果我想在其他函数中使用数组怎么办。我该怎么做?
当然,您也可以将数组记录在函数中:
function setup() {
createCanvas(windowWidth, windowHeight);
// ......
logarray();
}
function logarray()
{
console.log(angle[1].arc_colour);
}
推荐阅读
- .net - 如何恢复 wpf 对话框内容焦点?
- python - self.canvas.create_text 消失
- laravel - 如何在分页中发送两种类型的数据库表中的数据
- django - 使用 Traefik 反向代理来托管 WordPress 和 Django
- generics - 让函数接受 u16 和使用的简洁方法,包括不受约束的小正整数文字
- c++ - Raylib C++ Shapes Spawn on click
- javascript - 如果宽度大于屏幕尺寸,iOS/Android 上的高度也会改变(约束问题)
- c++ - 我不断收到 playsound 功能的此错误,我知道为什么
- c# - IronPDF 导致内存泄漏
- java - Java Lambda 将 Object[] 数组转换为 Object[] 数组的子集