1、考察this

 
 

  
  
var length = 10; 
  
  
function fn() { 
  
  
  console.log(this.length); 
  
  
} 
  
  
 
  
  
var obj = { 
  
  
  length: 5, 
  
  
  method: function(fn) { 
  
  
    fn(); 
  
  
    arguments[0](); 
  
  
  } 
  
  
}; 
  
  
 
  
  
obj.method(fn, 1); 
 
 

 輸出：10 2

***次輸出10應(yīng)該沒有問題。我們知道取對象屬于除了點操作符還可以用中括號，所以第二次執(zhí)行時相當(dāng)于arguments調(diào)用方法，this指向arguments，而這里傳了兩個參數(shù)，故輸出arguments長度為2。

2、var和函數(shù)的提前聲明

 
 

  
  
function fn(a) { 
  
  
  console.log(a);  
  
  
  var a = 2; 
  
  
  function a() {} 
  
  
  console.log(a);  
  
  
} 
  
  
 
  
  
fn(1); 
 
 

 輸出：function a() {} 2

我們知道var和function是會提前聲明的，而且function是優(yōu)先于var聲明的(如果同時存在的話)，所以提前聲明后輸出的a是個function，然后代碼往下執(zhí)行a進行重新賦值了，故第二次輸出是2。

3、局部變量和全局變量

 
 

  
  
var f = true; 
  
  
if (f === true) { 
  
  
  var a = 10; 
  
  
} 
  
  
 
  
  
function fn() { 
  
  
  var b = 20; 
  
  
  c = 30; 
  
  
} 
  
  
 
  
  
fn(); 
  
  
console.log(a); 
  
  
console.log(b); 
  
  
console.log(c); 
 
 

 輸出：10 報錯 30

這是個我犯了很久的錯誤，很長一段時間我都以為{...}內(nèi)的新聲明的變量是局部變量，后來我才發(fā)現(xiàn)function內(nèi)的新聲明的變量才是局部變量，而沒有用var聲明的變量在哪里都是全局變量。再次提醒切記只有function(){}內(nèi)新聲明的才能是局部變量，while{...}、if{...}、for(..) 之內(nèi)的都是全局變量(除非本身包含在function內(nèi))。

4、變量隱式聲明 

 
 

  
  
var f = true; 
  
  
if (f === true) { 
  
  
  var a = 10; 
  
  
} 
  
  
 
  
  
function fn() { 
  
  
  var b = 20; 
  
  
  c = 30; 
  
  
} 
  
  
 
  
  
fn(); 
  
  
console.log(a); 
  
  
console.log(b); 
  
  
console.log(c); 
 
 

 答案：10

前面我說過function和var會提前聲明，而其實{...}內(nèi)的變量也會提前聲明。于是代碼還沒執(zhí)行前，a變量已經(jīng)被聲明，于是 'a' in window 返回true，a被賦值。

5、給基本類型數(shù)據(jù)添加屬性，不報錯，但取值時是undefined

 
 

  
  
var a = 10; 
  
  
a.pro = 10; 
  
  
console.log(a.pro + a); 
  
  
 
  
  
var s = 'hello'; 
  
  
s.pro = 'world'; 
  
  
console.log(s.pro + s); 
 
 

 答案：NaN undefinedhello

給基本類型數(shù)據(jù)加屬性不報錯，但是引用的話返回undefined，10+undefined返回NaN，而undefined和string相加時轉(zhuǎn)變成了字符串。

6、函數(shù)聲明優(yōu)于變量聲明 

 
 

  
  
console.log(typeof fn); 
  
  
function fn() {}; 
  
  
var fn; 
 
 

 答案：function

因為函數(shù)聲明優(yōu)于變量聲明。我們知道在代碼逐行執(zhí)行前，函數(shù)聲明和變量聲明會提前進行，而函數(shù)聲明又會優(yōu)于變量聲明，這里的優(yōu)于可以理解為晚于變量聲明后，如果函數(shù)名和變量名相同，函數(shù)聲明就能覆蓋變量聲明。所以以上代碼將函數(shù)聲明和變量聲明調(diào)換順序還是一樣結(jié)果。

7、判斷一個字符串中出現(xiàn)次數(shù)最多的字符，并統(tǒng)計次數(shù)

hash table方式：

 
 

  
  
var s = 'aaabbbcccaaabbbaaa'; 
  
  
var obj = {}; 
  
  
var maxn = -1; 
  
  
var letter; 
  
  
for(var i = 0; i < s.length; i++) { 
  
  
  if(obj[s[i]]) { 
  
  
    obj[s[i]]++; 
  
  
    if(obj[s[i]] > maxn) { 
  
  
      maxn = obj[s[i]]; 
  
  
      letter = s[i]; 
  
  
    } 
  
  
  } else { 
  
  
    obj[s[i]] = 1; 
  
  
    if(obj[s[i]] > maxn) { 
  
  
      maxn = obj[s[i]]; 
  
  
      letter = s[i]; 
  
  
    } 
  
  
  } 
  
  
} 
  
  
 
  
  
