JavaScript中全局变量和局部变量是什么?

更新日期: 2019-12-21 阅读: 2.2k 标签: 变量

​变量中包含可随时更改的数据或信息。JavaScript使用保留关键字var来声明变量。在JavaScript中,有两种类型的变量:全局变量和局部变量。那么JavaScript中全局变量和局部变量具体是什么?有什么用?下面本篇文章就来给大家介绍一下JavaScript中全局变量和局部变量,希望对大家有所帮助。


局部变量

使用JavaScript时,局部变量是在函数中定义的变量。它们具有局部范围,这意味着它们只能在定义它们的函数中使用。

由于局部变量是在函数内定义的,因此具有相同名称的变量可用于不同的函数。

例:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
	</head>

	<body> 
    <center> 
        <p>在myfunction()之外没有定义petName。</p> 
  
        <p id="demo1"></p> 
  
        <p id="demo2"></p> 
  
        <script> 
            myfunction(); 
  
            function myfunction() { 
                var petName = "Sizzer"; // local variabl 
                document.getElementById("demo1").innerHTML = "myfunction()函数内:"+
                    typeof petName + " " + petName; 
            } 
  
            document.getElementById("demo2").innerHTML = "myfunction()函数外:"+
                typeof petName; 
        </script> 
  </center> 
</body> 
</html>

上面的例子说明了局部变量的使用。但是,函数外部的语句不能引用名为petName的变量而不会导致错误。这是因为它具有局部范围。


全局变量

全局变量是在函数之外定义的变量。这些变量具有全局范围,因此任何函数都可以使用它们,而无需将它们作为参数传递给函数。

由于全局变量在函数外部定义,因此具有相同名称的变量不能用于不同的函数。网页上的所有脚本和功能都可以访问它。

例:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
	</head>

	<body> 
    <center> 
        <p>可以从任何脚本或函数访问全局变量。</p> 
  
        <p id="demo1"></p> 
  
        <p id="demo2"></p> 
  
        <script> 
            var petName = "Rocky";//global variable 
            myFunction(); 
  
            function myFunction() { 
                document.getElementById("demo1").innerHTML = 
                   "petName是: " + petName+ "- " +typeof petName; 
            } 
  
            document.getElementById("demo2").innerHTML = 
              "petName是: " + petName+ "- " +typeof petName; 
        </script> 
  </center> 
</body> 
</html>


在哪里使用哪些变量?

 ● 尽管使用全局变量似乎比将数据传递给函数并从中返回数据更容易,但全局变量通常会产生问题。这是因为任何函数都可以修改全局变量,并且很容易拼错变量名或修改错误的变量,尤其是在大型应用程序中。反过来,这可能会产生调试问题。

 ● 相反,局部变量的使用降低了命名冲突的可能性。例如,两个不同的函数可以对局部变量使用相同的名称而不会引起冲突。当然,这意味着更少的错误和调试问题。只有少数例外情况,应用程序中的所有代码都应该在函数中,因此所有变量都是本地的。

 ● 如果拼错了已经声明的变量的名称,它将被视为新的全局变量。考虑到这一点,请确保在声明新变量时包含关键字,并在代码中引用变量之前始终声明变量。

注意:尽可能使用局部变量。在其他语句引用变量之前,始终使用var关键字声明新变量。


如何使用变量?

 ● 变量或函数的范围决定了哪些代码可以访问它。

 ● 在函数中创建的变量是局部变量,而局部变量只能由函数中的代码引用。

 ● 函数外部创建的变量是全局变量,所有函数中的代码都可以访问所有全局变量。

 ● 如果忘记在变量声明中编写var关键字,JavaScript引擎将假定该变量是全局的。这可能会导致调试问题。

 ● 通常,将局部变量作为参数从一个函数传递到另一个函数比使用全局变量要好。这将使您的代码更容易理解,出错的几率更小。


本文内容仅供个人学习、研究或参考使用,不构成任何形式的决策建议、专业指导或法律依据。未经授权,禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载,请保留原文来源信息,不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持!

链接: https://fly63.com/article/detial/7543

相关推荐

vue定义全局变量

VUE.js 中涉及到JS全局变量:全局变量专用模块得引入、全局变量模块挂载到Vue.prototype、使用VUEX存储状态值、使用window存储变量

let与var的区别,为什么要用let?

var是全局声明,let是块级作用的,只适用于当前代码块;var变量会发生变量提升,let则不会进行变量提升;var 会造成重复赋值,循环里的赋值可能会造成变量泄露至全局

php中的$_REQUEST超全局变量

PHP $_REQUEST是用于收集HTML表单提交的数据,PHP $_REQUEST属于PHP的超级全局变量。以下实例显示了一个输入字段(input)及提交按钮(submit)的表单(form)

从.env文件中为Node.js加载环境变量

使用环境变量是配置 Node.js 程序的好方法。而且许多包或模块可以基于不同的 NODE_ENV 变量的值表现出不同的行为。存储环境变量的一种方法是将它们放在 .env 文件中。这些文件允许你指定各种环境变量及其相应的值。

在vue中实现了在样式里使用js变量的方法

在使用vue开发时,经常会封装很多的组件方便复用,那么难免就有写样式相关组件,比如需要使用时传入颜色、高度等样式参数。

js 交换变量值的方法总汇

这篇文章总结七种办法来交换a和b的变量值 。最最最简单的办法就是使用一个临时变量了 ,最后我的方案是利用了ES6的解构赋值语法 ,它允许我们提取数组和对象的值,对变量进行赋值

理解var let const区别

JavaScript中var、let、const区别?js中let和const都是es5版本新的命名规范,在此之前定定义一个变量只能用var。我们可以把let和const看做是为了弥补var的一些不足而新设计出来的

css自定义变量_初次接触CSS变量

本文的目的主要是展示CSS变量是如何工作的。随着Web应用程序变得越来越大,CSS变得越来越大,越来越多,而且很多时候都很乱,在良好的上下文中使用CSS变量,为您提供重用和轻松更改重复出现的CSS属性的机制。

Node常用的全局变量与 Inspect 调试

在 Node 中常用的全局方法有 CommonJS、Buffer、process、console、timer 等,这些方法不需要 require引入 API 就可以直接使用。如果希望有属性或方法可以“全局使用”,那就将它挂载在 Node 的global对象上:

css变量_原生css 中变量的使用

原生css 中变量的使用,这个重要的 CSS 新功能,所有主要浏览器已经都支持了。本文全面介绍如何使用它,你会发现原生 CSS 从此变得异常强大。声明变量的时候,变量名前面要加两根连词线(--),var()函数用于读取变量。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!