无顺序问题
1. 自我介绍
- 实习时遇到的困难有哪些?? 遇到什么难解的bug么?
- 项目 移动端 有哪些适配?? 你对 postcss-pxtorem 以及 amfe-flexible有啥了解不?
移动端的适配可以有: 百分比、动态生成viewport、rem、@media(媒体监听),以及各种插件;
百分比:
只能宽度适配吧,以 百分号 为单位
动态生成viewport:
动态设置缩放比例,动态创建meta标签,并且计算出来的缩放放在这个标签的content属性里,以 px 为单位
rem:
首先要设置视口约束
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
其主要就是 html 根元素字体大小设置屏幕区域的宽度,这样整个屏幕就变成了1rem为基准,设置时以 rem 为单位。一般font-size的基数为设备的1/10
- 看你使用axios进行token的过期验证,请问返回的token的类型是什么样的??
token 是服务端生成的一串 字符串 ,客户端在后续请求中 只需带上这个 token 请求数据即可,无需再次带上用户名与密码。
服务器返回401时,表示token过期,要重新进行登录设计
- 微信九宫格咱们布局?? 要是是4张图片呢?? 1~9张图片
在网上以及 gpt 查了下,主要可以用flex、grid、float 进行布局,具体代码如下:
<div class="container">
<div class="c-item"> 1</div>
<div class="c-item"> 1</div>
</div>
css样式 --- grid
.container {
display: grid;
grid-template-colums: repeat(3, 1fr); // 3列布局
grid-gap: 10px;
}
.c-item {
width: 100%;
padding: 20px;
text-align: center; // 文本居中对齐
border: 1px solid #ccc;
}
grid-template-columns 用来设置每一行中单个元素的宽度
grid-template-rows 用来设置每一列中单个元素的高度
grid-gap 用来设置盒子之间的间距
css样式 --- flex
.container {
display: flex;
flex-warp: wrap;
width: 100%;
height: 100%;
}
.c-item: {
width: 30%;
height: 30%;
}
但是存在一个问题: 就是如果只有一张图片,那么该图片只占父盒子高度的30%,那会与下部分的内容呈现很大的间距,有些不好看。
css样式 --- float
.container {
width: 100%;
height: 100%;
overflow: hidden;
}
.c-item {
float: left;
width: 33%;
height: 33%;
}
需要给父盒子设置宽度,然后给每个盒子也设置宽高,达到自动换行的效果;
由于子元素浮动,因此要给父盒子加上overflow , 消除浮动带来的影响。
- react与vue的异同点?
- 你用过react的哪些hooks?
- 闭包你用过么?? 你有自己弄过闭包么?
- 使用过keep-alive么?
- vue的双向数据绑定?
- tcp与upd的异同点?
- tcp为什么要进行三次握手?
- 你用过什么打包工具?? webpack你是自己配置?? 还是使用的模板??
- 性能优化你坐过哪些?? 又了解哪些??
- 精灵图与base64的不同,差异又在哪?? base64 是服务器传过来的??
- 箭头函数与普通函数的区别?? 普通函数的this指向哪里? 箭头函数的this 指向哪里?? 你确定么?
手撕冒泡排序。这个虽然代码写出来了,但是思想不对,问的时候还没反应过来 啥是冒泡排序。
不错,又是一次面试的经验!! 继续学习!