前端技术栈_性能代价和获得的用户体验收益不成正比-CSDN博客

本文链接：https://blog.csdn.net/cctvcqupt/article/details/121660116

https://juejin.cn/post/7036581158670303240

做了一份前端面试复习计划，保熟～ - 掘金

1、Vue和React的区别

Vue和React的比较_布里渊区-CSDN博客

2、CI/CD 做了哪些实践

什么是 CI/CD？一文带你理解CI持续集成和CD持续交付/部署 - 红帽

前端开发如何让持续集成/持续部署(CI/CD)跑起来 - 知乎

3、鉴权有了解么，jwt 如何实现踢人，session 和 jwt 鉴权的区别

jwt 如何实现踢人，session 和 jwt 鉴权的区别_布里渊区-CSDN博客

4、TCP 三次握手 http1.0，1.1，2 都有哪些区别

TCP 连接的“ 三次握手 ”与“ 四次挥手 ”_布里渊区-CSDN博客

5、https，为什么 https 可以防中间人攻击

https://blog.csdn.net/cctvcqupt/article/details/117994834

6、介绍一下 promise

promise实现_布里渊区-CSDN博客

Promise基本用法_布里渊区-CSDN博客

7、esmodule 介绍一下，它和 commonjs 的区别，主要的优势是什么

ESM(ESModule)和CJS(CommonJS)的区别_布里渊区-CSDN博客

8、介绍一下 vite 的原理，它会去编译你的代码吗，vite 引用 commonjs 的包的时候怎么处理

源码不会，依赖会预编译。commonjs 由 esbuild 去预编译

webpack 与 vite 对比_布里渊区-CSDN博客

9、如何转成 esm vue3 的组合式 API 有了解吗，它有哪些优势？

https://blog.csdn.net/cctvcqupt/article/details/122687271

10、介绍 https cors 介绍一下

HTTP CORS_布里渊区-CSDN博客

11、微前端有了解吗

微前端-微应用_布里渊区-CSDN博客

13、webpack 相关

webpack相关_布里渊区-CSDN博客

webpack 十连问你能接住几题 - 掘金

带你解读 webpack 打包原理及vite的优势 - 掘金

浅谈Vite 原理与 Webpack比较 - 掘金

Vite 的好与坏 - 掘金

15、你们 react 用的是什么语法？ fiber 原理有了解吗？

16、怎么理解 vue 单向数据流的

怎么理解vue的单向数据流和v-model双向绑定_布里渊区-CSDN博客

17、Vue 组件之间的通信方式都有哪些，用过 eventbus 么，eventbus 的思想是什么

prop
vuex
eventBus
provide/inject

事件总线EventBus_布里渊区-CSDN博客

vue provide/inject_布里渊区-CSDN博客

18、写个自定义 v-modal

<Child v-model="name"></Child>

等同于

<Child v-bind:value="name" @input="changeValue"></Child>

Child组件

<template>
  <div class="x-child" v-on:click="clickBlock">
     <div>{{value}}</div> 
  </div>
</template>

<script>
export default {
  name: "Child",
  props:{
    value:String
  },
  methods: {
     clickBlock(){
       this.$emit('input',new Date().getTime().toString())
     }
  }
};
</script>

19、$attrs和$listener 有了解吗

https://blog.csdn.net/cctvcqupt/article/details/123092959

20、Vue 生命周期有哪些，都是做什么的，updated 什么情况下会触发，beforeCreate 的时候能拿到 Vue 实例么，组件销毁的时候调用的是哪个 API

Vue生命周期_布里渊区-CSDN博客

21、什么情况下会触发组件销毁，销毁的时候会卸载自定义事件和原生事件么

页面刷新、关闭

没有使用keep-alive的路由切换

手动调用api this.$destory()

v-if = false 让元素消失

销毁的时候，对应 Vue 实例的所有指令都被解绑，所有的事件监听器被移除，所有的子实例也都被销毁

22、自定义指令写过么，自定义指令都有哪些钩子

Vue Directive Vue自定义指令：用于操作Dom_布里渊区-CSDN博客

24、Vue2 的数据响应式有两个缺陷，你知道是哪两个缺陷么，为什么会有这样的缺陷，如何解决

Vue2 的数据响应式缺陷_布里渊区-CSDN博客

25、Vue 如何实现的数组的监听，为什么 Vue 没有对数组下标修改做劫持

如果监听数组下标，数据少点没啥问题，大量数据会有性能问题

尤雨溪说：性能代价和用户体验收益不成正比

26、Symbol 有了解吗，迭代器有了解吗，哪些是可迭代的

https://blog.csdn.net/cctvcqupt/article/details/123280988

https://blog.csdn.net/cctvcqupt/article/details/123264028

27、用 Set 获取两个数组的交集，如何做

运用set集合解决两个数组之间的并集、交集和差集问题。_小小猿同学的博客-CSDN博客_两个set集合并集

29、animation 和 transition 有什么区别

animation 和 transition 的区别 - mufengchun - 博客园

30、写个动画，一个盒子，开始时缩放是 0，50%时是 1，100%时是 0，开始结束都是慢速，持续 2 秒，延迟 2 秒，结束后固定在结束的效果

<!DOCTYPE html>
<html>
<head>
<style> 
div
{
width:100px;
height:100px;
background:red;
position:relative;
animation:mymove 2s ease 2s;
animation-fill-mode: forwards;//停在最后一帧
}

@keyframes mymove
{
0% { transform:scale(0,0) }
50% { transform:scale(1,1) }
100% { transform:scale(0,0) }
}

</style>
</head>
<body>

<div></div>

</body>
</html>

31、你们开发的 h5 项目依赖的安卓和苹果的 webview 的内核分别都是什么

浏览器内核

1、Chrom

低版本：webkit
高版本：blink

2、Safari

webkit内核

3、安卓Webview

低版本 webkit内核
高版本 chrom内核

4、IOS webview

IOS8以后：WKWebview内核（webkit内核）

IOS8以前：UIWebview （UIKit）

33、CSS 实现一个扇形

css绘画扇形_一枚前端猿的博客-CSDN博客_css扇形

34、输出解答题

var a = { name: "Sam" };
var b = { name: "Tom" };
var o = {};
o[a] = 1;
o[b] = 2;
console.log(o[a]);  //2
console.log(JSON.stringify(o))  // {"[object Object]":2}

35、事件循环EventLoop

事件循环 EventLoop_布里渊区的博客-CSDN博客

36、解答题

const promise1 = Promise.resolve("First");
const promise2 = Promise.resolve("Second");
const promise3 = Promise.reject("Third");
const promise4 = Promise.resolve("Fourth");
const runPromises = async () => {
  const res1 = await Promise.all([promise1, promise2]);
  const res2 = await Promise.all([promise3, promise4]);
  return [res1, res2];
};
runPromises()
  .then((res) => console.log(res))
  .catch((err) => console.log(err));

37、Vue 的 nextTick 是做什么的？

nextTick实现原理，必拿下! - 掘金

38、React 的合成事件和原生事件了解吗？

39、移动端兼容性问题遇到过哪些

40、如何限制 Promise 请求并发数

41、 Vue3中 Proxy 和 defineProperty 的区别是什么，性能上有什么区别么

42、Vue 如果想做模板的复用，应该怎么做

43、有做过骨架屏么，是怎么做的

44、有做过懒加载么

45、1px问题

1px像素问题_布里渊区的博客-CSDN博客_css 小于1px的边框

46、rem vw 自适应