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

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

​变量中包含可随时更改的数据或信息。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://www.fly63.com/article/detial/7543

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

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

CSS变量(自定义属性)实践指南

Sass和Less这样的预处理器,让我们的CSS代码保持良好的结构和可维护性。像变量、混合(mixins)、循环控制等特性,增强了动态编写CSS的能力,从而减少重复代码,也加快了我们开发速度。

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

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

理解var let const区别

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

一个例子,变量提升和函数提升就是这么简单!

引擎在读取js代码的过程中,分为两步。第一个步骤是整个js代码的解析读取,第二个步骤是执行。在JS代码执行之前,浏览器的解析器在遇到 var 变量名 和function 整个函数 提升到当前作用域的最前面。

CSS变量使用解析

很早直接就了解到CSS变量相关的内容,奈何之前使用价值不高(很多主流浏览器不兼容),最近发现主流浏览器都已经支持了这一变化,CSS变量就像JS的变量,每个类名或者花括号就像一个function,里面的变量只有上下文以内可以获取,这就让CSS有了更多可能性。

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

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

ES6-变量的解构赋值

解构赋值官方解释:按照一定的模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)。变量的解构赋值就是一种写法,掌握了这种写法可以让我们在书写 javascript 代码时可以更加的简单,迅捷。

JS中变量的存储

JS中的变量是保存在栈内存中的:1.基本数据类型的值直接在栈内存中存储;2.值与值之间是独立存在的,修改一个变量不会影响其他变量;对象是保存到堆内存中的,每创建一个新的对象

js 交换变量值的方法总汇

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

点击更多...

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