javascript - 未捕获的类型错误：无法在绘图时读取未定义的属性“显示”（sketch.js：49）

Question

我在函数 Spot() 中指定了函数 show()，但我仍然收到 Uncaught TypeError 的这个错误，并且它在 draw() 处说它未定义。

这是 Javascript 代码，我使用 p5.js 作为库。

var cols = 5;
rows = 5;
var grid = new Array(cols);

var w,h;

function Spot(i,j){
    this.x = i;
    this.y = j;
    this.f = 0;
    this.g = 0;
    this.h = 0;

    this.show = function(){
        fill(255);
        stroke(0);
        rect(this.x*w,this.y*h,w-1,h-1);
    }  
}

function setup(){
    createCanvas(400,400);
    console.log('A*');

    w = width/cols;
    h = height/rows;

    for(var i = 0; i < cols;i++){
        grid[i] = new Array(rows);
    }

    console.log(grid);
    
    for(var i = 0; i < cols;i++)
    {
        for(var j = 0; i < rows;i++)
        {
            grid[i][j] = new Spot(i,j);
        }
    }
}
function draw(){
    background(0);
    
    for(var i = 0; i < cols-1;i++)
    {
        for(var j = 0; j < rows-1; j++)
        {
            grid[i][j].show();
        }
    }
}

    body {
      padding: 0;
      margin: 0;
    }

<script src="https://cdnjs.cloudflare.com/ajax/libs/sketch.js/1.1/sketch.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.1.9/p5.min.js"></script>

我在 chrome 控制台中收到此错误，我在本地 pc 上将 html 作为 Web 服务器运行。(localhost:8000)

这是 google chrome 控制台中错误的附加图片

我刚刚开始使用 java 脚本，尽管对其进行了广泛的搜索，但仍无法解决此错误。

如果有人知道这将是有帮助的。提前致谢

Answer 1

看看你的设置循环。

在嵌套循环中，您正在增加i值，而不是j值。

setup并且您还计算了和中不同的行/列索引draw。这可能是你想要的，只是想我会指出来。

（rows/cols-1对cols/rows）

var cols = 5;
var rows = 5;
var grid = new Array(cols);

var w,h;

function Spot(i,j){
    this.x = i;
    this.y = j;
    this.f = 0;
    this.g = 0;
    this.h = 0;

    this.show = function(){
        fill(255);
        stroke(0);
        rect(this.x*w,this.y*h,w-1,h-1);
    }
}

function setup(){
    createCanvas(400,400);
    console.log('A*');

    w = width/cols;
    h = height/rows;

    for(var i = 0; i < cols;i++){
        grid[i] = new Array(rows);
    }

    console.log('grid: ', grid);
    
    for(var i = 0; i < cols-1;i++)
    {
        for(var j = 0; j < rows-1;j++)
        {
            grid[i][j] = new Spot(i,j);
        }
    }
}
function draw(){
    background(0);
    
    for(var i = 0; i < cols-1;i++)
    {
        for(var j = 0; j < rows-1; j++)
        {
            grid[i][j].show();
        }
    }
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/sketch.js/1.1/sketch.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.1.9/p5.min.js"></script>