变量的生命周期又称为作用域,是指某变量在程序中的有效范围。根据作用域,变量可以分为全局变量和局部变量。
1、 全局变量的作用域是全局性的,即在整个JavaScript程序中,全局变量处处都在。
2、 而在函数内部声明的变量,只在函数内部起作用。这些变量是局部变量,作用域是局部性的;函数的参数也是局部性的,只在函数内部起作用。
经常见到网上有文章说:“在JavaScript中可以有两种方式声明全局变量:1、声明变量时不使用var关键字 2、在函数外部声明变量 使用第一种方法声明变量时,就算是在函数内部,该变量仍为全局变量,使用第二种方法声明变量时,就算是用var关键字,那么声明的变量也是全局变量,” 自己亲手测试一下就知其中对错:参看如下示例:
<!--<br /> <br /> Code highlighting produced by Actipro CodeHighlighter (freeware)<br /> http://www.CodeHighlighter.com/<br /> <br /> --> 1 <script type="text/javascript">
2 var v01 = "我是全局变量v01"; //使用var关键字声明的全局变量
3 v02 = "我是全局变量v02"; //未使用var关键字声明的全局变量
4 function fun1(){
5 alert(v01); //output "我是全局变量v01"
6 alert(v02); //output "我是全局变量v02"
7
8 v03 = "我是全局变量v03";
9 var v04 = "我是局部变量v04";
10 }
11
12 function fun2(){
13 alert(v01); //output "我是全局变量v01"
14 alert(v02); //output "我是全局变量v02"
15
16 alert(v03); //error: "v03未定义"
17 alert(v04); //error: "v04未定义"
18
19 }
20
21 fun2();
22 </script>
为什么结果与大家公认的不一致呢,让我们把程序做稍微的改动:
<!--<br /> <br /> Code highlighting produced by Actipro CodeHighlighter (freeware)<br /> http://www.CodeHighlighter.com/<br /> <br /> --> 1 <script type="text/javascript">
2 var v01 = "我是全局变量v01"; //使用var关键字声明的全局变量
3 v02 = "我是全局变量v02"; //未使用var关键字声明的全局变量
4 function fun1(){
5 alert(v01); //output "我是全局变量v01"
6 alert(v02); //output "我是全局变量v02"
7
8 v03 = "我是全局变量v03";
9 var v04 = "我是局部变量v04";
10 }
11
12 function fun2(){
13 alert(v01); //output "我是全局变量v01"
14 alert(v02); //output "我是全局变量v02"
15
16 alert(v03); //output: "我是全局变量v03"
17 alert(v04); //error: "v04未定义"
18
19 }
20 //两个函数都调用
21 fun1();
22 fun2();
23 </script>
呵呵,这个时候,程序终于按照我们原先的设想执行了,但是这个时候,我们就必须做下来好好总结一下了:
<!--<br /> <br /> Code highlighting produced by Actipro CodeHighlighter (freeware)<br /> http://www.CodeHighlighter.com/<br /> <br /> -->如果我们在函数内部声明了一个全局变量,也就是声明变量时未使用var关键字,当我们在其他地方使用该变量时,必须保证该函数已被调用,所以,如果真的要使用全局变量还是在函数外部声明的好
还有一个值得注意的地方就是:JavaScript变量作用范围没有语句块的概念,他并不像JAVA一样在for循环内部声明的变量,在for循环外部就不能使用,参看一下示例:
<!--<br /> <br /> Code highlighting produced by Actipro CodeHighlighter (freeware)<br /> http://www.CodeHighlighter.com/<br /> <br /> --> 1 function test(){
2 for(var i =0 ; i <20; i++){
3 document.write(i+"<BR>");
4 if(i == 19) {
5 var j = "我是在for语句内部声明的";
6 }
7 }
8 alert(j); //output: "我是在for语句内部声明的"
9 }
10 test();
除此之外,还有一个容易引起错误的地方不能不说,参看一下程序:
<!--<br /> <br /> Code highlighting produced by Actipro CodeHighlighter (freeware)<br /> http://www.CodeHighlighter.com/<br /> <br /> -->1 var strTest = "全局变量";
2 function test1(){
3 alert(strTest); //output: "undefined"
4 var strTest = "看看出错没";
5 }
6 test1();
先来解释一下这个小程序,我们首先在函数外部声明了一个全局性的变量,接着在函数内部把它alert出来,最后我们又声明了一个同全局变量的名字相同的一个局部变量,但是就是这个只有六行的小程序,其结果却并不像我们想象的那样输出"看看出错没",而是输出了undefined,呵呵,看来“JavaScript真是处处是陷阱啊”!
在网上GOOGLE了半天,找到了这样一种说法:
<!--<br /> <br /> Code highlighting produced by Actipro CodeHighlighter (freeware)<br /> http://www.CodeHighlighter.com/<br /> <br /> --> 大家都知道JavaScript是一种解释型的脚本语言,当JavaScript运行时,首先查找所有的变量声明,并以未定义的初始值创建变量。如果变量被声明时有值,那么该变量仍以未定义的值初始化,并且只有在运行了声明行时才被声明值取代。
这也就解释了以上的程序,其实如果我们在程序的第一行之前加上一句:alert(strTest);输出结果依然会是undefined,看到这我想大家应该也想到了,程序出错的原因并不是说声明了一个与全局变量名称相同的局部变量,而是只要在变量声明语句之前调用该变量,该变量的值就一定是 undefined,但是如果我们调用一个没有被声明的变量,这个时候会报“变量未定义”的错误,所以我们还必须得明白这两者之间的区别,不过不管怎么说,一种好的编码习惯还是避免把局部变量与全局变量声明称相同的名字!
在看最后一种情况:注意以下程序:
<!--<br /> <br /> Code highlighting produced by Actipro CodeHighlighter (freeware)<br /> http://www.CodeHighlighter.com/<br /> <br /> --> 1 var strGloblVar = "我是全局变量";
2 function father(){
3 strFatherGloblVar = "在父函数中声明的全局变量";
4 var strFatherVar = "我是父函数中为局部变量,同时也是子函数中的全局变量";
5 function child(){
6 strChildGloblVar = "在子函数中声明的全局变量";
7 var strChildVar = "我是子函数中的局部变量";
8 alert(strFatherVar); //output: "我是父函数中为局部变量,同时也是子函数中的全局变量"
9 alert(strChildVar); //output: "我是子函数中的局部变量"
10 alert("子函数中:"+strGloblVar); //output: "我是全局变量"
11 alert(strFatherGloblVar);
12 }
13 alert("父函数中:"+strGloblVar); //output: "我是全局变量"
14 //alert(strChildVar); //error: strChildVar 未定义
15 //alert(strChildGloblVar); //error:strChildGloblVar 未定义
16 return child();
17 }
18
19 father();
20 alert("所有函数外部:"+strFatherGloblVar); //output: "所有函数外部:在父函数中声明的全局变量"
21 alert("所有函数的外部:"+strChildGloblVar); //output:"所有函数的外部:在子函数中声明的全局变量"
用过JavaScript闭包的人会很容易的看懂以上程序,闭包不是本文要说明的重点,但是这个小例子可以帮我们证明在闭包的情况下,变量的生命周期并没有因为使用闭包而有很大的改变,可以简单的抛开闭包的概念,把father()函数内部看成一个独立的运行环境。14行报错,是因为strChildVar是child()函数中定义的局部变量,15行报错,是因为在调用strChildGloblVar之前child()函数未被执行过,这和我们之前说的都一样。但是当我们在father()函数外部打印strFatherVar的时候会出现错误,导致这种错误的原因很简单,strFatherVar虽然是child()的全局变量,但是却是father()的局部变量。
分享到:
相关推荐
以上是JavaScript学习笔记中提到的一些核心知识点,通过对这些知识点的理解和熟练应用,可以为进一步学习和掌握JavaScript打下坚实的基础。在实际开发过程中,结合具体的项目需求,这些知识会得到更深入的拓展和应用...
"Javascript学习笔记(传智播客视频学习笔记+代码)"是一份全面介绍JavaScript基础知识的学习资源,适用于初学者。这份笔记结合了传智播客的web前端培训视频内容,提供了丰富的理论讲解和实践代码,帮助读者从零开始...
### JavaScript学习笔记知识点详解 #### 一、JavaScript基础篇:数据类型 JavaScript是一种弱类型语言,它具有自动类型转换的特点,使得开发过程中更加灵活但也容易出现类型错误。本节主要介绍JavaScript中的基本...
作用域决定了变量的可见性和生命周期,全局变量在整个脚本中都可访问,而局部变量只在函数内部可用。闭包则是一种特殊的机制,允许函数访问并操作其外部的作用域,即使该函数已经执行完毕。 接着是原型和原型链,这...
9. **变量作用域**:在不同页面中,变量的声明和使用会影响其作用域和生命周期,未声明的变量会引发错误,而全局变量可以作为window对象的属性访问。 10. **面向对象编程**:面向对象编程(OOP)强调封装、抽象和...
HTML&JavaScript学习笔记: HTML是构建网页的标准标记语言,JavaScript是一种在浏览器中运行的脚本语言。这部分学习笔记讲述了HTML的基础知识,包括HTML简介、动态网页开发技术、HTML的基本构成元素、HTTP-EQUIV指令...
- **Application对象**:用于在整个Web应用程序生命周期内共享数据,不受单个用户会话限制。 此外,ASP可以利用服务器端组件来扩展功能,比如ADO(ActiveX Data Objects)用于数据库操作,XMLHTTP对象进行异步HTTP...
Spring Boot 是一个基于 Spring 框架的快速开发...这个完整的 Spring Boot 学习笔记涵盖了从基础到进阶的各个方面,通过学习和实践,你可以掌握 Spring Boot 开发的核心技能,从而高效地构建高质量的 Java 后端应用。
Vue的核心特性如组件化、指令系统、响应式数据绑定和生命周期钩子,都是其强大功能的体现。通过对Vue源码的分析,开发者可以学习到如何设计可复用、可维护的代码,并提升对前端框架的理解。 在"ahao2"这个文件中,...
3. **生命周期**:变量的生命周期取决于其作用域,全局变量在整个页面生命周期内有效。 #### 数据类型 1. **基本数据类型**:字符串 `string`、数字 `number`、布尔值 `boolean`。 2. **对象类型**:所有非原始类型...
**JSP生命周期**: JSP页面在首次请求时被转换为一个Servlet,然后经历初始化、服务和销毁三个阶段。在服务阶段,JSP会根据需要多次调用`doGet()`或`doPost()`方法来处理客户端请求。 **EL(Expression Language)*...
1. React:理解React的基本概念,如组件化开发,JSX语法,状态管理和生命周期方法。 2. Vue:了解Vue的MVVM模式,指令系统,组件系统,以及Vuex状态管理。 这个"前端课程学习笔记汇总"涵盖了JavaScript开发的各个...
JavaScript中的作用域是编程中非常重要的概念,它决定了变量的可见性和生命周期。在JavaScript中,主要有两种作用域:全局作用域和局部作用域。 全局作用域是指在函数外部定义的变量,它们在整个脚本中都是可见的。...
Vue2+Vue3 学习笔记 mounted 和 updated 在 Vue 中,`mounted` 和 `updated` 是两个非常重要的生命周期钩子函数。`mounted` 在页面初次加载时调用,而 `updated` 在数据改变并且要在页面重新渲染完成之后调用。...
学习Vue 3.0,你需要掌握响应式原理、模板语法、组件化开发、状态管理(Vuex)以及生命周期钩子函数。 5. webpack 5:一个模块打包工具,将应用中的各种资源(如JavaScript、CSS、图片等)转换并打包成浏览器可识别...
变量的生存期取决于它们的声明位置,函数内部声明的变量(局部变量)只在函数内部有效,而函数外部声明的变量(全局变量)在整个页面生命周期内都有效。 字符串是JavaScript中的主要数据类型之一,由一串字符组成,...
第三章 Servlets生命周期................222 第四章 资源访问 ......................225 第五章 状态跟踪...230 第六章 过滤器 ...234 第七章 Web Application Life Cycle Events ........................235 ...
JavaScript的词法作用域对于理解和调试代码至关重要,因为它决定了变量的可见性和生命周期。 JavaScript是弱类型语言,与Java等强类型语言不同。在弱类型语言中,变量的类型可以随时改变,不需要提前声明。虽然弱...
JavaScript是一种广泛应用于前端开发的脚本语言,尤其在构建交互性强...使用`var`、`let`或`const`来声明变量,它们的作用域和生命周期各有不同。理解这些基础知识对于深入学习JavaScript和进行实际开发工作是必要的。