经典前端面试常见的 (9道)重点2

目录

1、token和jwt存在什么区别?

2、vue 案例当中form 表单中,经常用到的参数有哪些?

3.移动端300ms延迟问题怎么解决?

方法一、禁用缩放

方法二、更改默认的视口宽度

4.web 页面如何进行性能优化?

HTML优化

CSS优化

JavaScript优化

图片优化

其他优化方法

5 .请你说一下DOM事件模型和事件流 ?***重点

6、 v-model是什么?它的作用及原理是什么?

7、created和mounted的区别是什么?***重点​

8、请你描述一下你对$nextTick的理解?​

 9.callback,Promise,async&await三者的区别?  ***重点


1、token和jwt存在什么区别?

jwt最大的特点是密码的自我解译,自己分成三段,前后端使用通用的秘钥确认是否正确,按自己的理解jwt是token的一种,现在网上很多人认为token和jwt是不同的,最大的区别点是token可以存在后台的redis中,设置过期时间,作为中心化控制的工具,而jwt由于自身的特点,更灵活。


2、vue 案例当中form 表单中,经常用到的参数有哪些?

model 表单数据对象 object
rules 表单验证规则 object
label-width 表单域标签的宽度,例如 '50px'。作为 Form 直接子元素的 form-item 会继承该值。支持 auto string
label-suffix 表单域标签的后缀 string
inline 行内表单模式 boolean false
label-position 表单域标签的位置,如果值为 left 或者 right 时,则需要设置 label-width string right/left/top right
hide-required-asterisk 是否隐藏必填字段的标签旁边的红色星号 boolean false
show-message 是否显示校验错误信息 boolean true
inline-message 是否以行内形式展示校验信息 boolean false
status-icon 是否在输入框中显示校验结果反馈图标 boolean false
validate-on-rule-change 是否在 rules 属性改变后立即触发一次验证 boolean true
size 用于控制该表单内组件的尺寸 string medium / small / mini

重点:

参数 说明 类型 可选值 默认值
prop 表单域 model 字段,在使用 validate、resetFields 方法的情况下,该属性是必填的 string 传入 Form 组件的 model 中的字段
label 标签文本 string
label-width 表单域标签的的宽度,例如 '50px'。支持 auto string
required 是否必填,如不设置,则会根据校验规则自动生成 boolean false
rules 表单验证规则 object
error 表单域验证错误信息, 设置该值会使表单验证状态变为error,并显示该错误信息 string
show-message 是否显示校验错误信息 boolean true
inline-message 以行内形式展示校验信息 boolean
size 用于控制该表单域下组件的尺寸 string medium / small / mini

3.移动端300ms延迟问题怎么解决?

方法一、禁用缩放


既然大家都觉得缩放没有意义,那就提供一个属性去控制它。在HTML文档头部添加如下meta标签

<meta name="viewport" content="user-scalable=no">
<meta name="viewport" content="initial-scale=1,maximum-scale=1">

有一个小小的缺点需要说一下,由于图片和文字都是一比一的比例显示的,而且禁用了缩放功能。在某些情况下,需要放大某张图片或者某段文字,就是无法实现图片的双击放大了。(除非js脚本)

方法二、更改默认的视口宽度


还是在HTML文档头部添加如下meta标签

<meta name="viewport" content="width=device-width">

这个方法跟方法一有些许不一样,他将页面的宽度设置成了,与显示屏同宽。需要网站做响应式布局。否则显示效果极易受到影响。还有他没有禁止缩放功能,所以,你可以用双指操作来放大页面。
 

4.web 页面如何进行性能优化?

HTML优化

CSS优化

JavaScript优化

图片优化

其他优化方法

5 .请你说一下DOM事件模型事件流 ?***重点


DOM事件模型:分为捕获和冒泡。

事件流:一个事件发生之后,会在子元素和父元素之间传播。这种传播分为3个阶段。

(1)捕获阶段:事件从window对象自上而下向目标节点传播的阶段

(2)目标阶段:真正的目标节点正在处理事件的阶段。

(3)冒泡阶段:事件从目标节点自下而上向window对象传播的阶段


6、 v-model是什么?它的作用及原理是什么?

经典前端面试常见的 (9道)重点2

7、createdmounted的区别是什么?***重点经典前端面试常见的 (9道)重点2

8、请你描述一下你对$nextTick的理解?经典前端面试常见的 (9道)重点2

 9.callback,Promise,async&await三者的区别?  ***重点


1.callback 经过深层次的嵌套,会产生回调地狱,需手动检查err参数。
2.promise 通过链式调用,直接在 then 中返回一个 promise 来进行成功之后的回调函数,用 catch 来做错误处理。
3.async/await 则直接将其变成了同步的写法,既可以用.catch又可以用try-catch捕捉,简洁,可读性强,写法更加优雅 。
 

上一篇:spring内置工具类


下一篇:OpenStack核心组件—nova计算服务