28道JavaScript難題

時間 2019-12-05

原文原文鏈接

28道JavaScript難題（原文）

從基礎到進階，用於複習，提升深度，或者幫助你的 coding 面試！javascript

答案在問題下方的摺疊部分，點擊便可展開問題。祝你好運～java

1. 輸出是什麼？

["1", "2", "3"].map(parseInt)
複製代碼

答案

答案：[1, NaN, NaN]

解析：parseInt (val, radix) ：兩個參數，val值，radix基數（就是多少進制轉換）
     map 能傳進回調函數 3參數 (element, index, array)
     parseInt('1', 0);  //0表明10進制
     parseInt('2', 1);  //沒有1進制，不合法
     parseInt('3', 2);  //2進制根本不會有3
鞏固：["1", "1", "11","5"].map(parseInt) //[1, NaN, 3, NaN]  
複製代碼

2. 輸出是什麼？

[ [3,2,1].reduce(Math.pow), [].reduce(Math.pow) ]
複製代碼

答案

答案：an error

解析：Math.pow (x , y)  x 的 y 次冪的值
     reduce（fn,total）
     fn (total, currentValue, currentIndex, arr) 
         若是一個函數不傳初始值，數組第一個組默認爲初始值.
         [3,2,1].reduce(Math.pow)
         Math.pow(3,2) //9
         Math.pow(9,1) //9
     [].reduce(Math.pow)       //空數組會報TypeError
鞏固：[1].reduce(Math.pow)      //只有初始值就不會執行回調函數，直接返回1
     [].reduce(Math.pow,3)     //只有初始值就不會執行回調函數，直接返回1
     [2].reduce(Math.pow,3)    //傳入初始值，執行回調函數，返回9
複製代碼

3. 輸出是什麼？

[typeof null, null instanceof Object]
複製代碼

答案

答案：["object", false]

解析：null表明空對象指針，因此typeof判斷成一個對象。能夠說JS設計上的一個BUG
     instanceof 實際上判斷的是對象上構造函數，null是空固然不可能有構造函數
鞏固：null == undefined //true    null === undefined //flase
複製代碼

4. 輸出是什麼？

var name = 'World!';
(function () {
if (typeof name === 'undefined') {
    var name = 'Jack';
    console.log('Goodbye ' + name);
} else {
    console.log('Hello ' + name);
}
})();
複製代碼

答案

答案: Goodbye Jack

解析：（1）typeof時var name 在函數內部之聲明未定義
     （2）typeof優先級高於===
