参考 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里面匿名函数的调用 & 变量作用域的实验的更多相关文章

  1. JS函数定义与匿名函数的调用

    一.函数声明.函数表达式.匿名函数 函数声明:function fnName () {…};使用function关键字 声明一个函数,再指定一个函数名,叫函数声明. 函数表达式 var fnName ...

  2. JS 之匿名函数

    匿名函数以及闭包 匿名函数就是没有名字的函数.闭包是指有权访问另一个函数作用域中的变量的函数.创建闭包的常见方式是在一个函数的内部创建另一个函数.闭包会携带包含它的函数的作用域,因此会比其他函数占用更 ...

  3. [js]js代码执行顺序/全局&私有变量/作用域链/闭包

    js代码执行顺序/全局&私有变量/作用域链 <script> /* 浏览器提供全局作用域(js执行环境)(栈内存) --> 1,预解释(仅带var的可以): 声明+定义 1. ...

  4. js基础 js自执行函数、调用递归函数、圆括号运算符、函数声明的提升 js 布尔值 ASP.NET MVC中设置跨域

    js基础 目录 javascript基础 ESMAScript数据类型 DOM JS常用方法 回到顶部 javascript基础 常说的js包括三个部分:dom(文档document).bom(浏览器 ...

  5. javascript匿名函数自调用

    // 匿名函数的自调用 /*var f1 = function() { console.log('我是一个匿名函数!'); }*/ // f1(); // 上面是定义一个匿名函数,然后调用,其实上面就 ...

  6. 总结下js中匿名函数的写法~好几天没写博客了。。。

    小哥最近很是心烦啊,不仅仅要继续以现任前端小白,未来前端攻城狮的身份苦逼学习,还要用剩余的时间去完成毕业设计.早知如此,当初我为毛要报考数学这么个苦逼专业....昨天一整天的时间在研究毕设,感觉代码已 ...

  7. js 匿名函数-立即调用的函数表达式

    先提个问题, 单独写匿名函数为什么报错?return 匿名函数 为什么不报错? 如图: 第二种情况在 f 还没有执行的时候,就报错了,,,当然这得归因于函数声明语句声明提前(发生在代码执行之前)的原因 ...

  8. JavaScript函数定义和调用 变量作用域

     本文是笔者在看廖雪峰老师JavaScript教程时的个人总结   JavaScript中函数定义可以是这样的格式 function 函数名(参数) {     函数体 } 也可以是这样的格式     ...

  9. JavaScript 中的匿名函数((function() {})();)与变量的作用域

    以前都是直接用前端框架Bootstrap,突然想看看Javascript,发现javascript是个非常有趣的东西,这里把刚碰到的一个小问题的理解做下笔录(废话不多说,上代码). /** * Exa ...

随机推荐

  1. 对LVS DR模式的理解

    Client向vip发请求,lvs接收 Src mac Dst mac type … Src ip Src port Dst ip Dst port … CRC Mac1 Mac2 … … 192.1 ...

  2. 1-Highcharts 3D图之普通3D柱状图与带空值

    <!DOCTYPE> <html lang='en'> <head> <title>1-Highcharts 3D图之普通3D柱状图与带空值</t ...

  3. GIS数据格式topojson

    Topojson源自于GeoJson,是D3中描述地理数据的格式,D3的作者觉得GeoJson太繁琐.同样的数据,TopoJson是GeoJson的1/5. 这里有一个转换TopoJson,GeoJs ...

  4. Mysql 操作

    MySQL命令行导出数据库:1,进入MySQL目录下的bin文件夹:cd MySQL中到bin文件夹的目录如我输入的命令行:cd C:\Program Files\MySQL\MySQL Server ...

  5. 使用PHP_UML生成代码的UML图

    在读别人代码的时候, 在没有详细文档的时候, 如何快速的看清整个代码的结构(类结构), 就成为了一个现实的问题. 今天我就介绍一种, 自动生成UML图的方法. 假设, 我有一个项目文件夹:laruen ...

  6. 有关npm rum的3个简洁技巧

    [编者按]本文作者为来自 MongoDB 的 NodeJS 工程师 Valeri Karpov.Valeri 专注于维护常见的 Mongoose ODM,是<Professional Angul ...

  7. winform中的时间轴控件

    我现在做的项目遇到一个需求,就是有没有类似的控件: 我要实现的功能是:播放录像. 某个时间段内假如有2个录像,这个坐标表示的是时间,假如我现在拖动时间轴,拖到第一个录像里面开始播放第一个录像,拖到2个 ...

  8. POJ3469 Dual Core CPU(最小割)

    题意:给你n个模块,每个模块在A核花费为ai,在B核跑花费为bi,然后由m个任务(ai,bi,wi),表示如果ai,bi不在同一个核上跑,额外的花费为wi,求最小的花费. 一开始想的时候以为是费用流, ...

  9. POJ 2100

    Graveyard Design Time Limit: 10000MS   Memory Limit: 64000K Total Submissions: 4443   Accepted: 946 ...

  10. Linux网络编程9——对TCP与UDP的简易封装2.0

    具体生成动态库的操作及使用该动态库的操作请参见上篇博文.以下仅仅列出改进版本的代码. 代码 my_socket.h #ifndef __MY_SOCKET_H__ #define __MY_SOCKE ...