CVTE-广州-暑期前端实习生一面(凉)

面试日期：2023.07.11

面试时长：60min

面试工具：迈联会议

自我介绍

HTML：

• script标签中defer和async的区别？

CSS：

• 两栏布局方案？
• margin设置负值会是什么情况？（懵）
• padding-bottom设置50%会是什么情况？(懵，直接回了句没写过padding百分比单位，让我猜一下啥)

JavaScript：

• 箭头函数和普通函数的区别？为什么箭头函数this指向在定义时就被确定了？（懵）
• 异步函数的发展史，async和await是什么的语法糖？
• 事件循环？常见的宏任务和微任务？有没有用宏任务做过一些实际场景？

浏览器：

• 浏览器安全：XSS和CSRF的攻击方式以及前端的解决方案？
• 协商缓存和强缓存，整个流程说一下？

Vue：

• Vue2和Vue3的区别？Proxy比Object.defineProperty()性能优越在什么地方？（懵）
• Vue和React区别？

前端工程化：

• 前端有哪些性能优化方式？增加首屏加载速度?(让我从多个思路上进行回答)
• 知道哪些前端安全问题？(把各种攻击xss、crfs说了)前端怎么解决？(不会没考虑过)

算法：

• 实现Promise.retry：执行一个函数，如果不成功最多可以尝试 times 次。传参需要三个变量，所要执行的函数，尝试的次数以及延迟的时间。(懵！其实思路还挺简单的，但是好久没看笔记了)

Promise.retry = function (fn, times, delay) {
    return new Promise((resolve, reject) => {
        const reSend = () => {
            fn().then(data => {
                resolve(data)
            }, (error) => {
                if (times == 1) {
                    reject(error)
                } else {
                    times--
                    setTimeout(() => {
                        reSend()
                    }, delay)
                }
            })
        }
        reSend()
    })
}
//用例 当时不会写，总想着发请求 忘记了最基本的东西
const fetchData = () => {
    return new Promise((resolve, reject) => {
        const random = Math.random();
        if (random > 0.9) {
            resolve('Data successfully retrieved');
        } else {
            reject('Failed to retrieve data');
        }
    });
};
Promise.retry(fetchData, 5, 1000)
    .then(data => console.log(data), error => console.error(error))

反问：

没问，面试官本来说要有介绍的项目组的工作内容，可能看时间到了也没说，直接和我拜拜了，直觉必凉。

评价：

1.整个面试体验其实很好，小哥循循善诱引导思路，奈何我太菜~(太久没看八股了，还要准备秋招！)