万仙山220829面试题
1. 列举常用的字符串方法
2. 列举常用的数组方法
3. 什么是rem
4. 什么是原型链
5. new一个实例化对象的四个阶段
6.从输入url到浏览器显示页面发生了什么
7. 什么是回流和重绘
8. 常见HTTP状态码的含义
9. 说一下promise
10. 说一个async await
11. promise.all 和 promise.race 的用法和区别
12. 什么是防抖和节流，描述防抖的原理和节流的原理
13. 什么是事件流，解决事件冒泡
14. 什么是事件委托，应用场景，优缺点
15. js的数据类型
16. 什么是事件循环
17. 如何实现前端性能优化
18. 三种本地存储的区别
19. ES6新特性
20. DOM常见的操作及API
21. get请求和post请求的区别
22. 说说最近最流行的一些东西吧？常去哪些网站？
23. 列举10条移动端兼容性问题
24. 从输入url到页面呈现经历了什么
25. 什么是闭包，闭包的优缺点
26.简述js的垃圾回收机制
27.什么是内存泄露
28.js如何实现深拷贝
29.数组冒泡排序的原理
30.数组排序的方法
31.谈谈你对this的理解
32.let、const、var的区别
33.call、apply、bind的区别
34.大文件的分割处理（大文件切片上传，断点续传）
35.如何将最终的金额，专为","逗号分隔的形式
function numberFormate(num) { // 数字格式化为x,xxx,xxx,xxx // 1. 将num专为数字类型 num = parseFloat(num); // 2. 判断是否是一个数字 if (!Number.isNaN(num)) { // 3. 将数字按照.进行分割（主要是针对浮点数） let str = Math.abs(num).toString().split('.'); // 4. 整数部分按照3个一组，看可以分为几组 const a = Math.ceil(str[0].length / 3); // 5. 不够3个一组的，自动补充0 str[0] = str[0].padStart(a * 3, '0'); const numArr = []; // 6. 将数字按照3个一组进行截取 for (let i = 0; i < a; i++) { numArr.push(str[0].substring(i * 3, (i + 1) * 3)); } // console.log(numArr); // 7. 将数组中的第一个值中前面补充的0去除 numArr[0] = parseInt(numArr[0]); // 8. 将数组中的数字按照逗号进行拼接，并且拼接上小数点后面的值 const formateStr = numArr.join(',') + (str[1] ? '.' + str[1] : ''); // 9. 判断初始值是正值还是负值，需不需要添加- return num < 0 ? "-" + formateStr : formateStr; } else { throw new TypeError("传入的参数必须是数字"); } } console.log(numberFormate(1123456789.2234)); // 结果为1,123,456,789.2234
34.前端常用的几种加密方法
35.前端常见的攻击手段及防御方法
36. 用类的方式编写一个b继承a的方法，描述代码实现流程
37. 了解Node么? Node的使用场景都有哪些？
38. 对于前端自动化构建工具有了解吗，简单介绍下
39. js的typeof返回哪些数据类型
40. 介绍一下css的盒子模型
41.vue中有哪些指令
42.v-for和v-if为什么不能用在同一元素
43.实现数组更新检测的方法
44. key值的作用
45.事件绑定中的事件修饰符有哪些
46.vue中的虚拟dom的理解
47.methods、computed和watch的区别，并列举应用场景
48.vue中的组件传值都哪些方式，如何传值（结合我们讲的课件）
49.vue如何获取原生dom
50.vue中this.$nextTick()的用法
51.说一下你对vue生命周期钩子的理解
52.vue中如何自定义组件
53.解释一下keep-alive
54.组件中的data为什么是一个有返回值的函数
55.什么是SPA(单页面应用)
56.介绍一下vue的全家桶
57.动态路由如何定义，如何传参，如何接收参数
58.$route和$router的区别
59.声明式导航和编程式导航的区别
60.描述一下Token的工作流程
61. vue路由有哪些模式，区别是什么
62. vue中如何实现嵌套路由
63. 列举所有的导航守卫
64. 完整的导航守卫解析流程
65. 路由中的滚动行为设置
66. vuex是什么，描述一下vuex的五个核心概念
67. vuex在什么时候会使用，描述一下vuex的工作流程
68. vuex的辅助函数有哪些，怎么使用
69. vue中插槽有哪些类型
70.V2和v3的区别
71.Element-ui和plus的区别
70.style中scoped的作用
76. HTML5为什么只需要写!DOCTYPE HTML?
77.Doctype作用？标准模式与兼容模式各有什么区别？
78. css隐藏元素的几种方法（至少说出三种）
79. CSS清除浮动的几种方法（至少两种）
80. CSS居中 （包括水平居中和垂直居中）
81. 列举你所了解的flex布局的属性
82. 接项目怎么做移动端大小适配
83. vue中this.$相关的api可以说多少种
84. 瀑布流怎么实现
85. ES6中symbol有什么作用，如何使用
86. 使用箭头函数应注意什么？
87. setTimeout、Promise、Async/Await 的区别
88. forEach、for in、for of三者区别
89. ES5新增的数组方法有哪些
90. let、const、var的区别？
91.以下代码输出的结果是什么，想要输出结果为01234该怎么修改
for(var i=0;i<5;i++){
setTimeout(function(){
console.log(i);
},1000)
}
for(var i=0;i<5;i++){
(function(i){
setTimeout(function(){
console.log(i);
},1000)
})(i)
}
94. 从哪些方面，对网页进行seo优化
95. 使用冒泡排序，实现数组中的数据进行排序
[12,34,54,13,76,9,57]
96.数据格式转换
// js对象转换，将对象a的数据结构转换成res
let a = { "1/1":"apple", "1/2":"peach", "1/3":"banner", "1/4":"apple", "1/5":"banner", "1/6":"apple", "1/7":"banner", "1/8":"pear", "1/9":"pear", "1/10":"pear", "1/11":"banner", "1/12":"pear", "1/13":"apple", "1/14":"banner", "1/15":"banner", "1/16":"peach", } let res = { "apple":["1/1","1/4","1/6","1/10"], "peach":["1/2","1/13","1/16"], "banner":["1/3","1/5","1/7","1/11","1/14","1/15"], "pear":["1/8","1/9","1/12"] } let res = {}; for (k in a) { // console.log(k); if (res[a[k]] == undefined) { res[a[k]] = new Array(k); } else { res[a[k]].push(k); } }
97. 如何判断一个数据是NaN
98. 解释一下javascript的同源策略
99. 说一下link和@import的区别
100.说一下什么是MVC，什么是MVVM
101.去掉一组整型数组重复的值
比如输入: [1,13,24,11,11,14,1,2] 输出: [1,13,24,11,14,2] 需要去掉重复的11 和 1 这两个元素。
这道问题出现在诸多的前端面试题中，主要考察个人对Object的使用，利用key来进行筛选。
/** * unique an array **/ let unique = function(arr) { let hashTable = {}; let data = []; for(let i=0,l=arr.length;i<l;i++) { if(!hashTable[arr[i]]) { hashTable[arr[i]] = true; data.push(arr[i]); } } return data } module.exports = unique;
102.统计一个字符串出现最多的字母
给出一段英文连续的英文字符窜，找出重复出现次数最多的字母
输入 ： afjghdfraaaasdenas
输出 ： a
前面出现过去重的算法，这里需要是统计重复次数。
function findMaxDuplicateChar(str) { if(str.length == 1) { return str; } let charObj = {}; for(let i=0;i<str.length;i++) { if(!charObj[str.charAt(i)]) { charObj[str.charAt(i)] = 1; }else{ charObj[str.charAt(i)] += 1; } } let maxChar = '', maxValue = 1; for(var k in charObj) { if(charObj[k] >= maxValue) { maxChar = k; maxValue = charObj[k]; } } return maxChar; } module.exports = findMaxDuplicateChar;
103.不借助临时变量，进行两个整数的交换
输入 a = 2, b = 4 输出 a = 4, b =2
这种问题非常巧妙，需要大家跳出惯有的思维，利用 a , b进行置换。
主要是利用 + - 去进行运算，类似 a = a + ( b - a) 实际上等同于最后 的 a = b;
function swap(a , b) { b = b - a; a = a + b; b = a - b; return [a,b]; } module.exports = swap;
104.找出下列正数组的最大差值比如:
输入 [10,5,11,7,8,9]
输出 6
这是通过一道题目去测试对于基本的数组的最大值的查找，很明显我们知道，最大差值肯定是一个数组中最大值与最小值的差。
function getMaxProfit(arr) { var minPrice = arr[0]; var maxProfit = 0; for (var i = 0; i < arr.length; i++) { var currentPrice = arr[i]; minPrice = Math.min(minPrice, currentPrice); var potentialProfit = currentPrice - minPrice; maxProfit = Math.max(maxProfit, potentialProfit); } return maxProfit; }
105.随机生成指定长度的字符串
实现一个算法，随机生成指制定长度的字符窜。
比如给定 长度 8 输出 4ldkfg9j
function randomString(n) { let str = 'abcdefghijklmnopqrstuvwxyz9876543210'; let tmp = '', i = 0, l = str.length; for (i = 0; i < n; i++) { tmp += str.charAt(Math.floor(Math.random() * l)); } return tmp; } module.exports = randomString;
106. 简述一下src与href的区别
107. 浏览器的内核分别是什么?
108. 怎样添加、移除、移动、复制、创建和查找节点？
109. 说说你对 SPA 单页面的理解，它的优缺点分别是什么？
110. 你有对 Vue 项目进行哪些优化？
97. 小程序是如何实现下拉刷新的
98. 你是怎么封装微信小程序的数据请求的？
99. 小程序页面之间有哪些（传值）传递数据的方法？
100. 描述小程序的生命周期函数
101. 简述微信小程序原理
102. 哪些方法来提高微信小程序的应用速度？
103. 小程序和H5的区别？
104. 小程序如何实现下拉刷新？
105. bindtap和catchtap的区别
106. 列举微信小程序页面跳转的所有API及特点
107. 小程序和Vue写法的区别
108. 小程序和原生App的区别及优缺点
109. 小程序的发布流程
110. uniapp的请求如何封装
111. rpx、px、em、rem、%、vh、vw的区别是什么？
112. 小程序如何自定义组件
113. 小程序为什么要分包，如何分包
114. 小程序会不会跨域，为什么
115. 小程序的常用命令有哪些
116. 小程序如何自定义导航栏
117. 小程序如何自定义tabBar
118. 小程序中如何实现支付功能
119. uniapp的优缺点
120. uniapp主要目录和文件的作用
121. uniapp的生命周期
122. 条件编译的作用及如何使用
123. uniapp怎么上传图片
124. https://blog.csdn.net/m0_74429971/article/details/127471923
125. 说说微信小程序的登录流程?
126. 说说React生命周期中有哪些坑？如何避免？
127. 说说React diff算法是怎么运作的？
128. 调和阶段setState干了什么？
129. 说说redux的实现原理是什么，写出核心代码？
130. React合成事件的原理？
131. React组件之间如何通信？
132. 说说你对fiber架构的理解？解决了什么问题？
133. 说说你对redux中间件的理解？ 常用的中间件有哪些？
134. React性能优化的手段有哪些？
135. React中ref属性是干嘛用的？
136. Redux中间件是怎么拿到store和action? 然后怎么处理？
137. 列举React中的Hooks ，及各个Hook的应用场景 (越多越好)
138. React Hook的使用限制有哪些？
139. 对虚拟 DOM 的理解？虚拟 DOM 主要做了什么？虚拟 DOM 本身是什么？
140. React Hooks在平时开发中需要注意的问题和原因
141. React的严格模式如使用，有什么用处？
142. React中什么是受控组件和非控组件？
143. Redux请求中间件如何处理并发？
144. Component, Element, Instance 之间有什么区别和联系？
145. Redux 中异步的请求怎么处理
146. react 强制刷新
147. React中的setState批量更新的过程是什么？
148. React中如何获取原生DOM
149. 为什么useState可以使用const解构赋值？
150. 什么是高阶组件
151. 说一下你对纯函数和副作用的理解
152. Redux三大原则是什么
153. useEffect Hook的用法
154. 怎么拆分redux中的reducer
155. react-redux库的特点，如何使用
156. 搭建react项目的流程
157. React的路由模式及实现
158. redux的工作流程
159. setState为什么是异步的
160. 函数组件和类组件的区别
161. 什么是JSX语法
162. React项目中遇到的难点及解决方案
163. props.children的用法
164. useMemo和useCallback的应用场景
165. RTK的用法
166. 面试题参考网址：
167. react高频面试题
168. https://blog.csdn.net/weixin_66501371/article/details/128565830
169. 20道高频React面试题（附答案）
170. https://huaweicloud.csdn.net/63a5618bb878a54545945a65.html
171. 高级前端一面常考react面试题总结
172. https://www.cnblogs.com/beifeng1996/p/16984158.html
173. 什么事渐进式框架
