函数的闭包

一 概念
```js function outer() { var data = {} function inner() { return data; } return inner; } // 闭包目的:不允许提升变量作用域时,该函数的局部变量需要被其他函数使用 // 闭包本质:函数的嵌套,内层函数称之为闭包 // 闭包的解决案例:①影响局部变量的生命周期,持久化局部变量;②解决变量污染

二 代码示范

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>闭包</title>
</head>
<body>
闭包
</body>
<script type="text/javascript">
// 闭包: 函数的嵌套定义,内层函数就是闭包
// 闭包产生的原因:
// 1.函数会产生局部作用域, 外部需要使用 -- 返回值 | 函数回调 | 闭包 | 提升作用域
// 2.在外部另一个函数中使用该局部变量 -- 函数回调 | 闭包
// 3.不能使用函数回调(函数已有固定参数,或不能拥有参数),只能将函数定义到拥有局部变量函数的内部 => 闭包
// 总结:一个函数要使用另外一个函数的局部变量


// 提升作用域
var a; // 作用域被提升
function fn() {
a = 10; // 局部变量 => 在外部定义
}
fn();
// 外部使用局部变量: 返回值 | 函数回调 | 闭包 | 提升作用域
console.log(a);


// 好处:
// 1.外部函数a_fn不需要强制拥有参数以及返回值
// 2.外部函数的局部变量也无需提升作用域,可以保证参数的安全性
// 3.内部函数b_fn也不需要强制拥有参数与返回值,便可以直接使用外部函数a_fn的局部变量data
function a_fn() {
var data = [1, 2, 3, 4, 5];
// 闭包
function b_fn() {
console.log('>>>', data);
}
b_fn();
}
a_fn();
// 闭包使用:
// 外部函数在外部调用
// 内部函数在(外部函数)内部调用


// 就是闭包可以解决哪些问题
// 1.局部变量的持久化
// 2.变量污染(页面标签循环绑定)

</script>
</html>

闭包解决局部变量生命周期

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>局部变量生命周期</title>
</head>
<body>
局部变量生命周期
</body>
<script type="text/javascript">
function outer() {
// eg: 请求得到的数据,如何不持久化,方法执行完毕后,数据就会被销毁
var data = [1, 2, 3, 4, 5];
console.log(data);
// 通过闭包解决该类问题,所以闭包所以代码均可以随意自定义
function inner() {
return data;
}
// 数据被inner操作返回,inner属于outer,属于需要outer将inner返回出去(跟外界建立起联系)
return inner;
}
// 将局部变量生命周期提升于inner函数相同,inner存在,局部变量data就一直存在
var inner = outer();
console.log(inner());

</script>
</html>

 

 
posted @ 2018-10-15 19:52  不沉之月  阅读(182)  评论(0编辑  收藏  举报