DEV Community
·
JavaScript：局部变量、全局变量与DOM
内容提要
局部变量在函数或代码块内声明，仅在该范围内可访问；全局变量可在任何地方访问。使用`const`或`let`声明局部变量，以避免污染全局命名空间。DOM是浏览器提供的接口，用于操作HTML和CSS。
关键要点
-
局部变量在函数或代码块内声明，仅在该范围内可访问。
-
使用let或const声明局部变量，以避免污染全局命名空间。
-
全局变量可以在任何地方访问，包括所有函数和代码块。
-
全局变量可以通过在任何函数外部声明或不使用let、const或var来创建，但后者不推荐。
-
在浏览器中，全局变量附加在window对象上；在Node.js中，除非显式赋值，否则不附加在global上。
-
最佳实践是使用const或let，避免使用未声明的变量，并谨慎使用全局变量。
-
DOM是浏览器提供的接口，用于操作和修改HTML和CSS。
-
DOM表示网页结构为对象树，可以通过ID、类名等方式访问DOM元素。
-
可以通过JavaScript更改DOM元素的内容或样式，创建和添加新元素，以及移除元素。
-
可以通过事件监听器响应用户的操作，如点击或按键。
延伸解读
局部变量与全局变量的使用场景
局部变量适合在函数内部使用，避免对全局命名空间的污染，减少潜在的命名冲突。而全局变量则适合存储需要在多个函数中共享的数据，但应谨慎使用，以免导致代码难以维护。
DOM操作的实用性
通过DOM，开发者可以动态修改网页内容和样式，增强用户体验。掌握DOM操作可以帮助开发者实现交互性功能，如响应用户点击事件，提升网页的活跃度和吸引力。
最佳实践的重要性
使用`const`或`let`声明变量是最佳实践，可以避免意外创建全局变量。遵循这些最佳实践有助于提高代码的可读性和可维护性，减少错误发生的几率。
延伸问答
局部变量和全局变量有什么区别？
局部变量在函数或代码块内声明，仅在该范围内可访问，而全局变量可以在任何地方访问，包括所有函数和代码块。
如何声明局部变量以避免污染全局命名空间？
使用`let`或`const`声明局部变量，可以避免污染全局命名空间。
什么是DOM，它的作用是什么？
DOM（文档对象模型）是浏览器提供的接口，用于操作和修改HTML和CSS，表示网页结构为对象树。
如何通过JavaScript访问DOM元素？
可以通过`document.getElementById`或`document.querySelector`等方法访问DOM元素。
如何更改DOM元素的内容或样式？
可以通过设置`textContent`属性更改文本，或通过`style`属性更改样式。
在JavaScript中，如何响应用户的操作？
可以使用事件监听器，例如`addEventListener`，来响应用户的点击或按键操作。
