哦加哦一面
第一次电话面试,被面试官虐惨了,以后电话面试一定要准备好两样东西。。。
第一,一个安静的环境
第二,一支笔和一个草稿本
晚上7点开始,骑车在回寝的路上接到了面试官的电话,在瑟瑟寒风中开始了第一次电面
1,自我介绍
2,ES6
常用的let,const,解构赋值,箭头函数,promise,map函数等
其中promise用于优雅地处理异步请求,面试官问,如何在两个请求都响应结束后再操作数据
let httpOne = new Promise((resolve,reject)=>{
if(请求成功){
resolve(res)
}else{
reject(err)
}
})
httpOne.then(promise异步请求2).then(数据操作).catch(err=>{})
---------------------------------------------------------------------------------------
//或者
let p1 = new Promise(...)
let p2 = new Promise(...)
Promise.all([p1,p2]).then(values=>{...}).catch(err=>{...})
promise常用api
- promise.all()
- promise.resolve()
- promise.reject()
- promise.then()
- promise.catch()
map
map的用法与forEach的区别
map与forEach差别不大,map和forEach方法,都是遍历数组,接收value和index,区别在于map的速度会快于forEach,且map函数可以有返回值,而且返回的是一个新的数组,forEach没有
3,如何删除对象数组中拥有指定属性的数组元素
没答上来,好尴尬,不过面试官人很好,给了我很多思考的时间,但是当时怎么也想不起hasOwnproperty的用法了。。。
其实还可以用in操作符,判断一个对象中是否存在指定属性,例如
var arr = [{a:1},{b:2},{c:3}]
arr.map((value)=>{
console.log('a' in value)
})
true
false
false
还可以用Object.keys(obj),返回一个属性数组
Object.values(obj),返回该对象中的属性值
问题第一种解决方案,使用delete
arr.forEach((value,index)=>{
if(value.hasOwnProperty('指定属性') || Object.prototype.hasOwnProperty.call(value,'指定属性')){
//注意,此处不能直接使用splice和index来删除数组中的元素否则数组长度会减小,影响后面的操作
//这里可以使用delete方法来进行删除操作,delete不会改变数组的长度,删除元素后用一个undefined占位,返回的时候清除
delete arr[index]
}
})
第二种解决方案,取而不删,使用filter方法
filter方法是ES6提供的新方法,遍历数组返回条件函数中符合条件的元素
arr.filter(value=>{
//若返回true,则取出值,若为false,则过滤掉
return value.hasOwnProperty('指定属性')
})
4,vue的生命周期
vue生命周期当时没有答全,的确是对生命周期理解不够透彻造成的,以下是生命周期详解
- beforecreated (未挂载el,未初始化data)
- created (未挂载el,初始化data)
- beforeMount (完成了data和el的初始化)
- mounted (完成挂载)
- beforeUpdate (数据实例改变之前,先占坑)
- update (完成更新状态)
- beforeDestroyed (销毁之前)
- Destoryed (销毁)
生命周期使用
beforecreate : 举个栗子:可以在这加个loading事件 (可以的)
created :在这结束loading,还做一些初始化,实现函数自执行
mounted : 在这发起后端请求,拿回数据,配合路由钩子做一些事情
beforeDestory: 你确认删除XX吗?
destoryed :当前组件已被删除,清空相关内容
5,前端性能优化
这里主要问了CDN加速的原理
CDN加速将网站的内容缓存在网络边缘(离用户接入网络最近的地方),然后在用户访问网站内容的时候,通过调度系统将用户的请求路由或者引导到离用户接入网络最近或者访问效果最佳的缓存服务器上,有该缓存服务器为用户提供内容服务;相对于直接访问源站,这种方式缩短了用户和内容之间的网络距离,从而达到加速的效果。
6,微信小程序与普通开发的区别
- 微信小程序是单向绑定。而vue存在v-model这种双向绑定的指令与特性,微信小程序只能通过this.setData来改变数据
- 微信小程序对原生的js表达式不支持。
7,http1.0和http2.0的区别
http2.0是一次大版本的升级,相比http1.0,http1.1有以下优点
- http2.0使用了多路复用的技术,做到同一个连接并发处理多个请求。
(多路复用:同一个信道传输多路信号。(信道:网络中的传输媒介)) - http2.0对header数据进行了压缩,使得在网络传输中更快捷
- http2.0的服务器推送功能,服务器接收到请求之后,返回请求需要的资源同时,推送一些客户端必要的的静态资源如(stylesheets.css)
8,http和https的区别
介绍:http以明文方式传输数据内容,不提供任何的加密机制,因此不适合用来传输一些重要信息。
https全称超文本传输安全协议,在http的基础上加入了SSL协议,SSL协议基于证书来验证服务器的身份,从而为浏览器和服务器的通信加密
详解
SSL全称安全套接层(Secure Sockets Layer),其证书中包含了很多信息,包括证书的颁发机构,证书的过期时间等
客户端通过TLS(Transport Layer Secure)传输层安全协议,来解析证书,若发现证书异常则弹出一个警告框,提示证书存在问题
否则,TLS生成一个随机值,客户端与服务端皆通过此随机值来进行通信,对传输内容加密。
9,CORS原理
CORS全称 跨域资源共享 ,服务端返回的 Access-Control-Allow-Origin: * 表明,该资源可以被任意 外域 (或者说 源 )访问。