Javascript中的变量使用说明


Posted in Javascript onMay 18, 2010

javascript中的所有变量都是类型松散的,不同于其他面向对象语音的变量声明都是强类型的.因此Javascript 的变量声明是不包括类型的。通过var关键字或者直接写变量名来声明一个变量,如:
var v = 1;
v=1;

这时有人可能会问,上述的两种声明有什么区别,为什 么会有这两种不同的声明方式,这就涉及到javascript中变量的作用域了。在javascript中,变量的作用域包括全局和函数级别的。

全局变量可以声明在函数体外,无论使用上述的哪种声明方式,在函数体外 声明的变量都是全局变量。如:

<script type="text/javascript" language="javascript"> 
var v = 1; function foo() 
{ 
alert(v); 
} 
w = 2; 
function bar() 
{ 
alert(w); 
} 
foo(); 
</script>

运行结果:1 2

另外,在函数内部声明的变量如果不使用var关键字,声明的变量也将是全局变量。如:

<script type="text/javascript" language="javascript"> 
function foo() 
{ 
v = 1; 
} foo(); 
alert(v); 
</script>

运行结果:1
但是需要注意,这种情况下,若要使用变量,必须先调用声明变量的函数对变量进行初始化, 如foo(),否则,将会出现“变量v未定义”的错误。

全局变量将作为window对象的属性存在,因为可以 通过window.$($表示变量名)访问。当然也可以通过变量名直接访问。下面会讲到为什么有这两种访问方式。

在函数内部通过var关键字声明的变量将是函数级别的变量,其作用域仅仅限于函数内部。如:

<script type="text/javascript" language="javascript"> 
function foo() 
{ 
var v=1; 
alert(v); 
} alert(v); 
</script>

运行结果:1 变量“v”未定义

通过上面的分析,可以发现关键字var主要作用 是定义函数级别的变量。

细心的朋友可以会问,如果在函数内部和外部定义了相同的变量,会是什么样的结果呢?如:

<script type="text/javascript" language="javascript"> 
var v=1; 
function foo() 
{ 
alert(v); 
var v=2; 
} foo(); 
</script>

运行结果:undefined
!!!!!也许有人会比较郁闷了,v明明白白的定义在函数foo()体外,为什么会是 undefined呢?这就涉及到javascript的解析了。根据经验,javascript对于函数体内变量的解析过程是:
搜索所有的 var关键字,将其变量声明放到函数体的最前面,赋值和使用仍然保持不变,这样,上面的javascript实际上是等同于:
<script type="text/javascript" language="javascript"> 
var v=1; 
function foo() 
{ 
var v; 
alert(v); 
v=2; 
} foo(); 
</script>

照此分析,产生上述 的结果就显而易见了,由于函数内部的变量的优先级高于全局变量的优先级(大部分的编程语言都是这样), 函数内部的变量v覆盖了全局变量v,但是由于在使用函数内部变量v时,它仅仅声明,但未赋值,因此结果是undefined。

如果在方法 体内仍然要使用定义的全局变量v,window对象此时派上大大的用场了,可以通过window.v来访问。如:

<script type="text/javascript" language="javascript"> 
var v=1; 
function foo() 
{ 
alert(window.v); 
alert(v); 
var v=2; 
} foo(); 
</script>

运行结果:2 undefined
Javascript 相关文章推荐
javascript下对于事件、事件流、事件触发的顺序随便说说
Jul 17 Javascript
javascript取消文本选定的实现代码
Nov 14 Javascript
jquery中ajax学习笔记4
Oct 16 Javascript
js confirm()方法的使用方法实例
Jul 13 Javascript
Python脚本后台运行的几种方式
Mar 09 Javascript
原生js实现水平方向无缝滚动
Jan 10 Javascript
AngularJS ng-repeat指令及Ajax的应用实例分析
Jul 06 Javascript
Vue.js仿微信聊天窗口展示组件功能
Aug 11 Javascript
Vue中的slot使用插槽分发内容的方法
Mar 01 Javascript
React注册倒计时功能的实现
Sep 06 Javascript
Vant的安装和配合引入Vue.js项目里的方法步骤
Dec 05 Javascript
js继承的这6种方式!(上)
Apr 23 Javascript
Javascript实现的鼠标经过时播放声音
May 18 #Javascript
JavaScript 继承机制的实现(待续)
May 18 #Javascript
JavaScript 面向对象编程(2) 定义类
May 18 #Javascript
JavaScript 面向对象编程(1) 基础
May 18 #Javascript
Javascript Object.extend
May 18 #Javascript
Jsonp 跨域的原理以及Jquery的解决方案
May 18 #Javascript
javascript 密码强度验证规则、打分、验证(给出前端代码,后端代码可根据强度规则翻译)
May 18 #Javascript
You might like
MyEclipse常用配置图文教程
2014/09/11 PHP
微信开发之网页授权获取用户信息(二)
2016/01/08 PHP
一个简单的php路由类
2016/05/29 PHP
javascript面向对象编程代码
2011/12/19 Javascript
js判断undefined变量类型使用typeof
2013/06/03 Javascript
自己编写的类似JS的trim方法
2013/10/09 Javascript
javascript 循环调用示例介绍
2013/11/20 Javascript
Javascript写入txt和读取txt文件示例
2014/02/12 Javascript
使用JQ来编写最基本的淡入淡出效果附演示动画
2014/10/31 Javascript
jQuery实现字符串按指定长度加入特定内容的方法
2015/03/11 Javascript
JavaScript包装对象使用详解
2015/07/09 Javascript
jquery带翻页动画的电子杂志代码分享
2015/08/21 Javascript
JS+CSS实现大气清新的滑动菜单效果代码
2015/10/22 Javascript
Node.js+Express配置入门教程详解
2016/05/19 Javascript
全面解析jQuery $(document).ready()和JavaScript onload事件
2016/06/08 Javascript
深入理解Angularjs向指令传递数据双向绑定机制
2016/12/31 Javascript
Ionic3实现图片瀑布流布局
2017/08/09 Javascript
深入理解Vue.js源码之事件机制
2017/09/27 Javascript
Vue2.0用户权限控制解决方案
2017/11/29 Javascript
浅谈vue3中effect与computed的亲密关系
2019/10/10 Javascript
JavaScript ES 模块的使用
2020/11/12 Javascript
Python查找相似单词的方法
2015/03/05 Python
Python在信息学竞赛中的运用及Python的基本用法(详解)
2017/08/15 Python
基于python历史天气采集的分析
2019/02/14 Python
python字符串判断密码强弱
2020/03/18 Python
资深财务管理人员自我评价
2013/09/22 职场文书
银行财务部实习生的自我鉴定
2013/11/27 职场文书
金融专业个人求职信范文
2013/11/28 职场文书
大学生创业感言
2014/01/25 职场文书
抗洪救灾标语
2014/10/08 职场文书
学校捐款活动总结
2015/05/09 职场文书
2015年学校保卫部工作总结
2015/05/11 职场文书
学生病假条怎么写
2015/08/17 职场文书
2016大学生诚信考试承诺书
2016/03/25 职场文书
Java新手教程之ArrayList的基本使用
2021/06/20 Java/Android
Python爬虫网络请求之代理服务器和动态Cookies
2022/04/12 Python