一、变量的分类

在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（五）：变量的作用域的更多相关文章

  1. 从头开始学JavaScript (二)——变量及其作用域

    原文:从头开始学JavaScript (二)--变量及其作用域 一.变量 ECMAscript变量是松散型变量,所谓松散型变量,就是变量名称可以保存任何类型的数据,每个变量仅仅是一个用于保存值的占位符 ...

  2. javascript之变量、作用域、作用域链

    一.变量 javascript的变量是松散类型的,所谓松散类型就是说定义的变量可以用来保存任何类型的数据.定义变量时要使用var操作符后面跟变量名.这里的var是一个关键字,如果定义变量时省略了var ...

  3. JavaScript笔记:变量及其作用域

    一.变量的定义及声明 在javascript中变量仅仅是用来保存值的一个占位符而已,定义变量时要使用关键字var后跟一个变量名,如下所示: var message; //定义一个变量message,像 ...

  4. JavaScript 中变量、作用域和内存问题的学习

    这是我学习JavaScript的第二篇文章,之前做过几年的Java开发,发现JavaScript虽然也是面向对象的语言但是确实有很多不同之处.就本篇博客,主要学习总结一下最近学习到的JavaScrip ...

  5. 【点滴javascript】变量与作用域

    基本类型与引用类型 ECMAScript的的变量有两种类型: 基本类型(值类型):简单数据段 引用类型:多个值构成的对象 在变量赋值结束后,解析器必须知道这个变量时基本数据类型还是引用类型,需要注意的 ...

  6. JavaScript中变量、作用域、内存问题

    这几天,闲的没事看看JavaScript高级编程,感觉JavaScript真的很强大,尤其是采用面向对象的编程方式. 一.   基本类型和引用类型的值: ECMAScript变量可能包含两种不同数据类 ...

  7. javaScript之 变量、作用域和内存问题

    <javaScript高级程序设计>第四章  读书笔记 4.1  基本类型 和 引用类型 的值 1. 基本类型值 包括:Undefined.Null.Boolean.Number 和 St ...

  8. javascript的变量、作用域和内存问题

    基本类型和引用类型的值执行环境垃圾收集 ECMAScript 变量可能包含两种不同数据类型的值:基本类型值和引用类型值.基本类型值指的是简单的数据段引用类型值指那些可能由多个值构成的对象 基本数据类型 ...

  9. JavaScript 学习-变量的作用域和块级作用域

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  10. JavaScript之变量、作用域和内存问题

    js中的变量可能包含2种数据类型,基础数据类型和引用数据类型. 一般而言,基本数据类型是数据段,引用数据类型是对象. 保存方式的不同: 基本类型可以直接操作保存在变量中的值:而引用类型真实的值是保存在 ...

随机推荐

  1. 从代码上解决Jenkins 发送邮件中文乱码问题

    在实践中,使用Jenkins发送测试报告,收到邮件,邮件内容中的中文为乱码,邮件发送的方式是在Jenkins发邮件设置中设置邮件内容为:${FILE,path="report_ug.html ...

  2. activiti Task

    UserTask ScriptTask ServiceTask MailTask ManualTask ReceiveTask BusinessRuleTask callActivity

  3. shell 知识点

        Q:1 Shell脚本是什么.它是必需的吗? 答:一个Shell脚本是一个文本文件,包含一个或多个命令.作为系统管理员,我们经常需要使用多个命令来完成一项任务,我们可以添加这些所有命令在一个文 ...

  4. Atitit 函数调用的原理与本质attilax总结 stdcall cdecl区别

    Atitit 函数调用的原理与本质attilax总结 stdcall cdecl区别 通常来说函数调用要用到的两条基本的指令:”CALL”指令和”RET”指令.”CALL”指令将当前的指令指针(这个指 ...

  5. 【Unity】11.1 角色控制器 (Character Controller)

    分类:Unity.C#.VS2015 创建日期:2016-05-02 一.简介 角色控制器(Character Controller)主要用于对第三人称或第一人称游戏主角的控制.如果要创建类人角色,可 ...

  6. 【Unity】2.11 了解游戏有哪些分类对你开阔思路有好处

    分类:Unity.C#.VS2015 创建日期:2016-03-31 一.简介 对游戏类型的划分有助于游戏的市场定位,以便吸引具有同一爱好的玩家群体.此外,制作游戏策划方案时,也通常会依据不同的游戏类 ...

  7. Shell中整数比較

    -eq             等于,如:if ["$a" -eq "$b" ] -ne             不等于,如:if ["$a" ...

  8. 源码安装mysql5.6x启动报错:[ERROR] Can't find messagefile '/data/mysqldata/3306/english/errmsg.sys'

    :: mysqld_safe Starting mysqld daemon with databases from /data/mysqldata//data -- :: [Warning] The ...

  9. 菜鸟学SSH（十六）——Struts2内部是如何工作的

    前面说完了Spring.Hibernate,很自然今天轮到struts了.struts的核心原理就是通过拦截器来处理客户端的请求,经过拦截器一系列的处理后,再交给Action.下面先看看struts官 ...

  10. Java数据库连接池实现原理

    一般来说,Java应用程序访问数据库的过程是: 装载数据库驱动程序: 通过jdbc建立数据库连接: 访问数据库,执行sql语句: 断开数据库连接. public class DBConnection ...