对象上的作用域未按预期操作

Scope on Object not Behaving as Expected

本文关键字:操作 作用域 对象      更新时间:2023-09-26

我正在努力清除编码中长期存在的坏习惯:将小部件写入全局范围。

我在网页上为一个新闻卷制作了一个很大的、基本上是独立的脚本,在我把整个脚本塞进一个函数后,我对它的效果感到惊喜。。。事实上太好了。

为了确保我没有作弊,我写了以下代码来确保我的作用域是正确的:

var story_count = "THIS IS NOT A NUMBER";
console.log(story_count);
touch_roll = function()
{
    this.story_count = 0;
}
console.log(story_count);
touch_roll();
console.log(story_count);

完全期望这将在控制台中产生以下响应

THIS IS NOT A NUMBER
THIS IS NOT A NUMBER
THIS IS NOT A NUMBER

我完全惊讶地发现,输出实际上是这个

THIS IS NOT A NUMBER
THIS IS NOT A NUMBER
0

this不是我想的那样吗?研究并没有起到真正的作用,但我有点精疲力竭,所以完全有可能我读错了。如果不是这样,那么我如何将我的所有命名空间完全保持在该函数的范围内,以免干扰网站上现有的部分?


根据马特下面的回答,以下是更正后的代码:

var story_count = "THIS IS NOT A NUMBER";
console.log(story_count);
var touch_roll = new function()
{
    this.story_count = 0;
    console.log(story_count);
}
console.log(story_count);

通过将touch_roll声明为var并将函数实例化为new,Javascript在运行时将所述函数求值为对象(因此我们也可以删除底部对touch_roll()的调用)。

校正后的输出如下:

THIS IS NOT A NUMBER
0
THIS IS NOT A NUMBER

因为您没有用new调用touch_roll,所以thiswindow对象(浏览器环境中的全局变量属于该对象)。

如果你使用new,那么你会得到:

THIS IS NOT A NUMBER
THIS IS NOT A NUMBER
THIS IS NOT A NUMBER

此外,您还将touch_roll声明为隐式全局变量。使用函数声明语法,或向其中添加var