JavaScript閉包_定時器_BOM

1.下面的代碼輸出多少匿乃?修改代碼讓 fnArr[i]() 輸出 i桩皿。使用 兩種以上的方法

var fnArr = [];
for (var i = 0; i < 10; i ++) {
    fnArr[i] =  function(){
        return i;
    };
}
console.log( fnArr[3]() );  // 輸出10,因為它們訪問的都是全局的i 
方法一:
for (var i = 0; i < 10; i ++) {
    fnArr[i] =  (function(i){
      return function () {
        return i
      }
    })(i);
}
方法2:
for (var i = 0; i < 10; i ++) {
    (function(i){
      fnArr[i] = function () {
        return i
      }
    })(i);
}

2.封裝一個汽車對象幢炸,可以通過如下方式獲取汽車狀態(tài)

// 閉包+立即執(zhí)行函數(shù)實現(xiàn)變量封裝
var Car = (function(){
  var speed = 0
  var status = 'stop'
  function setSpeed(s){
      if (s > 0) {
        speed = s
        status = 'running'
      }
  }
  function getSpeed() {
    return speed
  }
  function accelerate() {
    if (status === 'running') {
      speed += 10
    }
  }
  function decelerate() {
    if (status === 'running') {
      speed -= 10
      if (speed === 0) {
        status = 'stop'
      }
    }
  }
  function getStatus() {
    return status
  }
  return {
      setSpeed: setSpeed,
      getSpeed: getSpeed,
      accelerate: accelerate,
      decelerate: decelerate,
      getStatus: getStatus    
  }
})()
Car.setSpeed(30);
Car.getSpeed(); //30
Car.accelerate();
Car.getSpeed(); //40;
Car.decelerate();
Car.decelerate();
Car.getSpeed(); //20
Car.getStatus(); // 'running';
Car.decelerate(); 
Car.decelerate();
Car.getStatus();  //'stop';
//Car.speed;  //error

3.下面這段代碼輸出結(jié)果是? 為什么?

var a = 1;
setTimeout(function(){
    a = 2;
    console.log(a);
}, 0);
var a ;
console.log(a);
a = 3;
console.log(a);
// 1泄隔,3,2 解析:因為setTimeout是異步執(zhí)行宛徊,就算它的等待時間為0佛嬉,也要等
到j(luò)s代碼執(zhí)行完畢后才會開始執(zhí)行他的回調(diào)函數(shù),因此會先執(zhí)行外面兩個console.log

4.下面這段代碼輸出結(jié)果是? 為什么?

var flag = true;
setTimeout(function(){
    flag = false;
},0)
while(flag){}
console.log(flag);
// 沒有任何輸出,因為setTimeout理由同上闸天,而在執(zhí)行到while時flag為true代碼
陷入無限循環(huán)(在目前60版本的Chrome上JS引擎會自動優(yōu)化暖呕,跳出無限循環(huán),所以輸出為true)

5.下面這段代碼輸出苞氮?如何輸出delayer: 0, delayer:1...(使用閉包來實現(xiàn))

for(var i=0;i<5;i++){
  setTimeout(function(){
        console.log('delayer:' + i );
  }, 0);
  console.log(i);
}
// 0湾揽,1,2,3钝腺,4  
// delayer: 5抛姑,delayer: 5赞厕,delayer: 5艳狐,delayer: 5,delayer: 5
// 解析:setTimeout中的所有i訪問的都是全局的i皿桑,而setTimeout的回調(diào)函數(shù)會在
    for循環(huán)執(zhí)行完畢后執(zhí)行所以此時i的值為5
修改:
 for(var i=0;i<5;i++){
  !function (i) {
    setTimeout(function(){
          console.log('delayer:' + i );
    }, 0);
  }(i)
  console.log(i);
} 

6.如何獲取元素的真實寬高

  • JS 中 element 對象提供 offsetHeight, scrollHeight, clientHeight(每個有對應(yīng) width)毫目,其中:

    • offsetHeight 可以用來計算元素的物理空間,此空間包括內(nèi)容诲侮,padding 和 border(還包括滾動條的寬度镀虐,但大多時候滾動條的寬度是計算到 padding 和內(nèi)容中的)。
    • scrollHeight 用來計算可滾動容器的大小沟绪,包括不可見的部分刮便,比如一個 300300 的容器放入一個 600600 的圖片,此時 scrollHeight 為 600绽慈,當(dāng)然恨旱,scrollHeight 的值需要加上 padding 的值。
    • clientHeight 表示可視區(qū)域坝疼,包括內(nèi)容和 padding 搜贤,如果有滾動條,還需要減去滾動條的寬度钝凶。
  • 通過 getComputedStyle(IE下currentStyle) 可以獲取元素的真實尺寸. 示例:

    let elem = document.getElementById("elem-container");
    let theCSSprop = window.getComputedStyle(elem).getPropertyValue("想獲取的屬性值");
    

