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 相关文章推荐
combox改进版 页面原型参考dojo的,比网上jQuery的那些combox功能强,代码更小
Apr 15 Javascript
javascript与CSS复习(《精通javascript》)
Jun 29 Javascript
用Javascript实现Sleep暂停功能代码
Sep 03 Javascript
javascript定义函数的方法
Dec 06 Javascript
jQuery 淡入淡出 png图在ie8下有黑色边框的解决方法
Mar 05 Javascript
JS获取图片实际宽高及根据图片大小进行自适应
Aug 11 Javascript
对之前写的jquery分页做下升级
Jun 19 Javascript
javascript判断移动端访问设备并解析对应CSS的方法
Feb 05 Javascript
实例剖析AngularJS框架中数据的双向绑定运用
Mar 04 Javascript
js带闹铃功能的倒计时代码
Sep 29 Javascript
javascript回调函数详解
Feb 06 Javascript
Node.js Buffer模块功能及常用方法实例分析
Jan 05 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
php session 错误
2009/05/21 PHP
PHP7.1方括号数组符号多值复制及指定键值赋值用法分析
2016/09/26 PHP
php实现当前页面点击下载文件的实例代码
2016/11/16 PHP
完美的php分页类
2017/10/24 PHP
php+Ajax处理xml与json格式数据的方法示例
2019/03/04 PHP
javascript 隐藏/显示指定的区域附HTML元素【legend】用法
2010/03/05 Javascript
jQuery图片轮播的具体实现
2013/09/11 Javascript
Javascript缓存API
2016/06/14 Javascript
Vue.js实现一个自定义分页组件vue-paginaiton
2016/09/05 Javascript
微信小程序 加载 app-service.js 错误解决方法
2016/10/12 Javascript
Vue2.0用 watch 观察 prop 变化(不触发)
2017/09/08 Javascript
详解redux异步操作实践
2018/08/15 Javascript
js动态设置select下拉菜单的默认选中项实例
2018/08/21 Javascript
详解微信小程序支付流程与梳理
2019/07/16 Javascript
基于webpack4+vue-cli3项目实现换肤功能
2019/07/17 Javascript
Bootstrap实现省市区三级联动(亲测可用)
2019/07/26 Javascript
windows下create-react-app 升级至3.3.1版本踩坑记
2020/02/17 Javascript
js实现经典贪吃蛇小游戏
2020/03/19 Javascript
vue实现购物车结算功能
2020/06/18 Javascript
python多线程操作实例
2014/11/21 Python
python pandas 组内排序、单组排序、标号的实例
2018/04/12 Python
pandas 数据归一化以及行删除例程的方法
2018/11/10 Python
pygame实现非图片按钮效果
2019/10/29 Python
python实现简单的五子棋游戏
2020/09/01 Python
Python通过getattr函数获取对象的属性值
2020/10/16 Python
Jupyter安装拓展nbextensions及解决官网下载慢的问题
2021/03/03 Python
First Aid Beauty官网:FAB急救面霜
2018/05/24 全球购物
机修工岗位职责
2013/11/24 职场文书
预备党员思想汇报
2014/01/08 职场文书
超级搞笑检讨书
2014/01/15 职场文书
美德少年事迹材料
2014/01/23 职场文书
小学三年级学生评语
2014/04/22 职场文书
英语教育专业毕业生求职信
2014/08/28 职场文书
带刀到教室的检讨书
2014/10/04 职场文书
Python读取文件夹下的所有文件实例代码
2021/04/02 Python
浅谈Python实现opencv之图片色素的数值运算和逻辑运算
2021/06/23 Python