DEV Community
·
JavaScript：局部变量、全局变量与DOM
💡
原文英文，约700词，阅读约需3分钟。
📝
内容提要
局部变量在函数或代码块内声明，仅在该范围内可访问；全局变量可在任何地方访问。使用`const`或`let`声明局部变量，以避免污染全局命名空间。DOM是浏览器提供的接口，用于操作HTML和CSS。
🎯
关键要点
- 局部变量在函数或代码块内声明，仅在该范围内可访问。
- 使用let或const声明局部变量，以避免污染全局命名空间。
- 全局变量可以在任何地方访问，包括所有函数和代码块。
- 全局变量可以通过在任何函数外部声明或不使用let、const或var来创建，但后者不推荐。
- 在浏览器中，全局变量附加在window对象上；在Node.js中，除非显式赋值，否则不附加在global上。
- 最佳实践是使用const或let，避免使用未声明的变量，并谨慎使用全局变量。
- DOM是浏览器提供的接口，用于操作和修改HTML和CSS。
- DOM表示网页结构为对象树，可以通过ID、类名等方式访问DOM元素。
- 可以通过JavaScript更改DOM元素的内容或样式，创建和添加新元素，以及移除元素。
- 可以通过事件监听器响应用户的操作，如点击或按键。
❓
延伸问答
局部变量和全局变量有什么区别？
局部变量在函数或代码块内声明，仅在该范围内可访问，而全局变量可以在任何地方访问，包括所有函数和代码块。
如何声明局部变量以避免污染全局命名空间？
使用`let`或`const`声明局部变量，可以避免污染全局命名空间。
什么是DOM，它的作用是什么？
DOM（文档对象模型）是浏览器提供的接口，用于操作和修改HTML和CSS，表示网页结构为对象树。
如何通过JavaScript访问DOM元素？
可以通过`document.getElementById`或`document.querySelector`等方法访问DOM元素。
如何更改DOM元素的内容或样式？
可以通过设置`textContent`属性更改文本，或通过`style`属性更改样式。
在JavaScript中，如何响应用户的操作？
可以使用事件监听器，例如`addEventListener`，来响应用户的点击或按键操作。
➡️