alert(letter + ': ' + maxn); 
 
 

正則方式：

 
 

  
  
var s = 'aaabbbcccaaabbbaaabbbbbbbbbb'; 
  
  
var a = s.split(''); 
  
  
a.sort(); 
  
  
s = a.join(''); 
  
  
var pattern = /(\w)\1*/g; 
  
  
var ans = s.match(pattern); 
  
  
ans.sort(function(a, b) { 
  
  
  return a.length < b.length; 
  
  
});; 
  
  
console.log(ans[0][0] + ': ' + ans[0].length); 
 
 

 8、經(jīng)典閉包

 
 

  
  
 
  
  
 
  
  
 
  
  
   ***個鏈接  
 
  
  
   第二個鏈接  
 
  
  
   第三個鏈接  
 
  
  
   第四個鏈接  
 
  
  
 
 
 

 dom污染法：

 
 

  
  
 
  
  
 
  
  
 
  
  
   ***個鏈接  
 
  
  
   第二個鏈接  
 
  
  
   第三個鏈接  
 
  
  
   第四個鏈接  
 
  
  
   
  
  
    var lis = document.links; 
  
  
    for(var i = 0, length = lis.length; i < length; i++) { 
  
  
      lis[i].index = i; 
  
  
      lis[i].onclick = function() { 
  
  
        alert(this.index); 
  
  
      }; 
  
  
    } 
  
  
   
  
  
 
 
 

 閉包：

 
 

  
  
 
  
  
 
  
  
 
  
  
   ***個鏈接  
 
  
  
   第二個鏈接  
 
  
  
   第三個鏈接  
 
  
  
   第四個鏈接  
 
  
  
   
  
  
    var lis = document.links; 
  
  
    for(var i = 0, length = lis.length; i < length; i++) { 
  
  
      (function(i) { 
  
  
        lis[i].onclick = function() { 
  
  
          alert(i + 1); 
  
  
        }; 
  
  
      })(i);  
  
  
    } 
  
  
   
  
  
 
 
 

 9、this

 
 

  
  
function JSClass() { 
  
  
  this.m_Text = 'division element'; 
  
  
  this.m_Element = document.createElement('div'); 
  
  
  this.m_Element.innerHTML = this.m_Text; 
  
  
  this.m_Element.addEventListener('click', this.func); 
  
  
  // this.m_Element.onclick = this.func; 
  
  
} 
  
  
 
  
  
JSClass.prototype.Render = function() { 
  
  
  document.body.appendChild(this.m_Element); 
  
  
} 
  
  
 
  
  
JSClass.prototype.func = function() { 
  
  
  alert(this.m_Text); 
  
  
}; 
  
  
 
  
  
var jc = new JSClass(); 
  
  
jc.Render();  // add div 
  
  
jc.func();  // 輸出 division element 
  
  
//click添加的div元素division element會輸出underfined，為什么？ 
 
 

 答案：division element undefined

***次輸出很好理解，第二次的話仔細看，this其實已經(jīng)指向了this.m_Element，因為是this.m_Element調(diào)用的addEventListener函數(shù)，所以內(nèi)部的this全指向它了?？梢栽囍由弦恍写athis.m_Element.m_Text = 'hello world'，就會alert出hello world了。

10、split

請編寫一個JavaScript函數(shù) parseQueryString，它的用途是把URL參數(shù)解析為一個對象，如： var url = “http://witmax.cn/index.php?key0=0&key1=1&key2=2″

 
 

  
  
function parseQueryString(url) { 
  
  
  var obj = {}; 
  
  
  var a = url.split('?'); 
  
  
  if(a === 1) return obj; 
  
  
  var b = a[1].split('&'); 
  
  
  for(var i = 0, length = b.length; i < length; i++) { 
  
  
    var c = b[i].split('='); 
  
  
    obj[c[0]] = c[1]; 
  
  
  } 
  
  
  return obj; 
  
  
} 
  
  
var url = 'http://witmax.cn/index.php?key0=0&key1=1&key2=2'; 
  
  
var obj = parseQueryString(url); 
  
  
console.log(obj.key0, obj.key1, obj.key2);  // 0 1 2 
 
 

分享名稱：2015年十大熱點javascript筆試題你都會么？
文章位置：http://uogjgqi.cn/article/djpepdo.html