7.URL 如何編碼解碼仪芒?為什么要編碼?

  • encodeURI(): encodeURI() 是對統(tǒng)一資源標識符(URI)進行編碼的方法耕陷。它使用1到4個轉(zhuǎn)義序列來表示每個字符的UTF-8編碼掂名。
  • encodeURIComponent(): encodeURIComponent()是對統(tǒng)一資源標識符(URI)的組成部分進行編碼的方法。它使用一到四個轉(zhuǎn)義序列來表示字符串中的每個字符的UTF-8編碼哟沫。
  • decodeURI(): decodeURI() 函數(shù)解碼一個由encodeURI 先前創(chuàng)建的統(tǒng)一資源標識符(URI)或類似的例程铆隘。
  • decodeURIComponent(): decodeURIComponent() 函數(shù)可對 encodeURIComponent() 函數(shù)編碼的 URI 進行解碼。
  • 為什么要編碼:
    • 一般來說南用,URL只能使用英文字母膀钠、阿拉伯?dāng)?shù)字和某些標點符號,不能使用其他文字和符號裹虫。這是因為網(wǎng)絡(luò)標準RFC 1738做了硬性規(guī)定:"只有字母和數(shù)字[0-9a-zA-Z]肿嘲、一些特殊符號"$-_.+!*'(),"[不包括雙引號]、以及某些保留字筑公,才可以不經(jīng)過編碼直接用于URL雳窟。"
    • 這意味著,如果URL中有漢字,就必須編碼后使用封救。

8. 補全如下函數(shù)拇涤,判斷用戶的瀏覽器類型

var u = navigator.userAgent;
function isAndroid(){
  return u.indexOf('Android') > -1 || u.indexOf('Adr') > -1
}
funcnction isIphone(){
  return u.indexOf('iPhone') > -1
}
function isIpad(){
  return u.indexOf('iPad') > -1
}
function isIOS(){
  return !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
}
function isIE() {
  return u.indexOf('Trident') > -1
}
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市誉结,隨后出現(xiàn)的幾起案子鹅士,更是在濱河造成了極大的恐慌,老刑警劉巖惩坑,帶你破解...
    沈念sama閱讀 212,884評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件掉盅,死亡現(xiàn)場離奇詭異,居然都是意外死亡以舒,警方通過查閱死者的電腦和手機趾痘,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,755評論 3 385
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來蔓钟,“玉大人永票,你說我怎么就攤上這事±哪” “怎么了侣集?”我有些...
    開封第一講書人閱讀 158,369評論 0 348
  • 文/不壞的土叔 我叫張陵,是天一觀的道長佣谐。 經(jīng)常有香客問我肚吏,道長,這世上最難降的妖魔是什么狭魂? 我笑而不...
    開封第一講書人閱讀 56,799評論 1 285
  • 正文 為了忘掉前任罚攀,我火速辦了婚禮,結(jié)果婚禮上雌澄,老公的妹妹穿的比我還像新娘斋泄。我一直安慰自己,他們只是感情好镐牺,可當(dāng)我...
    茶點故事閱讀 65,910評論 6 386
  • 文/花漫 我一把揭開白布炫掐。 她就那樣靜靜地躺著,像睡著了一般睬涧。 火紅的嫁衣襯著肌膚如雪募胃。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 50,096評論 1 291
  • 那天畦浓,我揣著相機與錄音痹束,去河邊找鬼。 笑死讶请,一個胖子當(dāng)著我的面吹牛祷嘶,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 39,159評論 3 411
  • 文/蒼蘭香墨 我猛地睜開眼论巍,長吁一口氣:“原來是場噩夢啊……” “哼烛谊!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起嘉汰,我...
    開封第一講書人閱讀 37,917評論 0 268
  • 序言:老撾萬榮一對情侶失蹤丹禀,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后郑现,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體湃崩,經(jīng)...
    沈念sama閱讀 44,360評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡荧降,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,673評論 2 327
  • 正文 我和宋清朗相戀三年接箫,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片朵诫。...
    茶點故事閱讀 38,814評論 1 341
  • 序言:一個原本活蹦亂跳的男人離奇死亡辛友,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出剪返,到底是詐尸還是另有隱情废累,我是刑警寧澤,帶...
    沈念sama閱讀 34,509評論 4 334
  • 正文 年R本政府宣布脱盲,位于F島的核電站邑滨,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏钱反。R本人自食惡果不足惜掖看,卻給世界環(huán)境...
    茶點故事閱讀 40,156評論 3 317
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望面哥。 院中可真熱鬧哎壳,春花似錦、人聲如沸尚卫。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,882評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽吱涉。三九已至刹泄,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間怎爵,已是汗流浹背特石。 一陣腳步聲響...
    開封第一講書人閱讀 32,123評論 1 267
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留疙咸,地道東北人县匠。 一個月前我還...
    沈念sama閱讀 46,641評論 2 362
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親乞旦。 傳聞我的和親對象是個殘疾皇子贼穆,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 43,728評論 2 351

推薦閱讀更多精彩內(nèi)容