1. vue的生命周期,在运行时会调用哪几个钩子,
ajax
请求放在哪个生命周期中
2. Vue常用的指令
3. localstorage和sessionstorage的区别
4. 说一说你做的项目中最典型的一个,亮点是什么
5. 公司用的是Vue几
6. 在社团和实习中收获了什么
7. watch和computed的区别
8. 同步和异步
9. Get和Post的区别
10. Http返回的类型
11. 这三个月的实习中你有哪些成长
12. 学习前端有没有什么思路,有什么体系13. Vue中Dom是怎么挂载数据的
1. vue的生命周期,在运行时会调用哪几个钩子,ajax
请求放在哪个生命周期中
Vue生命周期是指vue实例对象从创建之初到销毁的过程,vue所有功能的实现都是围绕其生命周期进行的,在生命周期的不同阶段调用对应的钩子函数可以实现组件数据管理和DOM渲染两大重要功能
创建前:beforeCreate, 创建后:created
挂载前:beforeMount, 挂载后:mounted
更新前:beforeUpdate, 更新后:updated
销毁前:beforeDestroy, 销毁后:destroyed
生命周期钩子函数(11个)Function(类型),标注蓝色的那个是属于类型的意思。
beforeCreate Function 在实例初始化之后,数据观测 (data observer) 和 event/watcher 事件配置之前被调用。
created Function 在实例创建完成后被立即调用。在这一步,实例已完成以下的配置:数据观测 (data observer), 属性和方法的运算,watch/event 事件回调。然而,挂载阶段还没开始,$el 属性目前不可见。
beforeMount Function 在挂载开始之前被调用:相关的 render 函数首次被调用。
mounted Function el 被新创建的 vm.$el 替换,并挂载到实例上去之后调用该钩子。如果 root 实例挂载了一个文档内元素,当 mounted 被调用时 vm.$el 也在文档内。
beforeUpdate Function 数据更新时调用,发生在虚拟 DOM 打补丁之前。这里适合在更新之前访问现有的 DOM,比如手动移除已添加的事件监听器。该钩子在服务器端渲染期间不被调用,因为只有初次渲染会在服务端进行。
updated Function 由于数据更改导致的虚拟 DOM 重新渲染和打补丁,在这之后会调用该钩子。
activated Function keep-alive 组件激活时调用。该钩子在服务器端渲染期间不被调用。
deactivated Function keep-alive 组件停用时调用。该钩子在服务器端渲染期间不被调用。
beforeDestroy Function 实例销毁之前调用。在这一步,实例仍然完全可用。该钩子在服务器端渲染期间不被调用。
destroyed Function Vue 实例销毁后调用。调用后,Vue 实例指示的所有东西都会解绑定,所有的事件监听器会被移除,所有的子实例也会被销毁。该钩子在服务器端渲染期间不被调用。
errorCaptured(2.5.0+ 新增) (err: Error, vm: Component, info: string) => ?boolean 当捕获一个来自子孙组件的错误时被调用。此钩子会收到三个参数:错误对象、发生错误的组件实例以及一个包含错误来源信息的字符串。此钩子可以返回 false 以阻止该错误继续向上传播。
2. Vue常用的指令
例如v-for、v-if、v-show、v-bind。
3. localstorage和sessionstorage的区别
localstorage通过调用window.localStorage获得,sessionStorage通过 window.sessionStorage获得。两种storage存储具有相同的方法,都保存在客户端,不与服务端进行交互。sessionStorage仅在当前会话下生效,当你关闭页面或浏览器后你存储的sessionStorage数据会被清除。localStorage生命周期是永久,储存的信息是永远不会消失的,除非你自己主动清除localStorage信息。
生命周期不同:
localStorage创建存储数据后,除非手动删除数据,不然都会一直存储在浏览器中
sessionStorage创建存储数据后,页面刷新、同源打开其他页面,代码跳转能够访问到当前的seesionStorage。如果关闭浏览器,sessionStorage就会消失。实际上我们可以理解成一种会话机制。
应用场景不同:localStorage主要用于存储适合长期保存的数据,如token,搜索记录等等。
seesionStorage用于存储用户的敏感信息,只在当前会话中保存。如用户名等等。
4. 说一说你做的项目中最典型的一个,亮点是什么
5. 公司用的是Vue几
6. 在社团和实习中收获了什么
7. watch和computed的区别
computed是计算属性,依赖其它属性值,并且computed的值有缓存,只有它依赖的属性值发生改变,下一次获取的computed值才会重新进行计算computed的值。一般应用于数值计算,并且依赖其他数据的时候,使用computed,可以利用computed的缓存属性,避免每次取值的时候,都需要重新计算。
watch更多的是观察的作用,支持异步,类似于某种数据的监听回调,每当监听数据回调的变化才会执行回调以后的操作,watch一般应用于数据变化执行时异步或者开销较大的操作,这时使用watch,支持异步操作,限制我们执行该操作的频率,并在我们得到最终结果之前,设置中间状态,这些都是计算属性无法做到的。
8. 同步和异步
同步:在我们用JavaScript通过AJAX向服务器发送请求的时候,JavaScript 会等到服务器响应就绪才继续执行。如果服务器繁忙或缓慢,没有及时的响应消息,则JavaScript会一直等待,不会执行AJAX的onreadystatechange部分后面的代码,应用程序会挂起或停止。
可用于某些操作没有完成,则用户不能进行下一步操作的地方(使用不当会及其影响用户体验)异步:在JavaScript通过AJAX向服务器发送请求的时候,JavaScript会同时执行AJAX的onreadystatechange部分后面的代码
通过 AJAX,JavaScript 无需等待服务器的响应,而是:
在等待服务器响应时执行其他脚本
当响应就绪后对响应进行处理
9. Get和Post的区别
- GET是通过URL方式请求,可以直接看到,明文传输
- POST是通过请求header请求,可以开发者工具或者抓包可以看到,同样也是明文的
- GET请求会保存在浏览器历史纪录中,还可能会保存在Web的日志中
- GET后退按钮/刷新无害,无副作用; POST数据会被重新提交(浏览器应该告知用户数据会被重新提交)。
- GET书签可收藏,POST为书签不可收藏。
- GET能被缓存,POST不能缓存 。get相当于查询,缓存有效果;post相当于增删改,每次的数据不一样,缓存没有作用)
- GET编码类型application/x-www-form-url,POST编码类型encodedapplication/x-www-form-urlencoded 或 multipart/form-data。为二进制数据使用多重编码。
- GET历史参数保留在浏览器历史中。POST参数不会保存在浏览器历史中。
- GET对数据长度有限制,当发送数据时,GET 方法向 URL 添加数据;URL 的长度是受限制的(URL 的最大长度是 2048 个字符)。POST无限制。
- GET只允许 ASCII 字符。POST没有限制。也允许二进制数据。
- 与 POST 相比,GET 的安全性较差,因为所发送的数据是 URL 的一部分。在发送密码或其他敏感信息时绝不要使用 GET !POST 比 GET 更安全,因为参数不会被保存在浏览器历史或 web 服务器日志中。
- GET的数据在 URL 中对所有人都是可见的。POST的数据不会显示在 URL 中。
10. Http返回的类型
一些常见的http状态返回代码为:
200 - 服务器成功返回网页
404 - 请求的网页不存在
503 - 服务不可用http状态返回代码 1xx(临时响应)
表示临时响应并需要请求者继续执行操作的状态代码。http状态返回代码
代码 说明
100 (继续) 请求者应当继续提出请求。服务器返回此代码表示已收到请求的第一部分,正在等待其余部分。
101 (切换协议)请求者已要求服务器切换协议,服务器已确认并准备切换。http状态返回代码 2xx(成功)
表示成功处理了请求的状态代码。http状态返回代码
代码 说明
200 (成功) 服务器已成功处理了请求。 通常,这表示服务器提供了请求的网页。
201 (已创建) 请求成功并且服务器创建了新的资源。
202 (已接受) 服务器已接受请求,但尚未处理。
203 (非授权信息) 服务器已成功处理了请求,但返回的信息可能来自另一来源。
204 (无内容) 服务器成功处理了请求,但没有返回任何内容。
205 (重置内容)服务器成功处理了请求,但没有返回任何内容。
206 (部分内容) 服务器成功处理了部分 GET 请求。http状态返回代码 3xx(重定向)
表示要完成请求,需要进一步操作。 通常,这些状态代码用来重定向。http状态返回代码
代码 说明
300 (多种选择) 针对请求,服务器可执行多种操作。 服务器可根据请求者 (user agent) 选择一项操作,或提供操作列表供请求者选择。
301 (永久移动) 请求的网页已永久移动到新位置。 服务器返回此响应(对 GET 或 HEAD 请求的响应)时,会自动将请求者转到新位置。
302 (临时移动) 服务器目前从不同位置的网页响应请求,但请求者应继续使用原有位置来进行以后的请求。
303 (查看其他位置) 请求者应当对不同的位置使用单独的GET 请求来检索响应时,服务器返回此代码。304 (未修改)自从上次请求后,请求的网页未修改过。 服务器返回此响应时,不会返回网页内容。
305 (使用代理) 请求者只能使用代理访问请求的网页。如果服务器返回此响应,还表示请求者应使用代理。
307 (临时重定向) 服务器目前从不同位置的网页响应请求,但请求者应继续使用原有位置来进行以后的请求。http状态返回代码4xx(请求错误)
这些状态代码表示请求可能出错,妨碍了服务器的处理。http状态返回代码
代码 说明
400 (错误请求) 服务器不理解请求的语法。
401 (未授权) 请求要求身份验证。对于需要登录的网页,服务器可能返回此响应。
403 (禁止) 服务器拒绝请求。
404 (未找到) 服务器找不到请求的网页。
405 (方法禁用) 禁用请求中指定的方法。
406 (不接受)无法使用请求的内容特性响应请求的网页。
407 (需要代理授权) 此状态代码与401(未授权)类似,但指定请求者应当授权使用代理。
408 (请求超时) 服务器等候请求时发生超时。
409 (冲突) 服务器在完成请求时发生冲突。 服务器必须在响应中包含有关冲突的信息。
410 (已删除) 如果请求的资源已永久删除,服务器就会返回此响应。
411 (需要有效长度)服务器不接受不含有效内容长度标头字段的请求。
412 (未满足前提条件)服务器未满足请求者在请求中设置的其中一个前提条件。
413 (请求实体过大)服务器无法处理请求,因为请求实体过大,超出服务器的处理能力。
414 (请求的 URI 过长) 请求的URI(通常为网址)过长,服务器无法处理。
415 (不支持的媒体类型)请求的格式不受请求页面的支持。
416 (请求范围不符合要求)如果页面无法提供请求的范围,则服务器会返回此状态代码。
417 (未满足期望值)服务器未满足"期望"请求标头字段的要求。http状态返回代码5xx(服务器错误)
这些状态代码表示服务器在尝试处理请求时发生内部错误。 这些错误可能是服务器本身的错误,而不是请求出错。http状态返回代码
代码 说明
500 (服务器内部错误) 服务器遇到错误,无法完成请求。
501 (尚未实施) 服务器不具备完成请求的功能。例如,服务器无法识别请求方法时可能会返回此代码。
502 (错误网关)服务器作为网关或代理,从上游服务器收到无效响应。
503 (服务不可用)服务器目前无法使用(由于超载或停机维护)。 通常,这只是暂时状态。
504 (网关超时) 服务器作为网关或代理,但是没有及时从上游服务器收到请求。
505 (HTTP 版本不受支持) 服务器不支持请求中所用的HTTP 协议版本。
11. 这三个月的实习中你有哪些成长
12. 学习前端有没有什么思路,有什么体系