Javascript 本地损坏的Java脚本

"use strict";

const rows = 40;
const cols = 40;

let currGen = [rows];
let nextGen = [rows];



function createGenArrays() {
    for (let i = 0; i < rows; i++) {
        currGen[i] = new Array(cols);
        nextGen[i] = new Array(cols);
    }
}



function initGenArrays() {
    for (let i = 0; i < rows; i++) {
        for (let j = 0; j < cols; j++) {
            currGen[i][j] = 0;
            nextGen[i][j] = 0;
        }
    }
}



function createWorld() {
    let world = document.querySelector('#world');
    let table = document.createElement('table');
    table.setAttribute('id', 'worldgrid');
    for (let i = 0; i < rows; i++) {
        let tr = document.createElement('tr');
        for (let j = 0; j < cols; j++) {
            let cell = document.createElement('td');
            cell.setAttribute('id', i + '_' + j);
            cell.setAttribute('class', 'dead');
            cell.addEventListener('click', cellClick);
            tr.appendChild(cell);
        }
        table.appendChild(tr);
    }
    world.appendChild(table)
}



function cellClick() {
    let loc = this.id.split('_');
    let row = Number(loc[0]); // Get i
    let col = Number(loc[1]); // Get j

    if (this.className === 'alive') { // Toggle cell state
        this.setAttribute('class', 'dead');
        currGen[row][col] = 0;
    }
    else {
        this.setAttribute('class', 'alive');
        currGen[row][col] = 1;
    }
}



function createNextGen() {
    for (row in currGen) {
        for (col in currGen[row]) { // Check `rules.md`
            let neighbors = getNeighborCount(row, col);

            if (currGen[row][col] == 1) { // If alive
                if (neighbors < 2) nextGen[row][col] = 0;
                else if (neighbors == 2 || neighbors == 3) nextGen[row][col] = 1;
                else if (neighbors > 3) nextGen[row][col] = 0;
            }
            else if (currGen[row][col] == 0) { // If dead
                if (neighbors == 3) {
                    nextGen[row][col] = 1; // you spin me right round baby right round
                } // like a record baby right round round round baby this is propogation
            }
        }
    }
}



function updateCurrGen() {
    for (row in currGen) {
        for (col in currGen[row]) { // left shift
            currGen[row][col] = nextGen[row][col];
            nextGen[row][col] = 0;
        }
    }
}



function updateWorld() {
    let cell = '';
    for (row in currGen) {
        for (col in currGen[row]) {
            cell = document.getElementById(row + '_' + col);
            if (currGen[row][col] == 0) cell.setAttribute('class', 'dead');
            else cell.setAttribute('class', 'alive');
        }
    }
}



function evolve() {
    createNextGen();
    updateCurrGen();
    updateWorld();
}



function getNeighborCount(row, col) {
    let count = 0;
    let nrow = Number(row);
    let ncol = Number(col);

    if (nrow - 1 >= 0) { // Make sure we aren't at first row
        if (currGen[nrow - 1][ncol] == 1) count++; // Check north neighbor
    }

    if (nrow - 1 >= 0 && ncol - 1 >= 0) { // Make sure we aren't at first row or col
        if (currGen[nrow - 1][ncol - 1] == 1) count++; // Check northwest neighbor
    }

    if (nrow - 1 >= 0 && ncol + 1 < cols) { // Make sure we aren't at first row or last col
        if (currGen[nrow - 1][ncol + 1] == 1) count++; // Check northeast neighbor
    }

    if (ncol - 1 >= 0) { // Make sure we aren't at first col
        if (currGen[nrow][ncol - 1] == 1) count++; // Check west neighbor
    }

    if (ncol + 1 < cols) { // Make sure we aren't at last col
        if (currGen[nrow][ncol + 1] == 1) count++; // Check east neighbor
    }

    if (nrow + 1 < rows && ncol - 1 >= 0) { // Make sure we aren't at last row or first col
        if (currGen[nrow + 1][ncol - 1] == 1) count++; // Check southwest neighbor
    }

    if (nrow + 1 < rows && ncol + 1 < cols) { // Make sure we aren't at last row or col
        if (currGen[nrow + 1][ncol + 1] == 1) count++; // Check southeast neighbor
    }

    if (nrow + 1 < rows) { // Make sure we aren't at last row
        if (currGen[nrow + 1][ncol] == 1) count++; // Check south neighbor
    }

    return count;
}



window.onload = () => {
    createWorld(); // Visual table
    createGenArrays(); // Current and next gens
    initGenArrays(); // Initialize all to dead
    //window.alert('success');
}

#world {
    padding-bottom: 10px;
}

table {
    background-color: whitesmoke;
}

td {
    border: 1px solid darkgray;
    width: 10px;
    height: 10px;
}
td.dead {
    background-color: transparent;
}
td.alive {
    background-color: blue;
}

<!DOCTYPE html>

<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Game Of Life</title>
        <!--<link rel="stylesheet" type="text/css" href="style.css" /> commented out for sharing on SO -->
    </head>
    <body>
        <div id="world"></div>
        <div>
            <input type="button" value="Evolve" onclick="evolve()".>
        </div>
        <!--<script src="script.js"></script>-->
    </body>
</html>