菜鸟学闭包_实例分享[对象、函数、闭包、this、双小括号]_by grace

garce_mac 2015-05-22 03:57:28

纯菜鸟一枚，自学中，整理笔记如下。
直接copy，随便用。

<h1><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>grace_学习闭包</title>
</head>

<body>

学习闭包<br/>
（1）闭包:“如何跳出局部，访问全局”<br/>
//对象中的闭包、this、双括号()()的用法<br/>
//对象中的闭包、this、双括号()()、以及被this赋值的普通变量that<br/>
（2）闭包:“在外部环境中访问并改变局部变量”

<Script type="text/javascript">

var name = 'outside';
//var name 可以堪称是在该环境中的一个属性名
//var name 即是 window.name 是全局对象的属性

//闭包:“如何跳出局部，访问全局”

//对象中的闭包、this、双括号()()的用法
var obj = {
name: "my obj",
//name 在这里是obj.name
/*
test: function(){
alert(name); //把name当成一个变量，弹出outside
alert(typeof name); //string
alert(typeof getNameFunc); //undefined
alert(this) //[object Object]
},
*/
getNameFunc: function(){ //编号A
return function(){ //编号B
return this.name
// outside 说明this指向全局中的name
//return this
//[object Window]
//中括号中，第一个object表示类型，第二个Window表示所在的环境
};
}
};

//alert(obj.test());
//没有设return值，再返回一次undefined

alert(obj.getNameFunc()());
//obj.getNameFunc()执行A函数
//返回“function(){return this.name}” 并结束A，即obj.的调用完成
//第二个小括号执行B，即A执行后返回的这个函数
//由于A执行后，obj.的调用已经结束，那么B()相当于是被全局对象window.调用的函数
//所以B中的this指向window

//对象中的闭包、this、双括号()()、以及被this赋值的普通变量that
var obj1 = {
name: "my obj1",
//name 在这里是obj1.name
getNameFunc:
function(){ //编号A
var that = this;
/*
alert(this); //[object Object]
alert(this.name); //my obj1
alert(that); //[object Object]
*/
return function(){ //编号B
return that.name
// my obj1
//[object Window]
//中括号中，第一个object表示类型，第二个Window表示所在的环境
};
}
};

alert(obj1.getNameFunc()());
//obj1.getNameFunc()执行A函数
//返回“function(){return that.name}” 并结束A，即obj1.的调用完成
//第二个小括号执行B，即A执行后返回的这个函数——返回结果：my obj1
//B中的that是一个普通变量，赋值是什么就是什么
//由于A中已经给B赋值了this(指向obj1）那么B中的that.name就是obj1.name

//通过闭包:“在外部环境中访问并改变局部变量”

var a = 7;

function fun1(){
//相对于window这个大的对象环境中，fun1就是一个闭包，所以变量和函数的作用域受fun1的局限
var a = 123;
nAdd = function(){
a+=3; //a的取值范围首先被fun1所限制，在fun1内如果没有名为a的变量就会读取window中的a的值7
//由于fun1内有名为a的变量，所以就近读取限制在fun1内的这个a，则a=a+3=126
alert(this); //[object Window] nAdd这个函数是在window中调用的
}
function fun2(){
alert(a) //当nAdd运行后，本环境中的a的值被nAdd的运算结果所覆盖
}
return fun2;
}

var result = fun1();
result(); //123

nAdd(); //nAdd()的意义：在局部环境中定义的全局函数，可以改变局部环境中的变量的值
//此例中，nAdd的运算结果改变了局部环境fun1下的闭包fun2中的变量的值
result(); //126

</script>

</body>
</html>
</h1>

...全文