班门弄斧01：Javascript闭包

闭包：兴趣，注意undefined这个数据类型
先看一个例子：
<script type="text/javascript">
var name = "Love Movie";

var object = {
name : "Love Music",
getName : function(){
alert(this.name);
　　 }
};
alert(object.getName ());
</script>



这个例子会弹出什么东西?
会弹出“Love Music”,"undefined"

打印undefined的原因仔细思考下。

<script type="text/javascript">
var name = "Love Movie";

var object = {
name : "Love Music",
getName : function(){
alert(this.name);
　　 }
};
var a = object.getName();
　alert(a);
</script>

闭包：局部变量和全局变量的区分

<script type="text/javascript">
var name = "Love Movie";

var object = function() {
var name = "Love Music"; //(A)
};

function init() {
object();
}

init();
alert(name);
</script>
会打印出Love Movie，因为(A)处的name是object对象的局部变量，外部是无法访问的。
如果去除(A)处的var,结果又是如何？Love Music

如果在一个函数中，用var定义变量，那么这个变量将是这个函数的局部变量，并且外部的函数无法调用。
那么如果想要有属于自己函数的变量，一定要在函数中给这个变量增加一个 var，否则将会默认为全局变量。


提问，那么我们如何调用局部变量呢？

<script type="text/javascript">
var name = "Love Movie";

var object = {
name : "Love Music", //(A)
getName : function() {
return this.name;
}
};

alert(object.getName());
</script>

这个例子不太好！因为这个不是闭包的例子，只是演示了数组的属性和值。



闭包：深度剖析

<script type="text/javascript">
var name = "Love Movie";
function z() {
var name = "Love Music";
function getZname() {
return name;
}
return getZname;
}

var getZname = z();
alert(getZname());

</script>

Q1:这个会弹出什么呢？

<script type="text/javascript">
var name = "Love Movie";
function z() {
var name = "Love Music";
function getZname() {
return this.name;
}
return getZname;
}

var getZname = z();
alert(getZname());

</script>

Q2:这个会弹出什么呢？

答案：
Q1:Love Music
Q2:Love Movie


Q1剖析：
<script type="text/javascript">
var name = "Love Movie";
function z() {
var name = "Love Music";
function getZname() {
return name;
}
return getZname;
}

var getZname = z();
alert(getZname);
alert(getZname());

</script>

这边需要仔细分析下，getZname是什么玩意。
它其实就是
function getZname() {
return name;
}函数对象，然后我们再执行getZname()方法。


验证一下：
<script type="text/javascript">
var name = "Love Movie";
function z() {
var name = "Love Music";
function getZname() {
return name;
}
function _getZname() {
return "Love Dota";
}
return _getZname;
}

var getZname = z();
alert(getZname);
alert(getZname());

</script>
直接返回“Love Dota”

Q2剖析：
理解完Q1剖析，Q2应该很好理解，同样是一个函数，只不过this指向的那么是全局变量。
验证一下：


<script type="text/javascript">
var name = "Love Movie";
function z() {
var name = "Love Music";
function getZname() {
return this;
}
return getZname;
}

var getZname = z();
alert(getZname);
alert(getZname().name);

</script>

看了上述那么多的例子，究竟什么是闭包呢?

闭包：概念
闭包就是能够读取其他函数内部变量的函数。
由于在Javascript语言中，只有函数内部的子函数才能读取局部变量，因此可以把闭包简单理解成"定义在一个函数内部的函数"。
所以，在本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。


2014.01.03 01:45


闭包：待续

先说几句废话：每天都是在洗完澡临睡前有点想看文章的冲动，洗澡前干了什么呢，dota，dota...
上述的javascript闭包说的实在令人乏味，javascript闭包到底是个啥玩意？
当你return的是内部function时，就是一个闭包。内部function会close-over外部function的变量直到内部function结束。

这句话，我的理解是（可能有坑）：
（1）闭包最起码得有2个函数：外部函数和内部函数
（2）外部函数必须有返回值，返回值是内部函数
（3）对于变量的操作统一放到内部变量中进行、

举例：



function foo(x) {

var tmp = 3;
return function (y) {
alert(x + y + (++tmp));
}
}
var bar = foo(2); // bar 现在是一个闭包
bar(10);


按照这种思路去理解，其实闭包就是一个封闭的东西（包含了一些变量+一个方法）
function (y) {
alert(x + y + (++tmp));
}

In computer science, a closure is a function together with a referencing environment for the nonlocal names (free variables) of that function.

从技术上来讲，在JS中，每个function都是闭包，因为它总是能访问在它外部定义的数据。

Since scope-defining construction in Javascript is a function, not a code block like in many other languages, what we usually mean by closure in Javascript is a fuction working with nonlocal variables defined in already executed surrounding function.

我去，完全被大神们写的文章搞晕了！（看不得就正常了，因为理论总是令人费解的凑字数，然后让你解开）

<script type="text/javascript">

// 我们可以调用这个匿名方法, 返回这个内部函数，它是一个闭包
var db = (
function() {
var data = {};
return
function(key, val) {
if (val === undefined) {
return data[key]
}
else {
return data[key] = val
}
}

}
)();

db('x'); // 返回 undefined
db('x', 1); // 设置data['x']为1
db('x'); // 返回 1
// 我们不可能访问data这个object本身
// 但是我们可以设置它的成员
</script>

多多实践！

 

转载于:https://my.oschina.net/u/2402990/blog/490474