阿里前端二面（笔试/机试）总结

 

这一轮答的并不理想，颇有可能挂掉。回来以后本身又答了一遍，没有参考任何资料，竟然所有答上了。

到底仍是本身的基本功不扎实，碰见没作过的东西，没有调试环境就慌了，再努力提升吧。

 

1、实现jsonp，传入URL，callback和callbackName 三个参数

 

我先说下思路，jsonp是借由script标签发起的跨域GET请求。服务器返回的是一段js脚本，返回后能够当即执行。经过调用前端预先准备好的回调函数来获取数据，进行下一步操做。

整个流程大概分为三个步骤：发起请求、执行服务器返回的script和垃圾回收。

须要注意的主要是服务器在调用函数的时候，咱们的函数未必是暴露在全局之下的，因此要作一个指向，并在操做完成后进行清理。

 1 var index = {
 2 
 3     doSomething: function() {
 4         console.log('ok')
 5     },
 6 
 7     jsonp: function(url, callbackName, callback) {
 8 
 9         var script = document.createElement('script')
10         var body = document.querySelecotor('body')
11 
12         script.src = url + '?type=jsonp&callbackName=' + callbackName
13         script.id = 'jsonp'
14         script.onload = callback
15 
16         window[callbackName] = index.doSomething
17 
18         body.appendChild(script)
19     }
20 }
21 
22 index.jsonp('http://www.sunken.me/content', 'doSomething', function(name, script) {
23     delete window[name]
24     script.parentNode.removeChild(script)
25 })

 

 

2、实现一个计时器timer，只暴露start、stop和reset方法

 

这里考察的主要是函数做用域的概念，经过var声明的变量是函数私有的，经过对象自己没法访问。

 1 function timer() {
 2 
 3     var second = 0
 4     var loop = null
 5 
 6     var clear = function() {
 7 
 8         if (loop !== null) {
 9 
10             clearInterval(loop)
11             loop = null
12         }
13     }
14 
15     this.start = function() {
16 
17         loop = setInterval(function() {
18 
19             console.log(second)
20             ++second
21 
22         }, 1000)
23     }
24 
25     this.stop = function() {
26         
27         clear()
28         loop = null
29     }
30 
31     this.reset = function() {
32 
33         second = 0
34         clear()
35     }
36 }
37 
38 // 启用timer
39 var t = new timer()
40 t.start()
41 
42 // 关闭timer
43 setTimeout(function() {
44     t.stop()
45 
46 }, 5000)

 

 

3、当点击页面连接时，验证连接是否在*.taobao.com下，若是不是弹出确认提示

 

这道题主要考察两个步骤，一是事件的绑定、处理。另外一个是字符串的验证，这里我使用了一个偷懒的作法，由于*.taobao.com应该出如今字符串首部。要考虑http/https和有http://和无几种状况

ES 6的String.contains() 方法也能够用来作包含验证。

 

 1 <a class="link" href="http://www.taobao.com">淘宝</a>
 2 <a class="link" href="http://www.jd.com">京东</a>
 3 
 4 <script>
 5     
 6 
 7 var link = document.getElementsByClassName('link')
 8 var listener = function(event) {
 9 
10     var e = event || window.event
11     var href = e.target.getAttribute('href')
12 
13     if (href.indexOf('.taobao.com') === -1) {
14 
15         var c = confirm('肯定离开吗')
16 
17         if (c === false) {
18 
19             e.preventDefault()
20             e.stopPropagation()
21         }
22     }
23 }
24 
25 // 绑定事件
26 for (var i = 0, len = link.length; i < len; i++) {
27 
28     link[i].addEventListener('click', listener, false)
29 }
30 
31 
32 
33 
34 </script>