鞏固：
    var str = 'World!';   
    (function (name) {
    if (typeof name === 'undefined') {
        var name = 'Jack';
        console.log('Goodbye ' + name);
    } else {
        console.log('Hello ' + name);
複製代碼

5. 輸出是什麼？

var ary = [0,1,2];
ary[10] = 10;
ary.filter(function(x) { 
    return x === undefined;
}); 
複製代碼

答案

答案: ：[]

解析：filter() 不會對空數組進行檢測。會跳過那些空元素
鞏固：
      var ary = [0,1,2,undefined,undefined,undefined,null];
      ary.filter(function(x) { return x === undefined;});
      // [undefined, undefined, undefined] 
複製代碼

6. 輸出是什麼？

var two   = 0.2
var one   = 0.1
var eight = 0.8
var six   = 0.6
[two - one == one, eight - six == two]
複製代碼

答案

答案: [true, false]

解析：IEEE 754標準中的浮點數並不能精確地表達小數
鞏固：var two   = 0.2;
     var one   = 0.1;
     var eight = 0.8;
     var six   = 0.6;
     ( eight - six ).toFixed(4) == two 
     //true
複製代碼

7. 輸出是什麼？

function showCase(value) {
    switch(value) {
    case 'A':
        console.log('Case A');
        break;
    case 'B':
        console.log('Case B');
        break;
    case undefined:
        console.log('undefined');
        break;
    default:
        console.log('Do not know!');
    }
}
showCase(new String('A'));
複製代碼

答案

答案: Do not know!

解析：new String(x)是個對象
鞏固：下一題
複製代碼

8. 輸出是什麼？

function showCase2(value) {
    switch(value) {
    case 'A':
        console.log('Case A');
        break;
    case 'B':
        console.log('Case B');
        break;
    case undefined:
        console.log('undefined');
        break;
    default:
        console.log('Do not know!');
    }
}
showCase2(String('A'));
複製代碼

答案

答案: Case A

解析：String('A')就是返回一個字符串
複製代碼

9. 輸出是什麼？

function isOdd(num) {
    return num % 2 == 1;
}
function isEven(num) {
    return num % 2 == 0;
}
function isSane(num) {
    return isEven(num) || isOdd(num);
}
var values = [7, 4, '13', -9, Infinity];
values.map(isSane);
複製代碼

答案

答案: [true, true, true, false, false]

解析：es6

若是不是數值會調用 Number（）去轉化
'13' % 2       // 1
Infinity % 2  //NaN Infinity 是無窮大
-9 % 2        // -1
鞏固： 9 % -2        // 1 餘數的正負號隨第一個操做數
複製代碼

10. 輸出是什麼？

Array.isArray( Array.prototype )
複製代碼

答案

答案:true

解析：Array.prototype是一個數組數組的原型是數組，對象的原型是對象，函數的原型是函數面試

11. 輸出是什麼？

var a = [0];
if ([0]) {
  console.log(a == true);
} else {
  console.log("wut");
}
複製代碼

答案

答案:false

解析：[0]的boolean值是true 鞏固：a[0] 的boolean是 falsechrome

12. 輸出是什麼？

'5' + 3
'5' - 3
複製代碼

答案

答案: 53 2

解析：加號有拼接功能，減號就是邏輯運算數組

13. 輸出是什麼？

var ary = Array(3);
ary[0]=2
ary.map(function(elem) { 
    return '1'; 
});
複製代碼

答案

答案: ["1", empty × 2]

解析：若是沒有值，map會跳過不會執行回調函數app

14. 輸出是什麼？

function sidEffecting(ary) {
  ary[0] = ary[2];
}
function bar(a,b,c) {
  c = 10
  sidEffecting(arguments);
  return a + b + c;
}
bar(1,1,1)
複製代碼

答案

答案: 21,

解析：函數

// arguments會和函數參數綁定。
// 但若是es6賦給初始值則沒法修改
 function sidEffecting(ary) {
  ary[0] = ary[2];
}
function bar(a=1,b,c) {
  c = 10
  sidEffecting(arguments);
  return a + b + c;
}
bar(1,1,1)
//12
複製代碼

15. 輸出是什麼？

var a = 111111111111111110000,
b = 1111;
a + b;
複製代碼

答案

答案: 11111111111111111000

解析：在JavaScript中number類型在JavaScript中以64位（8byte）來存儲。ui

這64位中有符號位1位、指數位11位、實數位52位。spa

2的53次方時，是最大值。其值爲：9007199254740992（0x20000000000000）。超過這個值的話，運算的結果就會不對.

16. 輸出是什麼？

var x = [].reverse;
x();
複製代碼

答案

答案: window

解析：但在chrome上執行報錯，沒太懂

17. 輸出是什麼？

Number.MIN_VALUE > 0
複製代碼

答案

答案: true

解析：MIN_VALUE 屬性是 JavaScript 中可表示的最小的數（接近 0 ，但不是負數）。它的近似值爲 5 x 10-324。

18. 輸出是什麼？

[1 < 2 < 3, 3 < 2 < 1]
複製代碼

答案

答案: [true,true]

解析：

1 < 2    =>  true;
true < 3 =>  1 < 3 => true;

3 < 2     => false;
false < 1 => 0 < 1 => true;
複製代碼

19. 輸出是什麼？

(function(){
  var x = y = 1;
})();
console.log(y);
console.log(x);
複製代碼

答案

答案: 1, error

解析：y 被賦值成全局變量，等價於 y = 1 ; var x = y;

20. 輸出是什麼？

function foo() { }
var oldName = foo.name;
foo.name = "bar";
[oldName, foo.name]    
複製代碼

答案

答案: ["foo", "foo"]

解析：函數的名字不可變.

21. 輸出是什麼？

"1 2 3".replace(/\d/g, parseInt)     
複製代碼

答案

答案: "1 NaN 3"

解析：replace() 回調函數的四個參數: 一、匹配項
二、與模式中的子表達式匹配的字符串
三、出現的位置
四、stringObject 自己。

若是沒有與子表達式匹配的項，第二參數爲出現的位置，因此第一個參數是匹配項，第二個參數是位置

parseInt('1', 0)
 parseInt('2', 2)  //2進制中不可能有2
 parseInt('3', 4)
// 鞏固：
"And the %1".replace(/%([1-8])/g,function(match,a , b ,d){
  console.log(match +" "+ a + " "+ b +" "+d )
});
//%1 1 8 And the %1 
複製代碼

22. cool_secret 可訪問多長時間？

function f() {}
var parent = Object.getPrototypeOf(f);
f.name // ?
parent.name // ?
typeof eval(f.name) // ?
typeof eval(parent.name) // ? 
複製代碼

答案

答案: "f", "Empty", "function", error

解析：f的函數名就是f parent是f原型對象的名字爲"" , 先計算eval(f.name) 爲 f,f的數據類型是function eval(parent.name) 爲undefined, "undefined"

23. 輸出是什麼？

[,,,].join(",")
複製代碼

答案

答案: ",,"

解析：由於javascript 在定義數組的時候容許最後一個元素後跟一個, 因此這個數組長度是3，鞏固： [,,1,].join(".").length // 3

24. 輸出是什麼？

var a = Function.length,
b = new Function().length
a === b
複製代碼

答案

答案: false

解析：首先new在函數帶（）時運算優先級和.同樣因此從左向右執行 new Function() 的函數長度爲0 鞏固：function fn () { var a = 1; } console.log(fn.length) //0 fn和new Function()同樣

25. 輸出是什麼？

var min = Math.min(), max = Math.max()
min < max
複製代碼

答案

答案: false

解析： Math.min 不傳參數返回 Infinity, Math.max 不傳參數返回 -Infinity 無限集合之間不能比較大小。鞏固：Number.MAX_VALUE > Number.MIN_VALUE //true

26. 輸出是什麼？

function captureOne(re, str) {
  var match = re.exec(str);
  return match && match[1];
}
var numRe  = /num=(\d+)/ig,
    wordRe = /word=(\w+)/i,
    a1 = captureOne(numRe,  "num=1"),
    a2 = captureOne(wordRe, "word=1"),
    a3 = captureOne(numRe,  "NUM=2"),
    a4 = captureOne(wordRe,  "WORD=2");
[a1 === a2, a3 === a4]
複製代碼

答案

答案: [true, false]

解析：／g有一個屬性叫lastIndex，每次匹配若是沒有匹配到，它將重置爲0，若是匹配到了，他將記錄匹配的位置。咱們看一個簡單的例子吧。 var numRe = /num=(\d)/g; numRe.test("num=1abcwewe") //true numRe.lastIndex //5 匹配到num=1後在5的索引位置 numRe.exec("num=1") //fales 此次要從5的索引位置，開始匹配 numRe.lastIndex //0 上一次匹配失敗了numRe.lastIndex重製爲0

27. 輸出是什麼？

if ('http://giftwrapped.com/picture.jpg'.match('.gif')) {
    'a gif file'
  } else {
    'not a gif file'
  }
複製代碼

答案

答案: 'a gif file'

解析： String.prototype.match 接受一個正則, 若是不是, 按照 new RegExp(obj) 轉化。因此，並不會轉義，那麼 /gif 就匹配了 /.gif/ 鞏固：

if ('http://giftwrapped.com/picture.jpg'.indexOf('.gif')) {
    'a gif file'
} else {
    'not a gif file'
}
//'a gif file' 一樣的道理
複製代碼

28. 輸出是什麼？

function foo(a) {
  var a;
  return a;
}
function bar(a) {
    var a = 'bye';
    return a;
}
[foo('hello'), bar('hello')]
複製代碼

答案

答案: ["hello", "bye"]

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。

28道JavaScript難題