持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第3天,点击查看活动详情
今天复习计划,主要是以算法为主。又重复刷了之前做的一些简单难度的题,感觉还是好难>-<
一.前端知识
1.移动端适配
1.1 Rem与em
- em的计算基于父组件的fontSize
- rem计算基于根组件fontSize
假设我们的设计稿为750px,则rem的计算公式:
document.documentElement.style.fontSize = document.documentElement.clientWidth / 10 + 'px';
为了避免手动计算设计稿上的px,可以使用vsCode插件px2rem进行转换。
1.2 使用gti CI/CD(持续集成/持续部署)进行自动化部署
- 前端项目配置 .gitlab-ci.yml
- web服务器配置 gitlab runner
- 连接git仓库与gitlal runner
当代码推到git仓库,gitlab runner会拉取仓库代码并执行.gitlab-ci.yml里配置的ssh脚本进行打包、复制打包文件至指定文件夹。
2. CJS 和 ESM
拷贝与引用
CJS模块导入的值为拷贝,不会随着导出模块的值得变化而变化。
ESM导入的值为引用,当导出模块的值发生变化,导入的值也会产生变化。
静态与动态
v8引擎拿到js代码后会边编译边执行,在编译的时候v8就给import导入的模块建立静态的引用,ESM的引用是静态的,并且不能在运行时更改,所以import必须放在文件开头,不能放在语句中间。
CJS的引用是动态的,只有在运行时才会对值进行拷贝。所以require可以放在任何地方。
异步与同步
ESM为异步加载,CJS为同步加载。
3. CSS
3.1 盒模型
盒模型从外到里:margin-border-padding-content
标准盒模型与IE盒模型的区别:标准盒模型的witdh与height只包含content。
IE盒模型则稍有不同,会包含pading与border。设置的方法:box-size: content-box/border-box
3.2 居中的方法
- flex:
align-items: center
justify-content: center
- positon与translate
position: absolute
left: 50%
top: 50%
transform: traslate(50%,50%)
- position
position: absolute;
width: 100px;
height: 100px;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
- 文字居中
text-align: center;
line-height: 200px;
二.算法
最大子数组和
定义pre以及max进行循环比较即可。
找到所有数组中消失的数字
回文链表
难点在于如果获取链表尾部的节点的值与头部节点的值做比较
三.面经
暂无
四.其他
健身打卡:
英语打卡: