JS里面匿名函数的调用 & 变量作用域的实验
参考 http://www.educity.cn/wenda/54753.html
已实验验证结果正确。
1、下列哪些正确?(B、C)
A.function(){
alert("Here!");
}();
B.(function(){
alert("Here!");
})();
C.(function(){
alert("Here!");
}());
下面也已经实验验证结果正确。
2、下列哪个结果是正确的?(A、B、C、D)
A.(function(a1,a2){
alert("Here!"+(a1+a2));
})(1,2);
B.(function(a1,a2){
alert("Here!" +(a1+a2));
}(1,2));
C.void function(a1,a2){
alert("Here!" +(a1+a2));
}(1,2);
D.var f = function(a1,a2){
alert("Here!" +(a1+a2));
}(1,2); 注:A 、B、C与D四种格式都正确,前两者属于同种情况的不同写法,后两种是将函数对象的返回值赋给其他变量,C是忽略函数返回值,而D正相反!
下面这个的结果也验证,但是注意,稍稍改一下,效果就很大差别。
function Foo() {
var a = 123;
this.a = 456;
(function() {
console.log(a); //
console.log(this.a); // undefined
})();
};
var f = new Foo(); 结果:
123
undefined (1)匿名函数可以直接访问到外层署名函数(Foo)中的变量(使用关键字var定义的),但不能访问外层署名函数的属性(使用关键字this定义的);
稍微改一下,把Foo前面的new去掉,直接调用Foo,如下:
function Foo() {
var a = 123;
this.a = 456;
(function() {
console.log(a); //
console.log(this.a); // undefined
})();
};
var f = Foo(); 结果:
123
456
然后在最后分别加上console.log(f)看看f被赋予什么内容:
var f = new Foo();
console.log(f); 结果:
Foo { a: 456 } var f = Foo();
console.log(f); 结果:
undefined
开始写自己代码的时候,发现了下面的情况。本来以为是node跟原生js的区别呢,看来不是。
/**
* Created by baidu on 16/10/24.
*/
function test(){
var a = 123;
this.a = 456;
return (function(p1,p2){
console.log(a);
console.log(this.a);
return p1+p2;
})(1,2);
};
(function(){
console.log(test());
}()); 用node跑:
123
456
3
内部要访问数据,可以通过传参数(方法一):
function Foo() {
var a = 123;
this.a = 456;
(function(_this) {
console.log(a); //
console.log(_this.a); //
})(this);
};
var f = new Foo(); 结果:
123
456
另外,注意下面这种情况:
(function() {
var a = 123;
this.a = 456;
(function() {
console.log(a); //
console.log(this.a); //
})();
})(); 结果:
123
456 (1) 匿名函数既可以直接访问外层匿名函数中的变量,又直接可以访问外层匿名函数中的属性,而匿名函数却不可以直接访问外层已命名函数中的属性;
访问没有定义过的this.xxx,也是很有意思的:
/**
* Created by baidu on 16/10/24.
*/ function Foo() {
var a = 123;
this.a = 456;
(function() {
console.log(a); //
console.log(this.a); // undefined
this.b = 789;
})();
(function() {
console.log(this.b); //
})();
};
var f = new Foo();
(function() {
console.log(this.a); // undefined
console.log(this.b); //
})();
结果:
123
undefined
789
undefined
789
后面分析。
再来一个里外都是匿名函数的情况:
/**
* Created by baidu on 16/10/24.
*/ (function() {
var a = 123;
this.a = 456;
(function() {
console.log(a); //
console.log(this.a); //
this.b = 789;
})();
(function() {
console.log(this.b); //
})();
})();
(function() {
console.log(this.a); //
console.log(this.b); //
})(); 结果:
123
456
789
456
789
通过上面两个例子的对比及分析,可以看出如下结论:
(1)匿名函数(即用两个小括号括起来的部分)位于一个执行上下文,不论这些代码放在哪个位置上。
再比较下面两种情况:
情况1:
function Foo() {
(function() {
this.b = 789;
})();
(function() {
console.log(this.b); //
console.log(b); //
var a = 0;
console.log(a); //
})();
}
var f = new Foo();
(function() {
console.log(this.b); //
console.log(b); //
})(); 结果:
789
789
0
789
789
情况2:
/**
* Created by baidu on 16/10/24.
*/ function Foo() {
(function() {
this.b = 789;
})();
(function() {
console.log(this.b); //
console.log(b); //undefined
var b = 0;
console.log(b); //
})();
}
var f = new Foo();
(function() {
console.log(this.b); //
console.log(b); //
})(); 结果:
789
undefined
0
789
789
从以上对比,可以看出:
没有加 this取值时,如果当前 {} 中不存在同名的局部变量,则等同于加 this 处理;如果当前 {} 中存在同名的局部变量,则按常规处理。
上面第二例中,b会打印出undefined,是因为在{}出现了b,并且是在后面出现的,当前还是undefined.
以上,是一些实验结果。
JS里面匿名函数的调用 & 变量作用域的实验的更多相关文章
- JS函数定义与匿名函数的调用
一.函数声明.函数表达式.匿名函数 函数声明:function fnName () {…};使用function关键字 声明一个函数,再指定一个函数名,叫函数声明. 函数表达式 var fnName ...
- JS 之匿名函数
匿名函数以及闭包 匿名函数就是没有名字的函数.闭包是指有权访问另一个函数作用域中的变量的函数.创建闭包的常见方式是在一个函数的内部创建另一个函数.闭包会携带包含它的函数的作用域,因此会比其他函数占用更 ...
- [js]js代码执行顺序/全局&私有变量/作用域链/闭包
js代码执行顺序/全局&私有变量/作用域链 <script> /* 浏览器提供全局作用域(js执行环境)(栈内存) --> 1,预解释(仅带var的可以): 声明+定义 1. ...
- js基础 js自执行函数、调用递归函数、圆括号运算符、函数声明的提升 js 布尔值 ASP.NET MVC中设置跨域
js基础 目录 javascript基础 ESMAScript数据类型 DOM JS常用方法 回到顶部 javascript基础 常说的js包括三个部分:dom(文档document).bom(浏览器 ...
- javascript匿名函数自调用
// 匿名函数的自调用 /*var f1 = function() { console.log('我是一个匿名函数!'); }*/ // f1(); // 上面是定义一个匿名函数,然后调用,其实上面就 ...
- 总结下js中匿名函数的写法~好几天没写博客了。。。
小哥最近很是心烦啊,不仅仅要继续以现任前端小白,未来前端攻城狮的身份苦逼学习,还要用剩余的时间去完成毕业设计.早知如此,当初我为毛要报考数学这么个苦逼专业....昨天一整天的时间在研究毕设,感觉代码已 ...
- js 匿名函数-立即调用的函数表达式
先提个问题, 单独写匿名函数为什么报错?return 匿名函数 为什么不报错? 如图: 第二种情况在 f 还没有执行的时候,就报错了,,,当然这得归因于函数声明语句声明提前(发生在代码执行之前)的原因 ...
- JavaScript函数定义和调用 变量作用域
本文是笔者在看廖雪峰老师JavaScript教程时的个人总结 JavaScript中函数定义可以是这样的格式 function 函数名(参数) { 函数体 } 也可以是这样的格式 ...
- JavaScript 中的匿名函数((function() {})();)与变量的作用域
以前都是直接用前端框架Bootstrap,突然想看看Javascript,发现javascript是个非常有趣的东西,这里把刚碰到的一个小问题的理解做下笔录(废话不多说,上代码). /** * Exa ...
随机推荐
- yii无限极分类
/** * 获取菜单Tree * * @return multitype: */ public function getMenuAllList() { $resArr = $this->getT ...
- IE8下兼容rgba颜色的半透明背景
在工作中做一个图片半透明遮罩时发现在IE8下不兼容 一查再知道IE8不支持rgba颜色,再搜搜兼容性方法,没想到这么快就解决了. 先说说rgba的含义: r代表red,g代表green,b代表blue ...
- HDOJ1050
Moving Tables Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Tot ...
- 自定义TexturePacker插件导出自己的plist文件
原地址:http://www.cppblog.com/sunicdavy/archive/2014/02/06/205645.html cocos2dx引擎使用plist文件, 一种特殊的xml格式作 ...
- vi/vim使用指北 ---- Sample Editing
本篇介绍vim的基础操作,各种编辑模式的切换,光标的移动,删除,撤销/重做,保存,查找等基础命令: 基础操作 编辑文件 vim [options] [file ...] 模式 打开文件后进入vim的 ...
- Cayley n顶点树数定理
出处:http://blog.csdn.net/gongqian12345/article/details/7445573 今天遇到一个问题:在一个n阶完全图的所有生成树的数量为n的n-2次方,想了好 ...
- UITableView局部刷新
只刷新cell不刷新section,这问题还难住了一阵子 需要用到: - (void)insertRowsAtIndexPaths:(NSArray *)indexPaths withRowAnima ...
- C# 工厂
/// <summary> /// 创造实例 /// </summary> /// <typeparam name="T">类型</typ ...
- WCF分布式开发步步为赢(2)自定义托管宿主WCF解决方案开发配置过程详解
上一节<WCF分布式框架基础概念>我们介绍了WCF服务的概念和通信框架模型,并给出了基于自定义托管服务的WCF程序的实现代码.考虑到WCF分布式开发项目中关于托管宿主服务配置和客户端添加引 ...
- UVA 1362 Exploring Pyramids 区间DP
Archaeologists have discovered a new set of hidden caves in one of the Egyptian pyramids. The decryp ...