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 相关文章推荐
捕获关闭窗口的脚本
Jan 10 Javascript
深入理解JavaScript中的call、apply、bind方法的区别
May 30 Javascript
原生js实现class的添加和删除简单代码
Jul 12 Javascript
Bootstrap 源代码分析(未完待续)
Aug 17 Javascript
JavaScript仿微博输入框效果(案例分析)
Dec 06 Javascript
微信小程序教程系列之设置标题栏和导航栏(7)
Jun 29 Javascript
angular使用post、get向后台传参的问题实例
May 27 Javascript
20行js代码实现的贪吃蛇小游戏
Jun 20 Javascript
AngularJS ng-repeat指令及Ajax的应用实例分析
Jul 06 Javascript
Angular利用内容投射向组件输入ngForOf模板的方法
Mar 05 Javascript
jQuery事件委托代码实践详解
Jun 21 jQuery
Postman如何实现参数化执行及断言处理
Jul 28 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 程序员应该使用的10个组件
2009/10/31 PHP
PHP实现数组递归转义的方法
2014/08/28 PHP
php导出生成word的方法
2015/12/25 PHP
JQuery 学习笔记 选择器之一
2009/07/23 Javascript
JS控制显示隐藏兼容问题(IE6、IE7、IE8)
2010/04/01 Javascript
div浮层,滚动条移动,位置保持不变的4种方法汇总
2013/12/11 Javascript
jquery 为a标签绑定click事件示例代码
2014/06/23 Javascript
jQuery获取页面元素绝对与相对位置的方法
2015/06/10 Javascript
纯JavaScript代码实现移动设备绘图解锁
2015/10/16 Javascript
AngularJS中实现显示或隐藏动画效果的方式总结
2015/12/31 Javascript
jQuery实现图片加载完成后改变图片大小的方法
2016/03/29 Javascript
jQuery Easyui 验证两次密码输入是否相等
2016/05/13 Javascript
Jquery Easyui选项卡组件Tab使用详解(10)
2016/12/18 Javascript
JS前向后瞻正则表达式定义与用法示例
2016/12/27 Javascript
基于jQuery代码实现圆形菜单展开收缩效果
2017/02/13 Javascript
nuxt.js 缓存实践
2018/06/25 Javascript
vue自定义指令的创建和使用方法实例分析
2018/12/04 Javascript
JavaScript函数式编程(Functional Programming)高阶函数(Higher order functions)用法分析
2019/05/22 Javascript
微信小程序点餐系统开发常见问题汇总
2019/08/06 Javascript
使用layer.msg 时间设置不起作用的解决方法
2019/09/12 Javascript
基于JS实现视频上传显示进度条
2020/05/12 Javascript
为什么JavaScript中0.1 + 0.2 != 0.3
2020/12/03 Javascript
Python入门篇之列表和元组
2014/10/17 Python
Python求算数平方根和约数的方法汇总
2016/03/09 Python
python 将print输出的内容保存到txt文件中
2018/07/17 Python
Django contenttypes 框架详解(小结)
2018/08/13 Python
pandas数据集的端到端处理
2019/02/18 Python
Python中super函数用法实例分析
2019/03/18 Python
python sklearn常用分类算法模型的调用
2019/10/16 Python
简单了解Python3 bytes和str类型的区别和联系
2019/12/19 Python
Keras 在fit_generator训练方式中加入图像random_crop操作
2020/07/03 Python
html5 touch事件实现触屏页面上下滑动(一)
2016/03/10 HTML / CSS
全球性的在线鞋类品牌:Public Desire
2019/04/03 全球购物
大学生职业规划范文:象牙塔生活的四年计划
2014/01/14 职场文书
证婚人婚礼致辞
2015/07/28 职场文书
win11无法登录onedrive错误代码0x8004def7怎么办 ?
2022/04/05 数码科技