閉包及相關(guān)題目

閉包,即函數(shù)連同它作用域鏈上的要找的這個變量,共同構(gòu)成閉包。目的為暫存封裝數(shù)據(jù)。如下為典型閉包案例:

function car(){
  var speed = 0
  function fn(){
    speed++
    console.log(speed)
  }
  return fn
}
var speedUp = car()
speedUp()   //1
speedUp()   //2

1.如下代碼輸出多少?如果想輸出3,那如何改造代碼?

var fnArr = [];
for (var i = 0; i < 10; i ++) {
  fnArr[i] =  function(){
    return i
  };
}
console.log( fnArr[3]() ) //輸出10,返回函數(shù)但是未執(zhí)行函數(shù),for循環(huán)結(jié)束后輸入fnArr[3],函數(shù)才執(zhí)行,此時i等于10

思路:形成閉包,暫存數(shù)據(jù)

var fnArr[]
for(var i = 0, i<10, i++){
  fnArr[i]=(function(j){
    return function(){
       return j
  }
 })(i)
}
console.log( fnArr[3]() )

2.封裝一個car對象,滿足如下功能

var Car = (function(){
   var speed = 0;
   //補充
   return {
      setSpeed: setSpeed,
      getSpeed: getSpeed,
      speedUp: speedUp,
      speedDown: speedDown
   }
})()
Car.setSpeed(30)
Car.getSpeed() //30
Car.speedUp()
Car.getSpeed() //31
Car.speedDown()
Car.getSpeed()  //30

解答:

var Car = (function(){
   var speed = 0;
  function setSpeed(s){
    speed=s
  }
  function getSpeed(){
    return speed
  }
  function speedUp(){
    speed++
  }
  function speedDown(){
    speed--
}
   //補充
   return {
      setSpeed: setSpeed,
      getSpeed: getSpeed,
      speedUp: speedUp,
      speedDown: speedDown
   }
})()
Car.setSpeed(30)
Car.getSpeed() //30
Car.speedUp()
Car.getSpeed() //31
Car.speedDown()
Car.getSpeed()  //30

3.如下代碼輸出多少?如何連續(xù)輸出 0,1,2,3,4?

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

解答:
delayer:5 //setTimeout為異步處理,for循環(huán)結(jié)束后才開始執(zhí)行,即i=5

for(var i=0;i<5;i++){
    satTimeout(function(j){
        return function(){
            console.log('delayer:'+ j)
        }
    })(i),0)
}  

4.補全代碼,實現(xiàn)數(shù)組按姓名、年紀、任意字段排序。

var users = [
  { name: "John", age: 20, company: "Baidu" },
  { name: "Pete", age: 18, company: "Alibaba" },
  { name: "Ann", age: 19, company: "Tecent" }
]

users.sort(byField('age'))
users.sort(byField('company'))

解答:

function byName(user1, user2){
  return user1.name > user2.name
}

function byAge (user1, user2){
  return user1.age > user2.age
}
或者:
function byFeild(field){
  return function(user1, user2){
    return user1[field] > user2[field]
  }
}
users.sort(byField('company'))

5.寫一個 sum 函數(shù),實現(xiàn)如下調(diào)用方式。

console.log( sum(1)(2) ) // 3
console.log( sum(5)(-1) ) // 4
解答:

function cat(i){
  return function(j){
    return i+j
  }
}

參考:http://book.jirengu.com/fe/%E5%89%8D%E7%AB%AF%E5%9F%BA%E7%A1%80/Javascript/%E9%97%AD%E5%8C%85.html

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容