在 JavaScript 中访问不带此关键字的类属性-解网

问：

我在使用 JavaScript 类时遇到了令人困惑的情况。我的类属性被分配给构造函数中的特定 DOM 元素，似乎可以在类方法中访问，而无需使用 this 关键字。这让我感到困惑，因为我认为这是访问类属性所必需的。

下面是上下文类：

class Reminder {
    constructor() {
        this.inputField = document.querySelector('#inputField');
        this.itemList = document.querySelector('#itemList');
        this.msg = document.querySelector('#msg');
        // Other properties...
    }

    loadReminders() {
        // Some code...
        itemList.appendChild(li);
        // Some more code...
    }

    addReminder() {
        if (inputField.value === '') {
            msg.classList.add('error');
            msg.textContent = "No input received";
            msg.style.display = 'block';
            setTimeout(() => msg.style.display = 'none', 1000);
            return false;
        }

        // Other code...
        itemList.appendChild(li);
        inputField.value = '';
        // Rest of the code...
    }

    // Other methods...
}

在 loadReminders 和 addReminder 方法中，我能够直接引用 inputField、msg 和 itemList，而无需对此关键字进行任何限定，并且没有错误。

更有趣的是，这些属性不会在脚本中的其他任何位置全局声明。JavaScript 中是否存在我不知道导致此行为的隐式绑定或范围规则？

深入了解为什么这些类属性可以在没有 this 关键字的情况下访问，我们将不胜感激！

编辑：我在这里添加了完整的代码：https://jsfiddle.net/yashcrest/mzj68edg/2/

JavaScript 类 this

仅使用这么多代码无法重现该问题。据我所知，以这种方式访问类属性是不可能的，但猜测不会带我们去任何地方;您可以将所有代码发布到基于云的代码共享平台，例如 StackBlitz 或 CodeSandbox，并在必要时添加指向您的问题的链接。

0赞 Yashcrest 6/10/2023

嗨，我在这里添加了代码：jsfiddle.net/yashcrest/mzj68edg/1

答：

0赞 Luke Vo 6/11/2023 #1

不是由您的类设置的。它由 HTML 属性设置。你可以通过从构造函数中注释掉这一行来尝试它，你仍然可以访问：inputFieldidaddReminderinputField

//this.inputField = document.querySelector('#inputField');

该属性在全局范围内为我设置了一个变量。我找不到有关此行为的任何文档，因此有人可能会对此进行补充：id

console.log(myinput);
myinput.value = "Hello"
console.log(myinput.value);

<input id="myinput" />

更新：我在这里找到了它，它指的是这里的规格：对 Window 对象的命名访问

上一个：这在对象内部的模板文字中

下一个：无法为字符串原型定义赋值为“this”

在 JavaScript 中访问不带此关键字的类属性

Accessing Class Properties without this Keyword in JavaScript

评论