JS全局变量和局部变量最新解析


Posted in Javascript onJune 24, 2016

就是这种盲目无原理依据的研究测试弄晕了我, 有必要这么做吗? 其实理解了原理就没必要搞这么多一个一个的试, 然后得出规律, ECMAScript规则都已经定义好了.

var的规则是: 使用var声明变量就是内部变量, 否则就是先调用全局变量, 不管多少层函数.

this的规则是: method函数里的this永远指向自身, 普通函数的this永远指向DOMWindow.

// GodDamnTest1
function Foo() { 
var a = 123; // 局部变量, 所有子函数的全局变量
this.a = 456; // 对象属性
(function() { 
alert(a); // 123, 全局
alert(this.a); // undefined, 普通函数, this指向DOMWindow 
})(); 
} 
var f = new Foo(); 
// GodDamnTest2
function Foo() { 
var a = 123; 
this.a = 456; 
(function(a) { // 局部声明
alert(a); // 456, 被函数局部声明的a覆盖了全局 
})(this.a); 
} 
var f = new Foo(); 
// GodDamnTest3
function Foo() { 
var a = 123; 
this.a = 456; 
(function() { 
alert(a); // 123, 全局
alert(this.a); // undefined, DOMWindow 
this.b = 789; // window.b = 789
})(); 
(function() { 
alert(this.b); // 789, window.b
})(); 
} 
var f = new Foo(); 
(function() { 
alert(this.b); // 789, window.b
})(); 

// GodDamnTest4
function Foo() { 
(function() { 
this.b = 789; // window.b = 789
})(); 
(function() { 
alert(this.b); // 789, window.b
var b = 0; 
alert(b); // 0, 这样的测试也写出来了!
})(); 
} 
var f = new Foo(); 
(function() { 
alert(this.b); // 789, window.b
alert(b); // 789, window.b
})();

令人意外的是,最后一个 alert(b),结果仍然是 789。 // no damn surprise at all!

// GodDamnTest5
function Foo() { 
(function() { 
this.b = 789; // window.b = 789
})(); 
(function() { 
alert(this.b); // 789, window.b
alert(b); // undefined, 全局
var b = 0; 
alert(b); // 0, 还有这种测试!
})(); 
} 
var f = new Foo(); 
(function() { 
alert(this.b); // 789, window.b
alert(b); // 789, window.b
})();

PS:JS删除局部变量的方法

alert('value:'+str+'\ttype:'+typeof(str)) //声明变量前,引用
var str="dd";
alert('value:'+str+'\ttype:'+typeof(str)) //声明并赋值变量后,引用
str=undefined;




 //删除局部变量
alert('value:'+str+'\ttype:'+typeof(str)) //取消变量后,引用,和第一个相同

以上所述是小编给大家介绍的JS全局变量和局部变量最新解析,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript this用法小结
Dec 19 Javascript
在js中判断checkboxlist(.net控件客户端id)是否有选中
Apr 11 Javascript
Javascript call和apply区别及使用方法
Nov 14 Javascript
快速解决jQuery与其他库冲突的方法介绍
Jan 02 Javascript
jQuery Ajax使用实例
Apr 16 Javascript
Vue 仿百度搜索功能实现代码
Feb 16 Javascript
jQuery实现遍历复选框的方法示例
Mar 06 Javascript
简单谈谈关于Angular Cli打包的事
Sep 05 Javascript
Nuxt项目支持eslint+pritter+typescript的实现
May 20 Javascript
解决vue中使用proxy配置不同端口和ip接口问题
Aug 14 Javascript
node 文件上传接口的转发的实现
Sep 23 Javascript
vue表单中遍历表单操作按钮的显示隐藏示例
Oct 30 Javascript
jQuery插件passwordStrength密码强度指标详解
Jun 24 #Javascript
jquery选择器中的空格与大于号>、加号+与波浪号~的区别介绍
Jun 24 #Javascript
jquery表单插件Autotab使用方法详解
Jun 24 #Javascript
jQuery插件cxSelect多级联动下拉菜单实例解析
Jun 24 #Javascript
jQuery下拉框的简单应用
Jun 24 #Javascript
浅谈json取值(对象和数组)
Jun 24 #Javascript
json对象与数组以及转换成js对象的简单实现方法
Jun 24 #Javascript
You might like
PHP操作MongoDB时的整数问题及对策说明
2011/05/02 PHP
实现获取http内容的php函数分享
2014/02/16 PHP
yii操作cookie实例简介
2014/07/09 PHP
Zend Framework过滤器Zend_Filter用法详解
2016/12/09 PHP
PHP异常处理定义与使用方法分析
2017/07/25 PHP
PHP7 其他语言层面的修改
2021/03/09 PHP
javascript实现的在当前窗口中漂浮框的代码
2010/03/15 Javascript
jquery实现table鼠标经过变色代码
2013/09/25 Javascript
jquery ajax post提交数据乱码
2013/11/05 Javascript
js禁止回车提交表单的示例代码
2013/12/23 Javascript
JavaScript返回网页中锚点数目的方法
2015/04/03 Javascript
原生js和jQuery写的网页选项卡特效对比
2015/04/27 Javascript
jQuery实现文本框输入同步的方法
2015/06/20 Javascript
基于canvas实现的钟摆效果完整实例
2016/01/26 Javascript
JS操作COOKIE实现备忘记录的方法
2016/04/01 Javascript
jQuery实现字符串全部替换的方法
2016/12/12 Javascript
jquery.guide.js新版上线操作向导镂空提示jQuery插件(推荐)
2017/05/20 jQuery
Angular X中使用ngrx的方法详解(附源码)
2017/07/10 Javascript
JQuery元素快速查找与操作
2018/04/22 jQuery
node实现的爬虫功能示例
2018/05/04 Javascript
JS左右无缝轮播功能完整实例
2019/05/16 Javascript
layui(1.0.9)文件上传upload,前后端的实例代码
2019/09/26 Javascript
使用webpack/gulp构建TypeScript项目的方法示例
2019/12/18 Javascript
[00:57]辉夜杯战队访谈宣传片—VG
2015/12/25 DOTA
[01:38]女王驾到——至宝魔廷新尊技能&特效展示
2020/06/16 DOTA
简单介绍Python中的几种数据类型
2016/01/02 Python
Python找出最小的K个数实例代码
2018/01/04 Python
python实现ID3决策树算法
2018/08/29 Python
10个示例带你掌握python中的元组
2020/11/23 Python
中软国际Java程序员机试题
2012/08/19 面试题
中专生自我鉴定书范文
2013/12/28 职场文书
企业法人授权委托书范本
2014/09/23 职场文书
云冈石窟导游词
2015/02/04 职场文书
2015年幼儿园国庆节活动总结
2015/07/30 职场文书
2016大学军训心得体会
2016/01/11 职场文书
html中两种获取标签内的值的方法
2022/06/10 HTML / CSS