闭包题目讲解2

2017-09-29  本文已影响0人  流着万条永远的河

封装Car对象

var car=(function(){
  var speed=0;
  function set(s){
    speed = s
  }
  function get(){
    return speed
  }
  function speedUp(){
    speed++
  }
  function speedDown(){
    speed--
  }
  return {
    set:set,
    get : get,
    speedUp:speedUp,
    speedDown:speedDown
    }
})()
car.set(30)       //是对象的用法,返回的应该是对象,对象的返回值需要用函数
car.get()
car.speedUp()
car.speedDown()
car.get()
效果如图:

不能直接对speed进行操作,封装在一个包里,用函数去操作这个变量,这个变量就是局部变量了,car是全局变量,得不到释放,所以返回的对象得不到释放,所以对象应用的方法得不到释放,方法得不到释放,speed得不到释放,生成闭包。

如何连续输出0,1,2,3,4

原代码:
for(var i=0;i<5;i++){
  setTimeout(function(){
    console.log('delayer:'+i)
  },0)
}
//"delayer:5"
"delayer:5"
"delayer:5"
"delayer:5"
"delayer:5"

setTimeout会把当前执行的加到任务队列里,for循环相当于设置了5个定时器,这时候i=5,再去执行。再说一次,for循环对于闭包,干扰更大,所以,实质上的影响不仅仅在于循环几次,最后要决定执行几次,还有这个i的值的影响。前面的闭包,尽量让i的赋值在函数内部的作用域,所以造了个闭包,并立即执行,i不需要引用for循环得到的i值。
如何利用呢?

for(var i=0;i<5;i++){
  (function(j){
    setTimeout(function(){
    console.log('delayer:'+j)
  },0)
 })(i)
}
//"delayer:0"     又是立即执行的函数,这次i的赋值遵从for循环的取值,这是什么情况呢?
//就是循环时先把函数的变量i赋值,但是延时执行,for循环依然正常循环,虽然函数执行时,i已经是5了。
"delayer:1"
"delayer:2"
"delayer:3"
"delayer:4"


for(var i=0;i<5;i++){
  (function(j){
    
      setTimeout(function(){
    console.log('delayer:'+j)
  },10000 - 1000*j)
 })(i)
}
//"delayer:4"
"delayer:3"
"delayer:2"
"delayer:1"
"delayer:0"
这里只是把定时器的顺序换了下,数字越大,延时越短,越靠前执行嘛。
for(var i=0;i<5;i++){
 setTimeout(function(j){
   return function(){
     console.log('delayer:'+j)
      }
  }(i),0)
} 
//"delayer:0"
"delayer:1"
"delayer:2"
"delayer:3"
"delayer:4"
定时器里的函数会立刻执行,跟上面的那个延时的不一样,上面的函数里有定时器啊,这个输出是立刻的。
执行过程中传递i,然后里面return的那个结果就是一个函数,setTimeout就能用这个函数,用的过程中,用到了j,中间加个临时变量存进去了,用到的时候,就从上一级去找,每当i赋值了,j=arguments[0]也拥有了值。
var makeCounter=function(){
  var count = 0
  return function(){
    return count++
  }
}
var counter = makeCounter()
var counter2=makeCounter()
console.log(counter())     //0
console.log(counter())//1
console.log(counter2())//0
console.log(counter2())//1
这里的意思,声明不一样的两个变量同时指向一个函数,通过作用后,两者得到了两个独立的作用域对象,互相不影响的。函数只是一种操作方法。
上一篇 下一篇

猜你喜欢

热点阅读