[ Front-End ] Javascript 面試考題

The Good Parts of Javascript

這不是作業，也不是 take home exam。

也跟 O'Reilly 的書無關，只是最近在看這本，據說是本好書。


這是小弟在應徵工作時碰到的 JS考題。

免試早已經結束，只是當時有用手機將考題拍下來。

由於公司也沒告訴我正確答案(筆試)，試卷他們收走。

後面附上一些強者作答之後的解答。

如果有異議，想進一步討論，歡迎 leave comments 在最底下。





1. which is equl to the condition

if( ua !== 'IE 6'&& ua != 'IE 7')

A) if( ua === 'IE 6' || ua === 'IE 7')
B) if( ua === 'IE 6' && ua === 'IE 7')
C) if( !( ua === 'IE 6'|| ua === 'IE 7') )
D) if( !( ua === 'IE 6'&& ua === 'IE 7') )

C
這題要先從 statement 的反面下手
不等於 改成 等於
且 改成 或
用中文解釋的話就是 ua不是IE6且ua不是IE7 的反面是 ua是IE6或ua是IE7
最後再否定他 就是否定的否定=肯定
這個好像叫做 迪摩根定理


2. Which is false ?

A) 1 == '1'
B) NaN == NaN
C) 1 == [1]+[]
D) undefind === undefined


B，，純粹就是考知不知道 NaN == NaN  這個特例。


3. Which is true ?

A) 1=== true
B) Number('1px')
C) typeof [1,2,3] == 'array'
D) '0'


        A 是 false
        B 是 NaN
        C 是 typeof [1,2,3] 是 object  （in all browser and nodejs）
        D 是 string

        嚴格來說是無解




4. What is b :

   var a = [ 1, 2, 3 ];
   var b = a;

   a.push(5);
   console.log(b)

[1,2,3,5]

object 與 array 都是傳址
array 可以呼叫 .slice(0) 進行複製

object 要透過迴圈



5. Please answer below two "this"?

   $('#foo').on('click', function(e){
    console.log( this );  //What is this ?
    setTimeout( function(){
      console.log( this );  //What is this ?
    }, 1000}
   })

        假設是 jQuery 的前提下

        第一個 this 是 #foo ，因為 jQuery 是這樣設計的。

        第二個 this 是 global (在 browser 環境下是 window )

6. How can get the 'hello':
   var obj = { 1: 'hello', 2: 'world'}

   A) obj.1
   B) obj[0]
   C) obj[1]
   D) obj.2

         C， obj.1 不能用是因為不能用數字開頭

        像你不能 var 1abc = 5 是一樣的。


7.Please answer all below typeof:

  typeof function(){}
  typeof new Date()
  typeof {}
  typeof new Array()


        function
        object
        object
        object



8.What do you think foo() is ?

  if(1) function foo(){ return 'a'}
  else function foo(){ return 'b'}

  console.log( foo() )


        這題考得是 function scope ，這題就蠻有深度了。
        答案是不管 if else 寫殺小，

        function 都會定義，所以一定是 'b'。

        這題是很不錯得題目，能答對這題的一定都對 JS 很有 sense。


        跟這題對稱的題目是

        var foo ;
        if(1) {
                foo = function(){ return 'a'}
        }
        else {
                foo = function(){ return 'b'}
        }
        console.log( foo() )

        這時答案就會是 a


9.What is the console.log output?
  function foo(){
     return this;
  }
  console.log( foo.call( foo ) )

        function foo

        call 會 change context (this)


10.Please explain what is the difference between "setTimeout()" and
   "setInterval()" ?

        setTimeout(fn,duration) 是一次性的

        setInterval(fn,duration) 是每隔 duration 會觸發的


11.Please explain what the use of "preventDefault()" and ""stopPropagation()"
   in Event Object ?


preventDefault 是取消 event 的預設行為
像是對 <a> click 會造成換頁、<input type="submit">會送出表單之類

stopPropagation()是阻止事件向更上層的元素傳播
像是巢狀的 div 標籤
<div id="first">
        <div id="second">
                <div id="third">Click me!</div>
        </div>
</div>


以上就這幾題，

透露一下，這是某美商分公司出的題


目前參考答案為 TonyQ 與 s25g5d4 兩位熱心的強者作答。