JavaScript中变量的作用域详解

2024-09-04 04:42:05

一、变量的分类

在JavaScript中变量分为两种：

全局变量
局部变量

二、变量的作用域

1、局部变量的作用域

局部变量：在函数内部定义的变量称为局部变量，其作用域为该函数内部，在该函数外部不能被访问。看下面的例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>局部变量作用域</title>
    <script>
        // 定义函数fn
        function fn(){
            var a=5;// 定义局部变量
            document.write(a);
        };
        // 调用函数fn
        fn();
        // 定义函数fn2
        function fn2(){
            document(a);
        };
        // 调用函数fn2
        fn2();
    </script>
</head>
<body>

</body>
</html>

结果：

2、全局变量

全局变量：定义在函数外部的变量称为全局变量，其作用域是整个JavaScript代码块。看下面的例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>全局变量作用域</title>
    <script>
       var number; // 全局变量
       function fn(){
          number=5;
          document.write("number的值是:"+number+"<br />");
       };
       function fn2(){
           ++number;
           document.write("number的值是:"+number+"<br />");
       }
       fn();
       fn2();
    </script>
</head>
<body>

</body>
</html>

结果：

注意：

a、如果在函数内定义了和全局变量相同名称的局部变量，那么在函数内部使用就近原则：即在函数内部局部变量起作用。

看下面的例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>全局变量作用域</title>
    <script>
       var number; // 全局变量
       /*       function fn(){
          number=5;
          document.write("number的值是:"+number+"<br />");
       };
       function fn2(){
           ++number;
           document.write("number的值是:"+number+"<br />");
       } */

       // 就近原则
       function fn(){
          var number="我是局部变量";
          document.write("number的值是:"+number+"<br />");
       };
       function fn2(){
           number="我是全局变量"
           document.write("number的值是:"+number+"<br />");
       }
       fn();
       fn2();
    </script>
</head>
<body>

</body>
</html>

结果：

b、全局变量window

如果在定义变量的时候没有使用var，那么默认是全局变量，无论是在函数外部还是在函数内部定义变量。看下面的例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>全局变量作用域</title>
    <script>
       var number; // 全局变量
       /*       function fn(){
          number=5;
          document.write("number的值是:"+number+"<br />");
       };
       function fn2(){
           ++number;
           document.write("number的值是:"+number+"<br />");
       } */

       // 就近原则
 /*       function fn(){
          var number="我是局部变量";
          document.write("number的值是:"+number+"<br />");
       };
       function fn2(){
           number="我是全局变量"
           document.write("number的值是:"+number+"<br />");
       }
       fn();
       fn2(); */

       // windows
       // 相当于window.a
       a=12;
       function fn(){
           // 相当于window.b
           b="我是window对象,是全局变量";
       };
       fn();
       document.write("a="+a+"<br />");
       document.write("b="+b+"<br />");
    </script>
</head>
<body>

</body>
</html>

结果：

c、应尽量避免使用全局变量，以免团队开发变量发生冲突。

以上所述是小编给大家介绍的JavaScript中变量的作用域，希望对大家有所帮助。在此也非常感谢大家对我们网站的支持！

JS变量及其作用域

