Question

今天我在使用webpack和DefinePlugin时发现了一些奇怪的东西。

假设我的webpack.config.js包含以下内容：

new webpack.DefinePlugin({
    'foo.bar': JSON.stringify('hello world'),
    'baz': JSON.stringify({bar: 'I am in baz.bar'}),
})

我的global-environment.ts：

declare var foo: object
declare var baz: object

现在，我在我的主脚本文件中执行此操作：

console.log(foo.bar)     // hello world
console.log(foo['bar'])  // hello world
console.log(baz.bar)     // I am in baz.bar
console.log(baz['bar'])  // I am in baz.bar

它工作正常，但现在乐趣开始了：

console.log(foo)  // ReferenceError: foo is not defined
console.log(baz)  // { bar: 15 }

为什么它认为foo未定义，但我确实可以通过bar和.访问[]？

我最初的怀疑是，它与使用一个对象作为另一个对象的键并强制转换为字符串类似：

const a = {}
const b = {}
const b[a] = 15  // {'[object Object]': 15}

所以foo.bar等同于globals['foo.bar']之类的东西，然后单独foo未定义和foo[bar]也是有道理的。除非它不是，并且如上所述，您通常可以使用foo.bar和foo['bar']，就像foo是常规对象一样。

这里发生了什么？

变量定义为＆＃39;。＆＃39;在名字里

0 个答案: