type
status
date
slug
summary
tags
category
titleIcon
password
icon
calloutIcon
ajax/xhr/fetch/axios
web1.0纯浏览
web2.0用户提交表单内容
节流防抖
px % em rem vw vh
子绝父相 left top 50% transform: translate(-50%， -50%）居中
箭头函数
window {} undefined
对象只有普通函数可以获取自身属性
Vue是个对象 对象方法不能用箭头函数 React class可以
class里可以用
三次握手四次挥手
for in/for of
字符串 数组 arguments dom for of √
对象的key可以直接拼接成一个数组 属于可迭代 for of需要直接遍历过一次才能得到，不属于直接可迭代 所以对象只能 for in
MapSetGenerator只能获取值，所以只能for of 对于Map Set等key只是伪下标，尤其是map value包括了key与value 遍历得到Array(2) 所以没有 for in
两个函数调用
Object.getOwnPropertyDescriptors()空对象 不可枚举 非空可枚举 里面属性带有enumerable: true
[Symbol.iterator]() 可以即可迭代 原型上带next方法
for await of
文件上传⇒一次传完 创完全部Promise 逐个await
⇒ 逐个上传 创一次Promise await一次
OffsetHeight scrollHeight clientHeight
box-sizing: border-box ⇒ width/height = width/height - padding * 2 - border * 2
计算里包含两边
HTMLCollection与NodeList区别
换行加缩进文本
tagName ⇒ Element
nodeName nodeType ⇒ Node
Vue computed vs watch
不准确的比喻
工厂模式 用于产出新的东西
发布订阅 监听变化
Vue组件通讯
父对子 - 属性
子对父 - 事件
自定义事件
$attrs放不在props与emits中的
vue3 合并
独立节点会有
可用v-bind作多级传递
vue2里的$children用$ref获取
$parent $refs需要在mounted里获取
多层级获取数据
Vuex mutation vs action
JS严格模式
HTTP 跨域请求为何发送 options
GC
引用计数
检测内存泄漏
Performance工具
重复创建销毁 内存应为锯齿状 一直上升泄漏
Vue内存泄漏
内存泄漏场景扩展 WeakMap WeakSet
只有get判断有没有 没有forEach size等
建立独立销毁的联系
浏览器和nodejs的事件循环区别
DOM结构不会干涉 一直都是2
VDOM
遍历数组for forEach哪个快
nodejs开启进程与进程之间通信
PM2 完成进程守护 多进程服务
JS Bridge
检查到自己协议，app直接处理返回
实现异步，全局对象只能同步
自定义协议 app拦截处理
requestIdleCallback requestAnimationFrame
React16 fiber ⇒ requestIdleCallback
组件数变链表 树遍历一般递归不方便中断 以此分段渲染
Vue生命周期
可以做与页面无关的
H5的首屏优化
后端10w数据
代码调试测试上线监控 申请服务器域名
前端设计模式与场景
观察者与发布订阅区别
Vue优化
使用问题 遇到的坑
移动端H5 click 300ms延迟
单击后进行一定延迟再执行点击事件
认为已经做了响应式 不需要再用双击放大 无延迟
token与cookie区别
第三方广告设置自己网站的cookie
将服务端状态数据移动到客户端 使服务端无状态 方便扩容
减小体积 4kb大小限制 session中集中存储数据 cookie放个id
Session vs JWT
SSO单点登录
localstorage也是跨域不共享
TCP UDP
HTTP 1.0 1.1 2.0
不需要多个js css文件拼成一个返回 通过减少请求次数增加性能
HTTPS中间人攻击 如何预防
同时使用
- 作者:CamelliaV
- 链接:https://camelliav.netlify.app/article/frontend-interview
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。
.png?table=block&id=1dfca147-5df8-8071-bdb9-ed030b4bcbc6&t=1dfca147-5df8-8071-bdb9-ed030b4bcbc6)
.png?table=block&id=1d8ca147-5df8-80fa-bb28-c4deb2de3dad&t=1d8ca147-5df8-80fa-bb28-c4deb2de3dad)
