javascript - 我不能引用 const 因为 "is not defined"但它是

标签 javascript

我想在浏览器控制台中引用 const game,但它大声说 game 未定义,但确实如此。我也不能引用我声明的任何 const。

我尝试使用 let 甚至 var 但问题仍然存在。这是我在 index.html

中声明的 online.js 文件
<!DOCTYPE html>
<html lang="pl">
<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>Multiply</title>
    <link rel="stylesheet" href="style.css">
    <link rel="manifest" href="manifest.json">
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
</head>
<body>
    <div id="ver">version</div>
    <div class="wraper">
            <div class="submit">
                    <button type="submit" id="level">hard</button>
            </div>
        <div class="numbers" id="numbers">div</div>

        <div class="answer">
                <input type="tel" id="answer">
        </div>

        <div class="submit">
            <button type="submit" id="submit">Sprawdź!</button>
        </div>
    </div>

    <!-- <script src="main.js"></script> -->
    <script type="module" src="online.js"></script>
</body>
</html>
import Game from '/Game.js';

const numbers = document.getElementById("numbers");
const answer = document.getElementById("answer");
const button = document.getElementById("submit");
const level = document.getElementById("level");
const ver = document.getElementById("ver");

const game = new Game();

window.addEventListener('load', () => {
    game.pair.flag = true;
    numbers.innerText = game.writeNumbers();
    answer.focus();
})

button.addEventListener('click', () => {
    game.checkAnswer(answer.value);
    console.log(game.numbers);

    numbers.innerText = game.writeNumbers();
})

那么为什么 .addEventListener 可以引用那个 const 但我不能?

最佳答案

默认情况下,在模块顶层声明的变量不会隐式分配给全局对象。 (这可以说是一件好事 - 范围控制有助于保持代码的可维护性。)如果你想在模块内创建可从控制台引用的全局变量,你必须明确地这样做:

window.game = new Game();

(但你应该只出于调试目的这样做,可能 - 一旦脚本按预期工作,最好再次将 game 范围限定到模块,并使用 const< 声明它)

关于javascript - 我不能引用 const 因为 "is not defined"但它是,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58499734/

相关文章:

javascript - QML Javascript "console.log"与 UTF-8

javascript - 如何使用 jQuery 制作下拉菜单

javascript - 多个可观察对象多次触发的问题

javascript - Node.js:读取 URL 中传递的参数

javascript - AngularJS 函数 - $Scope

javascript - 在 RegExp 搜索中有效地找到匹配的组

javascript - 使用 AngularJS 进行多服务 http 调用

php - 帮助解决奇怪的 PHP javascript/hidden iframe hack

javascript - Cordova:尝试添加 Android 平台时出现 EACCES 错误。更改 PATH 并不能解决问题

javascript - 将 Chrome 应用程序移植到 UWP : How to handle "background page"?