BING
斯是陋室,唯吾芳馨
原创

经常会被问的那些垃圾 JavaScript 面试题

共 3,235 字,需阅读 8 分钟2017/04/18 下午7,059 次阅读

不定期更新,整理那些比较垃圾的 JavaScript 面试题,让面试官无法装逼,仅此而已。

#ES6模板解析器

在这里

#构造函数、类、原型、变量声明、函数基础

          
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
function Foo() { getName = function () { console.log(1) } return this } Foo.getName = function () { console.log(2) } Foo.prototype.getName = function () { console.log(3) } var getName = function () { console.log(4) } function getName() { console.log(5) } // 求输出结果 Foo.getName() getName() Foo().getName() getName() new Foo.getName() new Foo().getName() new new Foo().getName() // 分割线 --------------------------------------------- // 上面代码基本等同于 function getName() { console.log(5) } function Foo() { getName = function () { console.log(1) } return this } Foo.getName = function () { console.log(2) } Foo.prototype.getName = function () { console.log(3) } getName = function () { console.log(4) } // 执行过程 // Foo的静态属性 Foo.getName() // 全局getName函数 getName() // 未实例化,this指向window,window中的getName,即全局getName Foo().getName() // 全局getName,但由于Foo执行后全局的getName被重新赋值 getName() // 只是实例了一个子函数,没什么异样 new Foo.getName() // 实例化类,并执行原型上的方法 new Foo().getName() // 将原型上的方法再实例一次 new new Foo().getName()

#闭包和单线程

          
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
for(var i = 0; i < 5; i++) { console.log(i) } // 0 1 2 3 4 for(var i = 0; i < 5; i++) { setTimeout(function() { console.log(i) }, 1000 * i) } // 立即打印一个5,每隔一秒一个5 for(var i = 0; i < 5; i++) { (function(i) { setTimeout(function() { console.log(i) }, i * 1000) })(i) } // 0,+1s 1 +1s 2 +1s 3 +1s 4 for(var i = 0; i < 5; i++) { (function() { setTimeout(function() { console.log(i) }, i * 1000) })(i) } // 立即打印一个5,每隔一秒一个5(实际上闭包内没有形参,有的话就正常了) for(var i = 0; i < 5; i++) { setTimeout((function(i) { console.log(i) })(i), i * 1000) } // 0,1,2,3,4 同时定时器失效,因为函数体没return有效函数 setTimeout(function() { console.log(1) }, 0) new Promise(function executor(resolve) { console.log(2) for( var i = 0; i < 10000; i++ ) { i == 9999 && resolve() } console.log(3) }).then(function() { console.log(4) }) console.log(5) // 输出,执行顺序:同步 => 同步 => 同步 => 异步队列(Promise) => 异步队列(定时器) // 2 3 5 4 1

#函数的隐式转换

          
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
function fn() { return 20 } console.log(fn + 10) function fn() { return 20 } fn.toString = function() { return 10 } console.log(fn + 10) function fn() { return 20 } fn.toString = function() { return 10 } fn.valueOf = function() { return 5 } console.log(fn + 10)

#函数防抖和节流

          
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
//函数节流 const throttle = (fun, delay) => { let last = null return () => { const now = + new Date() if (now - last > delay) { fun() last = now } } } //实例 const throttleExample = throttle(() => console.log(1), 1000) //调用 throttleExample() throttleExample() throttleExample() //函数防抖 cosnt debouce = (fun, delay) => { let timer = null return () => { clearTimeout(timer) timer = setTimeout(() => { fun() }, delay) } } //实例 const debouceExample = debouce(() => console.log(1), 1000) //调用 debouceExample() debouceExample() debouceExample()

未完也不续了。

署名 - 非商业性使用 4.0 国际 https://surmon.me/article/43
5 / 5 条看法
访客身份
在下有一拙见,不知...
  • 132
    132🇨🇳CNBeihaiWindowsChrome

    给你打call~

  • bayestheorem
    Bayestheorem🇨🇳CNNanchangMac OSChrome

    很有意思的题目,收益了许多~ 感谢博主

  • Jooger
    Jooger🇨🇳CNBeijingWindowsChrome

    套总,你的缩略图都是从哪里找的?😵

    • Surmon
      Surmon🇨🇳CNShanghaiAndroidWeChat

      回复

      Google啊,侵权啦?🌚

    • Jooger
      Jooger🇨🇳CNBeijingWindowsChrome

      回复

      没有,我只是好奇😜