提示:本篇文章讲解的是js中的闭包
什么是闭包?
闭包(closure)指有权访问另一个函数作用域中变量的函数。简单理解就是,一个作用域可以访问另外一个函数内部的局部变量。
提示:以下是本篇文章正文内容,下面案例可供参考
一、闭包是什么?
function fn() {
var num = 10;
function fun() {
console.log(num);
}
fun();
}
fn();
fun这个函数作用域,访问了另一个函数fn里边的局部变量 num 这就是闭包。
二、闭包的主要作用
说完闭包有人肯定好奇 fun 可以访问 num 是可以理解的,因为 fun 的父亲是 fn 函数 作为子函数当然可以访问父亲的变量啊,那如果说在 fn 的外边这个作用域访问一下 num 肯定就能看得到闭包的强大之处了。那么接下来就来给你们讲解一下:
function fn() {
var num = 10;
function fun() {
console.log(num);
}
return fun;
}
var f= fn();
刚开始给你演示的第一小闭包只需要这样写就可以在外部访问内部的 num 变量,因为return是把函数当参数给返回出来了,然后 var 声明一个参数来接收这个返回值。这样就可以实现外部作用域访问函数内部的局部变量。
其实就是类似于做了这么一步操作:
var f = function fun(){
console.log(num);
}
用闭包来写的话其实还可以更简单一点:
function fn() {
var num = 10;
return function() {
console.log(num);
}
}
var f= fn();
f();
这样只需要把函数返回就可以了,直接使用变量不需要再声明名字了,这样也会有闭包的产生。
闭包的主要作用其实就一句话:延伸了变量的作用范围。
三、应用案例
闭包应用-计算打车价格
打车起步价13(3公里内), 之后每多一公里增加 5块钱. 用户输入公里数就可以计算打车价格,
如果有拥堵情况,总价格多收取10块钱拥堵费。
var car = (function () {
var start = 13; // 起步价 局部变量
var total = 0; // 总价 局部变量
return {
// 正常的总价
price: function (n) {
if (n <= 3) {
total = start;
} else {
total = start + (n - 3) * 5
}
return total;
},
// 拥堵之后的费用
yd: function (flag) {
return flag ? total + 10 : total;
}
}
})();
console.log(car.price(5)); // 23
console.log(car.yd(true)); // 33
console.log(car.price(1)); // 13
console.log(car.yd(false)); // 13