变量“名称”不返回未定义

Question

I'm learning about hoisting in JavaScript.我正在学习 JavaScript 中的吊装。 When I try this code当我尝试这段代码时

console.log('name', name)
console.log('age', age)
console.log('occupation', occupation)

var name = 'tom'
var age = '23'
var occupation = 'builder'

in my developer tools in chrome i get在我的 chrome 开发者工具中，我得到了

name tom
age undefined
occupation undefined

how come name is not undefined but other variables are?为什么名称不是未定义的，但其他变量是？

Edit:编辑：

My html file我的 html 文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script src = "index.js"></script>
</body>
</html>

My index.js file我的 index.js 文件

console.log('name', name)
console.log('age', age)
console.log('occupation', occupation)

var name = 'tom'
var age = '23'
var occupation = 'builder'

I restarted my computer, created new files and nothing has changed.我重新启动了计算机，创建了新文件，但没有任何改变。 In firefox I get在 firefox 我得到

name <empty string> 
age undefined 
occupation undefined

Answer 1

This is working exactly as it's supposed to: the declarations ( but not assigned values ) for "age" and "occupation" are hoisted, so your console log shows them existing with value "undefined" (rather than throwing a ReferenceError ), but name is special: you're not the one who declared it, even though your code makes it look like you are:这完全按预期工作：“年龄”和“职业”的声明（但未分配值）被提升，因此您的控制台日志显示它们存在值“未定义”（而不是抛出ReferenceError ），但name很特别：你不是声明它的人，即使你的代码让它看起来像你：

What's really going on is that the code you've written is scoped, and so when you say var name = "tom" , what you've actually written is currentscope.name = "tom" .真正发生的事情是您编写的代码是作用域的，因此当您说var name = "tom"时，您实际编写的是currentscope.name = "tom" 。 In any kind of explicit scope (a function, a module, etc) this will behave the way you expected, but in global scope in a browser (or more precisely, "in any execution context in which your scope is window "), what this means is that your code actually executes as window.name = "tom" . In any kind of explicit scope (a function, a module, etc) this will behave the way you expected, but in global scope in a browser (or more precisely, "in any execution context in which your scope is window "), what这意味着您的代码实际上执行为window.name = "tom" 。

And so that's where things go wrong: name already exists as a global property on the window object这就是 go 错误的地方： name已经作为window object 上的全局属性存在

Of course, this goes for any other value too, if you var numbats = "cute";当然，这也适用于任何其他值，如果你var numbats = "cute"; in global scope, that's the same as window.numbats = "cute";在全局 scope 中，与window.numbats = "cute"; so if you don't want to run into silent naming conflicts: don't declare things in global scope.所以如果你不想遇到无声的命名冲突：不要在全局 scope 中声明东西。 Test this in a function (where var name will shadow the global name ), or you can use modern JS and use let instead of a curly bracket block but of course then we're not using var anymore.在 function 中进行测试（其中var name将隐藏全局name ），或者您可以使用现代 JS 并使用let而不是花括号块，但当然我们不再使用var了。

Fun little known fact: setting the global name to "tom" and then browsing the web for an hour in the same tab will, even an hour later, still have window.name be your value, unless someone else has changed it, which almost never happens.鲜为人知的有趣事实：将全局name设置为"tom" ，然后在同一个选项卡中浏览 web 一个小时，即使一个小时后， window.name仍然是您的值，除非其他人更改了它，这几乎永远不会发生。 It's one of those hilarious ways in which multi-faceted tracking stays possible.这是让多方面跟踪成为可能的有趣方式之一。

变量“名称”不返回未定义

问题描述

1 个解决方案

解决方案1
2 已采纳 2020-04-26 17:04:04

变量“名称”不返回未定义

问题描述

1 个解决方案

解决方案1 2 已采纳 2020-04-26 17:04:04

解决方案1
2 已采纳 2020-04-26 17:04:04