js-高级(闭包-递归)
2016-11-18 本文已影响328人
Jianshu9527
1 闭包(closure)
- 在函数的外部去访问函数内部的变量,这一种机制其实就是闭包
※※案例说明↓
var a = 0;
function f(){
var b = 1;
function f1(){
console.log(b++);
}
return f1;
}
var t = f();
t();
chrome下输出的结果:1
简单分析:函数f1()本身是定义在f()函数内部 但是f1()去访问了f()里面的b的变量,此时其实就形成了一个闭包;
1.1如何才能构成一个闭包
- 在函数的内部定义函数
2)函数内部访问它外部的变量(如同上面f1()要访问f())
1.2 闭包的优点
- 延长变量的生命周期
正常情况下一个函数的调用之后,它内部定义的变量就会被删除掉(被回收),但是使用闭包之后,它的生命周期就会得到延长
※※案例说明↓
var a = 0;
function f(){
var b = 1;
function f1(){
console.log(b++);
}
return f1();
}
var c = f();
c();
c();
c();
chrome下输出的结果:1,2,3
1.3 闭包的缺点
闭包-内存泄漏
※※案例一↓
function f(){
var a = 10;
function f1(){
console.log(a);
}
return f1;
}
var t = f();
t();
chrome下输出的结果:10;
案例分析:
内存泄漏.PNG
※※案例二↓
var a = [1,2,3,4];
function f(){
a = [];
}
f();
console.log(a);
chrome输出的结果为空数组
案例分析:
1)a的右边是一个应用数据类型,
2)会在一个堆区里面开辟一个新的空间,用来存放数组里面的值
3)函数里面a的右边是一个新的数组(空的数组)从而开辟了一个新的数组,使其引用地址在此时发生了改变
4)但是此时函数外面的a此时任然保存在堆区里面
鼠标点击案例(-闭包)
案例-鼠标点击事件
鼠标点击出现索引值.PNG
方法一
1)通过额外的添加一个自定义属性,来保存 i 的值
添加自定义属性.PNG
方法二
2)使用闭包
闭包-立即执行函数.PNG
案例分析:
① : f=function(){}就是一个闭包结构;
② : 它是一个函数,它定义在另一个函数的内部
③ : 它访问的不是自己的变量-index
④ : 当中加入了一个立即执行函数(移步☞立即执行函数章节)
⑤ : 函数的返回值会保存在btns[i]这个对象中的onclick属性中
递归
语法结构:
在函数的内部调用自己(自己调用自己)
※※案例↓
function f(){
console.log('f');
f();
}
f();
````
chrome下的结果:陷入死循环(栈溢出)
######递:
递进 : 把大问题分成小问题,一层一层向我们知道的那个答案靠近
######归:
回归 : 小问题都已经得到了解决,从最小的问题向最大的问题回归,一个个解决
※※案例一 >求多为数组中的元素的个数↓
````
<script>
var arr = [1,2,3,4,[56,45]];
function count(arr){
var sum = 0;
for (var i = 0; i < arr.length; i++) {
if(Array.isArray( arr[i] ) == false){
sum +=1;
}
else{
sum += count(arr[i]);
}
}
return sum;
}
console.info( count(arr) ) ;
</script>
````
chrome下输出结果:6
案例分析:
1）递归调用的函数。
2）Count()的功能是：你给我一个数组，我告诉你它有几个元素。
3）如果数组中的元素就是一个普通的元素(非数组的)则sum++即可。
4）如果数组中的元素又是一个数组，则需要递归调用count(当前元素)
※※案例二 >循环与递归↓
````
<script>
//用循环来做
function f1(n){
var sum = 1;
for (var i = 1; i <= n; i++) {
sum *=i;
}
return sum;
}
//递归来做
function f2(n){
if(1== n){
return 1;
}
else
return f2(n-1) * n;
}
//算计时
function computerTime(f,n){
var t1 = new Date();
var result = f(n);
var t2 = new Date();
console.info("时间:"+ (t2-t1) + " 结果: "+result);
}
computerTime(f1,10000);
computerTime(f2,10000);
</script>
````
案例分析:
1) : 递归有最大的嵌套次数
2) : 可用用循环就不要用递归,一般来说,循环的效率比递归的效率更高一些
3) : 如果使用循环不能解决,再考虑用递归
