腾讯一面
1.自我介绍!!!
下次一定要好好准备准备!!!
您好,我叫刘晶霞,来自华南理工大学广州学院软件专业,今天面试的岗位为前端实习生。
我认为我是一个比较善于沟通、性格开朗并且有较强的自我管理能力和学习能力的人。
在学习上能保持学习热情,成绩排名连续班级第一,全级前三。在工作中,能与同学进行有效沟通
并一起进步。我从18年开始接触前端知识,做过几次与前端有关的项目,对前端职业有比较浓厚的热
爱,也想经过此次面试将我在校所学的知识都有用武之地。
2.在这么多的项目中你最熟悉的是什么?
追问:能详细说一下吗?
我最熟悉的项目为:外聘教师月报表系统。
这个项目是给教务员和教务处所使用的一个系统。每个学院的教务员每个月登录此系统对该学院
的所有外聘教师进行一个教学时间的汇总,填好之后通过此系统提交到教务处,最终教务处可以对各个学院所提交的信息进行汇总。
3.能详细说明一下你是怎么通过设置请求头和ajax添加随机数解决了缓存问题吗?
追问:使用了标准http请求头之后还是会偶现数据没更新对吗?有没有考虑过可能是说因为你之前没有加过头,后面加了以后浏览器又把之前的头给缓存下来了呢?
让html不缓存?设置no-cache让html每次都去请求服务器,所以浏览器每次都能拿到最新的html资源。
首先一开始我们的项目没有进行任何有关缓存的操作,当我们更新版本之后出现了服务端数据更改但前台页面未更改的情况。之后通过设置http1.1新增的请求头cache-control为no-cache,使得浏览器强制确认缓存,就是走协商缓存的道路,让服务器去判断缓存是否过期,若未过期则返回304浏览器使用本地缓存内容,若过期返回200,浏览器向服务器请求最新资源。
与此同时,我们考虑到一些服务器资源(js、css)更改,浏览器无法得知的情况下。我们通过对html设置不缓存,但是对于js、css等相应的资源路径添加版本号去解决这个问题。
ajax缓存是get请求照成的,当ajax请求的路径、参数未改变,则浏览器会读取本地缓存。所以我们通过在ajax请求路径加入随机数解决了这个问题。使得每次发起ajax请求都会向服务器拉取最新数据。
(no-cache其实也就解决了ajax缓存问题)
4.在这个项目中有没有用到登录这个功能?
追问:怎么实现登录呢?
追问:让你做一个登录的页面,你会怎么做呢?(比如登录之后,我去请求购物车,为什么我能返回来的是自己的购物车,而不是别人的?)
使用token......
当用户点击登录之后,将用户名和密码传送到服务器。服务器验证成功之后生成token返回给前台。前台拿到token使用cookie、localStorage或sessionStorage进行存储,之后每次的请求都将这个token传递给后台。
基于token机制的身份认证
使用token机制的身份验证方法,在服务器端不需要存储用户的登录记录。大概的流程:
- 客户端使用用户名和密码请求登录。
- 服务端收到请求,验证用户名和密码。
- 验证成功后,服务端会生成一个token,然后把这个token发送给客户端。
- 客户端收到token后把它存储起来,可以放在cookie或者Local Storage(本地存储)里。
- 客户端每次向服务端发送请求的时候都需要带上服务端发给的token。
- 服务端收到请求,然后去验证客户端请求里面带着token,如果验证成功,就向客户端返回请求的数据。(如果这个 Token 在服务端持久化(比如存入数据库),那它就是一个永久的身份令牌。)
5.假设界面显示价格为9.99元,现在我去拉取了后台的价格,现在数据为8.88元。当你把数据设置为8.88后再到页面显示成8.88元。在这个期间你了不了解vue帮你做了什么事情?
双向数据绑定+发布订阅者监听+虚拟dom(diff算法)
当我们的数据发生更新时,就会触发响应式数据的set方法。当赋值触发set
时,首先会检测新值和旧值,若不相同则将新值赋值给旧值;如果新值是对象则将它变成响应式的;最后让对应属性的依赖管理器使用dep.notify
发出更新视图的通知(将收集起来的watcher
挨个遍历触发update
方法)。
执行update
方法时将当前watcher
实例传入到定义的queueWatcher
方法内,这个方法的作用是把将要执行更新的watcher
收集到一个队列queue
之内,保证如果同一个watcher
内触发了多次更新,只会更新一次对应的watcher。比如data中有num、name、sex三个响应式属性,它们都是同一个渲染watcher,当num++100次的情况下,再将当前的渲染
watcher
推入到的队列之后,之后赋值触发的set
队列内并不会添加任何渲染watcher
;当同时赋值多个属性时也是,因为它们收集的都是同一个渲染watcher
,所以推入到队列一次之后就不会添加了。
首先会将queue
这个队列进行一次排序,依据是每次new Watcher
生成的id
,以从小到大的顺序。当前示例只是做渲染,而且队列内只存在了一个渲染watcher
,所以是不存在顺序的。但是如果有定义user watcher
和computed watcher
加上render watcher
后,它们之间就会存在一个执行顺序的问题了。(知识点:watcher
的执行顺序是先父后子,然后是从computed watcher
到user watcher
最后render watcher
,这从它们的初始化顺序就能看出。)
然后就是遍历这个队列,因为是渲染watcher
,所有是有before
属性的,执行传入的before
方法触发beforeUpdate
钩子。最后执行watcher.run()
方法,执行真正的派发更新方法。执行run就是重新执行了一次this.get()
方法,让vm._update(vm._render())
再走一遍而已。然后生成新旧VNode
,最后进行diff
比对以更新视图。
6.用过哪些es6语法?
追问:数组里面新加的方法你有用过哪些?
7.https(传输过程是安全的,但是怎么解决密钥本身是安全的呢?使用证书的机制解决这个问题)
最后一道编程题:
三次重试:假设有一个函数名为job,调用job后会执行一些异步任务,并返回一个Promise,但job执行的异步任务任务有可能会失败
请实现函数retry,把job作为retry函数的参数传入,当retry执行后会尝试调用job,如果job返回成功(即Promise fulfilled),则retry函数返回job函数的返回内容;
如果job返回失败(即Promise rejected),retry函数会再次尝试调用job函数。
如果job连续三次均返回失败,retry则不再尝试调用,并返回其最后一次失败的内容。
或者
function job() { return new Promise(function (resolve, reject) { setTimeout(function () { var num = Math.ceil(Math.random() * 20); //生成1-10的随机数 console.log('随机数生成的值:', num) if (num <= 10) { console.log('符合条件,值为' + num) resolve(num); } else { reject('数字大于10了执行失败'); } }, 2000); }) } async function retry(job, times) { for (let i = 0; i < times; i++) { try { return await job(); break; } catch(err){ if(i == times-1){ return err; } } finally { console.log('还有', times - i - 1, '次机会'); } } } retry(job, 3).then(num => { console.log(num) })
1.考研?
2.fastClick原理
3.点击穿透
4.图片懒加载原理(节流是什么)
5.介绍一下mvvm(从双向绑定原理开始讲)
6.使用闭包实现变量自加一
7.setTimeout第二个参数为0时和匿名自执行函数区别
8.微任务有哪些?
9.你是怎么压缩图片的?
10.你是怎么实现瓦片绘制的?为什么在ios下会出现200万像素绘制不了的情况?
10.数组和链表的区别?
来源:https://www.cnblogs.com/ahaMOMO/p/12369125.html