1. 变量及其作用域:变量分为"全局变量"和"局部变量","全局变量"申明在函数外部,可供所有函数使用,而"局部变量"申明在函数体内部,只能在定义该变量的函数体内使用. (备注:在申明变量时没有var关键字,而是直接赋值的变量均为全局变量) <script type="text/javascript"> function main() { n = 10;//这里的n为全局变量,可以被外部直接使用
JavaScript中的变量作用域介绍

对于变量的作用域(scope),C.Java等语言采取的是"block scope"的方式.与之不同,JavaScript所采取的是"function scope"的方式 - 变量的作用域仅由所处的function决定,与if.for等逻辑块无关.比如,以下这个例子展示了JavaScript中与C.Java等语言不一样的行为: 复制代码代码如下: function(){ var s = 42;//s is visible throughout function
js 作用域和变量详解

一.说起变量的提升呢,首先我们先看一段简单的代码 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <script> var v = 'hello world'; alert(v); </script&
深入解析JavaScript中的变量作用域

在学习JavaScript的变量作用域之前,我们应当明确几点: •JavaScript的变量作用域是基于其特有的作用域链的. •JavaScript没有块级作用域. •函数中声明的变量在整个函数中都有定义. 1.JavaScript的作用域链首先看下下面这段代码: 复制代码代码如下: <script type="text/javascript"> var rain = 1; function rainman(){ var man = 2; function inner()
JS中作用域以及变量范围分析

变量作用域 js作为一门脚本语言,他与c,java这些语言是不相同的. 全局变量在js中声明全局变量,有下面几种方式: 1.在函数外通过var来声明. var test ="hello"; console.log(test); function a(){ test="xx"; console.log(test); } a(); console.log(test); 结果: hello xx xx 这种方式通过声明的变量在任何地方都可进行修改和使用. 2.在函数中隐
Javascript变量作用域详解

变量的作用域指的是变量的可见性,而生命周期则(存活期)则是从另一个角度考察变量. JS中变量的作用域分为全局变量和局部变量,函数内定义的称为局部变量,函数外的称为全局变量.("函数外的称为全局变量"是相对的,另此处讨论的前提是用var显式声明的变量,函数内不用var定义的变量默认是全局变量,当然忽略var声明变量是不赞成的). 复制代码代码如下: var glob = 4;//函数外声明全局变量 function fun() { var height = 20; //函数内用
JavaScript高级程序设计之变量与作用域

目录 1.原始值与引用值 2.instanceof 3.作用域 1.原始值与引用值 6种简单数据类型的值都是原始值, 原始值通过变量赋值给另一个变量时,会复制一个出一个新的值,两者相互独立. let num1 = 5 let num2 = num1 引用值通过变量赋值给另一个变量时,也会复制一个值,这个值其实是一个指针(引用),该指针指向的还是同一个对象. let obj1 = new Object() let obj2 = obj1 既然是指向同一个引用对象,那么给obj1添加属性,也会作用到
JavaScript变量的作用域全解析

变量作用域是程序中定义这个变量的区域. 先来看一段示例: /* 代码1 */ var scope = "global "; function checkScope() { var scope = "local "; function childCheck() { var scope = "childLocal "; document.write(scope); } function childUndefined() { document.wr
JavaScript变量类型以及变量作用域详解

变量类型 ECMAScript变量可能包含两种不同类型的数据值:基本类型和引用类型. 基本类型基本类型指的是简单的数据段,5种基本数据类型:undefined.null.boolean.number.string,基本数据类型是按值访问的,因此可以操作保存在变量中的实际的值. 复制变量值从一个变量向另一个变量复制基本类型的值,会在变量对象上创建一个新值,然后把该值复制到为新变量分配的位置上.例如: var num1 = 5; var num2 = num1; 复制前的变量对象复制后的变量对
javascript 的变量、作用域和内存问题

javascript 的变量.作用域和内存问题 (一)JavaScript变量可以用来保存两种类型的值:基本类型值和引用类型值.基本类型的值源自以下5种基本数据类型:Undefined.Null.Boolean.Number和 String.基本类型值和引用类型值具有以下特点: 1.基本类型值在内存中占据固定大小的空间,因此被保存在栈内存中: 2.从一个变量向另一个变量复制基本类型的值,会创建这个值的一个副本: 3.引用类型的值是对象,保存在堆内存中: 4.包含引用类型值的变量实际上包含的并不是
js变量、作用域及内存详解

基本类型值有:undefined,NUll,Boolean,Number和String,这些类型分别在内存中占有固定的大小空间,他们的值保存在栈空间,我们通过按值来访问的. (1)值类型:数值.布尔值.null.undefined. (2)引用类型:对象.数组.函数. 如果赋值的是引用类型的值,则必须在堆内存中为这个值分配空间.由于这种值的大小不固定(对象有很多属性和方法),因此不能把他们保存到栈内存中.但内存地址大小是固定的,因此可以将内存地址保存在栈内存中. <script type="
JavaScript 变量、作用域及内存

JS变量是松散型的(不强制类型)本质,决定了它只是在特定时间用于保存特定值的一个名字而已; 由于不存在定义某个变量必须要保存何种数据类型值的规则,变量的值及其数据类型可以在脚本的生命周期内改变; 一变量及作用域 1.基本类型和引用类型 // JS变量包含两种不同的数据类型的值:基本类型值和引用类型值; // 1.基本类型值:保存在栈内存中的简单数据段;即这种值完全保存在内存中的一个位置; // 基本类型值包含:Undefined|Null|Boolean|Number|String; // 这
JS块级作用域和私有变量实例分析

本文实例讲述了JS块级作用域和私有变量.分享给大家供大家参考,具体如下: 块级作用域 (function(){ //这里是块级作用域 })() 例如: (function(){ for(var i=0;i<5;i++){ alert(i);//0,1,2,3,4 } })(); alert(i);//error 上例中,定义了一个块级作用域,变量i在块级作用域中可见的,但是在块级作用域外部则无法访问. 这种技术经常在全局作用域中被用在函数外部,从而限制向全局作用域中添加过多的变量和函数. 私有变
关于JS变量和作用域详解

ECMAScript 变量: 1.基本类型值(简单数据段) 2.引用类型值(可能由过个值构成的对象) → 保存在内存中的对象 ------ 动态属性: 只能给引用型值动态添加新属性,以便将来使用. ------ 复制变量值 : 基本类型值的复制 → 在变量对象上创建一个新值 → 复制给新变量(互不影响) 引用类型值的复制 → 将存储在变量对象中的值复制到新变量分配空间中(复制的是一个指针,指向同一个对象,相互影响) ------ 传递参数: ECMAScript中所有函数的参数都是按值传递 .
JavaScript变量作用域及内存问题实例分析

本文实例讲述了JavaScript变量作用域及内存问题.分享给大家供大家参考,具体如下: 学习要点: 1.变量及作用域 2.内存问题 JavaScript的变量与其他语言的变量有很大区别.JavaScript变量是松散型的(不强制类型)本质,决定了它只是在特定时间用于保存特定值的一个名字而已.由于不存在定义某个变量必须要保存何种数据类型值的规则,变量的值及其数据类型可以在脚本的生命周期内改变. 一．变量及作用域 1.基本类型和引用类型的值 ECMAScript变量可能包含两种不同的数据类型的值: