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 相关文章推荐
filemanage功能中用到的common.js
Apr 08 Javascript
poshytip 基于jquery的 插件 主要用于显示微博人的图像和鼠标提示等
Oct 12 Javascript
js 判断checkbox是否选中的操作方法
Nov 09 Javascript
JavaScript中自定义事件用法分析
Dec 23 Javascript
js仿淘宝商品放大预览功能
Mar 15 Javascript
Vue 2中ref属性的使用方法及注意事项
Jun 12 Javascript
js实现点击展开隐藏效果(实例代码)
Sep 28 Javascript
搭建基于express框架运行环境的方法步骤
Nov 15 Javascript
浅谈小程序globalData的那些事儿
Nov 01 Javascript
javascript实现贪吃蛇小游戏
Jul 28 Javascript
vue npm install 安装某个指定的版本操作
Aug 11 Javascript
详解Vue中Axios封装API接口的思路及方法
Oct 10 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 echo 输出字符串函数详解
2010/05/13 PHP
php写的简易聊天室代码
2011/06/04 PHP
PHP APC缓存配置、使用详解
2014/03/06 PHP
php foreach正序倒序输出示例代码
2014/07/01 PHP
Yii多表联合查询操作详解
2016/06/02 PHP
JS替换文本域内的回车示例
2014/02/18 Javascript
JavaScript异步回调的Promise模式封装实例
2014/06/07 Javascript
JQuery表格拖动调整列宽效果(自己动手写的)
2014/09/01 Javascript
2014最热门的JavaScript代码高亮插件推荐
2014/11/25 Javascript
Jquery网页内滑动缓冲导航的实现代码
2015/04/05 Javascript
快速掌握Node.js环境的安装与运行方法
2016/02/16 Javascript
javascript鼠标跟随运动3种效果(眼球效果,苹果菜单,方向跟随)
2016/10/27 Javascript
利用JS判断字符串是否含有数字与特殊字符的方法小结
2016/11/25 Javascript
vue.js实现刷新当前页面的方法教程
2017/07/05 Javascript
js仿微信抢红包功能
2020/09/25 Javascript
Python处理Excel文件实例代码
2017/06/20 Python
单链表反转python实现代码示例
2018/02/08 Python
pandas series序列转化为星期几的实例
2018/04/11 Python
Python实现迭代时使用索引的方法示例
2018/06/05 Python
Python分支语句与循环语句应用实例分析
2019/05/07 Python
详解python实现小波变换的一个简单例子
2019/07/18 Python
python plotly绘制直方图实例详解
2019/07/22 Python
Matplotlib使用Cursor实现UI定位的示例代码
2020/03/12 Python
国外平面设计素材网站:The Hungry JPEG
2017/03/28 全球购物
德国药房apodiscounter中文官网:德国排名前三的网上药店
2019/06/03 全球购物
全球最大化妆品零售网站:SkinStore
2020/10/24 全球购物
NHL官方在线商店:Shop.NHL.com
2020/05/01 全球购物
高校教师思想汇报
2014/01/11 职场文书
初婚初育证明
2014/01/14 职场文书
安全生产管理责任书
2014/04/16 职场文书
计算机专业毕业生求职信
2014/04/30 职场文书
公司副总经理任命书
2014/06/05 职场文书
小学秋季运动会报道稿
2014/09/30 职场文书
党的群众路线教育实践活动对照检查剖析材料
2014/10/09 职场文书
导游词之杭州西湖
2019/09/19 职场文书
用Python制作灯光秀短视频的思路详解
2021/04/13 Python