前端小程序开发面试题（前端开发面试题目）

本篇文章给大家谈谈前端小程序开发面试题，以及前端开发面试题目对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

本文目录一览：

• 1、WEB前端面试题
• 2、2022前端开发面试记录（深圳篇）
• 3、2021上海中级前端面试常问问题整理
• 4、web前端面试笔记，基础题

WEB前端面试题

第二章 面试题基础篇

2.1 HTML面试题

面试题：行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？

面试题：页面导入样式时，使用link和@import有什么区别？

面试题：title与h1的区别、b与strong的区别、i与em的区别？

面试题：img标签的title和alt有什么区别？

面试题：png、jpg、gif 这些图片格式解释一下，分别什么时候用？

2.2 CSS面试题

面试题：css背景纹路

面试题：介绍一下CSS的盒子模型

面试题：CSS选择符有哪些？哪些属性可以继承？

面试题：CSS优先级算法如何计算？

面试题：用CSS画一个三角形

面试题：一个盒子不给宽度和高度如何水平垂直居中？

面试题：display有哪些值？说明他们的作用。

面试题：对BFC规范(块级格式化上下文：block formatting context)的理解？

面试题：清除浮动有哪些方式？

面试题：在网页中的应该使用奇数还是偶数的字体？为什么呢？

面试题：写一个左中右布局占满屏幕，其中左、右俩块固定宽200，中间自适应宽，要求先加载中间块，请写出结构及样式。

面试题：什么是CSS reset？

面试题：css sprite是什么,有什么优缺点

面试题：display: none;与visibility: hidden;的区别

面试题：position有哪些值?有什么作用? 【特别多公司问】

面试题：line-height和height有什么区别？

面试题：opacity 和 rgba区别

2.3 JavaScript基础面试题

面试题：延迟加载JS有哪些方式？

面试题：JS数据类型有哪些？

面试题：null和undefined的区别

面试题：JS数据类型考题

面试题：==和===有什么不同

面试题：JS微任务和宏任务

面试题：JS作用域考题

面试题：JS对象考题

面试题：JS作用域+this指向+原型 考题

面试题：JS判断变量是不是数组，你能写出哪些方法？

面试题：slice是干嘛的、splice是否会改变原数组

面试题：JS数组去重

面试题：找出多维数组最大值

面试题：给字符串新增方法实现功能

面试题：找出字符串出现最多次数的字符以及次数

2.4 真正移动端 —— H5/C3面试题

面试题：什么是语义化标签

面试题：::before 和 :after中双冒号和单冒号 有什么区别？解释一下这2个伪元素的作用。

面试题：如何关闭iOS键盘首字母自动大写

面试题：怎么让Chrome支持小于12px 的文字？

面试题：rem和em有什么样区别

面试题：ios系统中元素被触摸时产生的半透明灰色遮罩怎么去掉

面试题：webkit表单输入框placeholder的颜色值能改变吗？

面试题：禁止ios 长按时不触发系统的菜单，禁止iosandroid长按时下载图片

面试题：禁止ios和android用户选中文字

面试题：自适应 [淘宝无线适配]

面试题：响应式

第三章 面试题进阶篇

3.1 JavaScript进阶面试题

面试题：new操作符具体做了什么

面试题：闭包 【必须会】

面试题：原型链 【必须会】

面试题： JS继承有哪些方式

面试题：说一下call、apply、bind区别

面试题：sort背后原理是什么？

面试题：深拷贝和浅拷贝

面试题：localstorage、sessionstorage、cookie的区别

3.2 ES6面试题

面试题：var、let、const区别

面试题：作用域考题

面试题：将下列对象进行合并

面试题：箭头函数和普通函数有什么区别？

面试题：Promise有几种状态

面试题：find和filter的区别 【大厂】

面试题：some和every的区别 【大厂】

3.3 webpack面试题

面试题：webpack插件

3.4 Git面试题

面试题：git常用命令

面试题：解决冲突

面试题：GitFlow

第四章 面试题框架篇

4.1 区分初中高级的 —— Vue面试题

面试题：Vue2.x 生命周期有哪些？

1.系统自带八个

2.当一旦进入到某个组件会执行哪些生命周期

3.$el和$data在哪个阶段有

4.如果使用keep-alive会多俩个生命周期

5.如果加入keep-alive第一次进入组件会执行哪些生命周期

6.如果加入keep-alive第二次或者第N进入该组件会执行哪些生命周期

面试题：谈谈你对keep-alive的了解

面试题：v-if和v-show区别

面试题：v-if和v-for优先级 2.x

面试题：ref是什么？

面试题：nextTick是什么？

面试题：Vue中如何做样式穿透

面试题：scoped原理

面试题：Vuex是单向数据流还是双向数据流？

面试题：讲一下MVVM

面试题：双向绑定原理

面试题：什么是虚拟DOM

面试题：key是干什么？

面试题：diff算法

面试题：Vue组件传值

面试题：props和data优先级谁高？

面试题：computed、methods、watch有什么区别？

面试题：Vuex

面试题：Vue路由

面试题：Vue项目打包后出现空白页

4.2 微信小程序面试题

面试题：如何自定义头部？

面试题：如何自定义底部？

4.3 uni-app面试题

面试题：生命周期

面试题：条件编译

第五章 面试题性能优化篇

2022前端开发面试记录（深圳篇）

2022年来到深圳，感觉到了与之前所在城市的差异，心里多少有点落差。虽然时机不太对吧，但是相信一切都会好起来的，给自己加油呀！

整理了一些面试被问到的问题，虽然很多是无效面试，但是我也强行问了面试官，从他们的回答中猜测了一下他们关注的面试点，所以也算是有点收获吧，只是浪费了很多简历和路费，哭唧唧。

——1、区块链——

1-1、vue生命周期；

1-2、vuex属性；

1-3、用户开始登录到登录成功都发生了什么；

1-4、git常用的命令；

——2、金融：vue——

笔试：

2-1、深浅拷贝的区别，为什么会出现深浅拷贝，浅拷贝的优势；

2-2、强制中断 foreach 遍历；

2-3、多处组件复用；

2-4、你对前端是什么概念，前端在整个软件生态内是什么角色；

2-5、Vue2 中数据变化但视图没有发生同步更新，描述一下出现的场景，解决方式，以及该问题发生的可能原因；

2-6、nextTick 是如何确保开发者能够获取到最新的 DOM 状态的；

2-7、如何使用 mixins，有何利弊；

2-8、使用 Hooks 模式开发时，useMemo，useCallback 常用来作为优化的手段。描述一下它们各自的适用场景，以及背后的原理实现?；

2-9、前端从 Jquery 时代演变至如今的三大框架，这种演变的根源是什么，jquery 解决了什么问题，如今的三大框架又是为了解决什么问题出现的？

视频面试：

2-10、js遍历树形结构，每个节点都有一个唯一ID，只能遍历一次；

2-11、组件封装的意义；

——3、知识产权：vue2、vue3、ts、react——

3-1、说一说面向对象的理解，包括继承、封装、多态等；

3-2、说一说promise；

3-3、webpack优化；

3-4、vuex使用场景；

3-5、描述一下对vue响应式原理的理解；

3-6、vue生命周期；

3-7、父子组件钩子函数执行顺序；

3-8、v-if和v-show；

3-9、js数据类型；

3-10、实现深拷贝；

——4、物流——

4-1、vue生命周期；

4-2、生命周期-修改元素样式在生命周期的哪个阶段；

4-3、生命周期-修改数据在哪个阶段；

4-4、生命周期-destroy里面会做哪些操作；

4-5、怎么修改title的内容；

4-6、父子组件传参的具体写法；

4-7、v-model的多种写法；

4-8、js数据类型；

4-9、判断数组的方法；

4-10、实现左边固定右边自适应的布局；

4-11、实现div垂直水平居中；

4-12、flex:1；

4-13、flex详解；

4-14、call,apply,bind是干什么的；

——5、新兴产业——

5-1、封装路由，怎么拦截路由；

5-2、浏览器缓存有哪些，又问localStorage和sessionStrorage的区别和应用场景；

5-3、浏览器强缓存和协商缓存；

5-4、webpack打包机制，构建过程和配置；

5-5、性能优化方法；

5-6、前端的业务和后端的API是怎么做到数据实时请求的（问的其实是前端对后端API接口的封装和管理）；

5-7、computed和watch；

5-8、说了几个关于大屏的应用场景，有没有做过，怎么做的；

——6、某水果：vue2、vue3、ts、各种前沿技术都用——

6-1、怎么封装一个组件库/工具类库，比如vue封装过什么复杂组件，jquery封装过什么类库；

6-2、get和post的区别，传参格式等；

6-3、promise怎么用的；

6-4、原型链，test()的原型链；

6-5、websocket；

6-6、es6中的generator；

6-7、es6中的set和map有啥区别，set为什么能去重；

6-8、项目难点；

——7、医疗健康：vue——

7-1、vue自定义指令配置；

7-2、webpack的理解；

7-3、对node的了解，用过express吗；

7-4、项目中的拖拽是怎么做的；

7-5、websocket和socket的区别；

7-6、听过mqtt吗，因为没听过所以解释了一下activemq的用法；

7-7、二维地图的聚合，如果有十万个点，会做什么优化；

7-8、地图实现多个点连成一条线会怎么做；

7-9、地图实现一条曲线；

7-10、内网下git怎么用的；

7-11、openlayers渲染机制；

7-12、父子组件通信方法；

7-13、router中实现拦截；

7-14、对象合并的方法；

7-15、父子组件的生命周期执行顺序，渲染阶段为什么会先执行父组件再执行子组件；

7-16、vue生命周期；

7-17、npm run dev, run build可以在项目中的什么位置找到；

7-18、vue中跳转页面的方法；

7-19、mixins用过吗；

7-20、判断引用类型的方法；

7-21、js数据类型；

7-22、判断基本数据类型的方法；

7-23、for in和for of的用法和区别，两者遍历的是索引还是属性值，两者都可以遍历对象吗；

7-24、foreach和map的区别，两者会不会改变原数组；

7-25、主要用什么技术栈；

7-26、行内元素和块级元素的区别，分别都有哪些，行块级元素有哪些；

7-27、div垂直水平居中，grid知不知道怎么用；

7-28、splice和slice；

——8、智慧园区：vue2、vue3、ts、uniapp——

8-1、flex了解吗，flex布局方向，flex:1 0的页面效果是怎样的；

8-2、做过移动端吗，了解uniapp吗；

8-3、keep-alive；问了一个没听明白的，可能和keep-alive有关系；

8-4、vuex中的action；不用vuex，怎么代替vuex；

8-5、promise.all和promise.on；

8-6、防止表单重复提交；

8-7、async，await的使用；

8-8、vue3和ts的了解；

8-9、防抖怎么控制时间；

8-10、vue中的data为什么要设计成一个函数；

——9、智慧工地：vue、uniapp、小程序——

9-1、Vuex是干什么的；

9-2、openlayers怎么用的；

9-3、性能优化；

9-4、spa首屏加载优化；

9-5、bundler.js太大，打包怎么优化；

9-6、加密方式了解多少，比如md5,base64等，一大堆没听过的；

9-7、冒泡排序的实现原理；

9-8、js设计模式；

——10、某快递公司外包——

10-1、一棵树的数据，给的是列表格式，转换成树形结构；

10-2、项目相关的，聊天怎么做的，拖拽怎么做的，拖拽的数据怎么渲染的，拖拽重叠怎么处理的；

10-3、js设计模式；

——11、三维：vue、cesium——

11-1、一棵树的数据，给的是列表格式，转换成树形结构；

11-2、openlayers怎么用的，发布过wms吗，发布流程是怎样的；

11-3、openlayers转换经纬度的方法名是什么；

11-4、cesium常用的函数；

11-5、vue数据双向绑定原理；

11-6、Vue中data属性如果改变一个数组的下标，会不会马上发生变化，不变化可以怎么解决

11-7、数组常用方法有哪些；

11-8、 map和filter的区别；

11-9、es6常用的方法；

11-10、父子组件通信，兄弟组件通信；

11-11、new具体进行了什么操作；

——12、医疗：vue、angular——

12-1、js渲染机制和运行机制；

12-2、vue数据绑定原理；

——13、建设行业：vue、uniapp——

笔试：

13-1、||与运算符；

13-2、垂直居中方案；

13-3、let a=arr, b=a, c=arr.concat(), a[0]=3，打印b和c，应该是深浅拷贝；

13-4、实现font-size:12；

13-5、接口路径，给一个地址 ，根据url请求接口路径写出完整路径，’/ geturl.do ’，’ geturl.do ’，’../ geturl.do ’；

13-6、微信小程序流程和主要文件；

13-7、获取url参数及内容；

13-8、$(function(){}) / (function(){}) / (function(){})()的区别；

13-9、前端优化方案；

面试：

13-10、项目难点；

13-11、git工作流；

13-12、jquery项目会不会用webpack打包；

13-13、webpack优化；

13-14、web优化；

——14、文化：uniapp——

14-1、ssr渲染；

14-2、ajax和axios的区别；

14-3、cookie和session的区别；

14-4、vue生命周期；

14-5、数据请求写在哪个生命周期中；

14-6、router的history模式和hash模式；

14-7、工作中的开发流程；

14-8、uniapp的开发流程和坑；

14-9、uniapp滑动问题，下滑切换视频不生效，一般是什么原因；

14-10、uniapp加载速度慢，点击加载图片速度太慢，一般是什么原因；

——15、企业平台某外包：vue，node，性能优化——

15-1、说一说websocket；

15-2、vue数据双向绑定原理；

15-3、项目难点；

15-4、对mvvm、mvc、mvp等的理解；

15-5、vue的常见指令；

15-6、computed和watch；

15-7、class和style怎么绑定；

15-8、ajax和axios的区别；

15-9、axios拦截器，axios的post请求；

15-10、对前端渲染，服务端渲染的理解；

——16、智慧城市：vue，node，three.js——

16-1、vue生命周期；

16-2、vue组件通信方法；

16-3、js的继承；

16-4、oracle、mysql、sqllite的区别；

16-5、oracle连表查询；

16-6、openlayers项目场景；

16-7、cesium项目场景；

——17、租房：jquery+layui，vue2——

17-1、笔试：

17-2、foo打印题；

17-3、this打印题；

17-4、变量提升打印题；

17-5、let arr=[1,2,[5,8,[9,[3,5,]7,]20,37]] 把数组扁平化成一个数组，并进行去重升序;

17-6、let a=[1,2,3,4,5,6,7]; let b=[4,5,6]; 求b在a中第一次出现的位置；

17-7、面试：主要问项目

——18、跑腿：vue2，vue3+ts——

18-1、对html5语义化的理解；

18-2、css实现一个三角形；

18-3、css怎么实现0.5px的线，为什么有这种需求，涉及到兼容性问题；

18-4、怎么解决变量提升的问题；

18-5、es6新增了哪些定义变量的方式；

18-6、const定义的变量可以被修改吗；

18-7、map和filter的区别，会改变原数组吗；

18-8、es6去重的方法；

18-9、谈一谈对promise的理解；

18-10、除了链式调用，promise还可以怎么处理同步请求(async/await)；

18-11、对vue响应式原理的理解，核心是什么；

18-12、对vue生命周期每个阶段的理解；

18-13、为什么要用key，key有什么作用；

18-14、v-if和v-show；

18-15、Vue中data为什么是一个函数；

18-16、vue各场景下的传值方式有哪些，比如父子组件，兄弟组件，祖孙组件；

18-17、对vuex的理解和使用场景；

18-18、vue常见修饰符；

18-19、Vue3用过吗(因为没用过，所以就只针对响应式原理说了一下vue3和vue2的区别)；

——19、实业：jquery，vue2，vue3——

笔试：需要解释

19-1、html5新标签，css3新特性；

19-2、js+css3实现某元素以50px每秒的速度左移100px；

19-3、css实现左中右布局，不改变文档流；

19-4、js兼容性有哪些，以及常见的解决方案；

19-5、描述一下事件循环机制eventloop，eventloop解决了什么问题；

19-6、给了一个题，大概是后端返回的接口数据，data的格式有很多，比如null，对象，数组，字符串等，怎么处理这种问题；

19-7、前端性能优化方法，首屏页面怎么优化；

19-8、用js写一个方法实现数据去重并排序(用es5和es6+实现)；

19-9、给定一个数组，把数组中为0的往后排，其他值按顺序排序; （示例：[1,0,4,0,5,3]转换结果为[1,3,4,5,0,0]）

19-10、用0，1，2代表红黄蓝三种颜色，实现以下排序，不能用array.sort实现;（示例：[0,1,0,2,0,1,2]转换结果为[0,0,0,1,1,2,2]）

面试：

19-11、flex布局；flex:1对应的属性；

19-12、讲一下原型链； proto 和prototype有什么区别；字符串有没有原型；给定一个str，str.test()调用的谁的test方法；

19-13、讲一下闭包；什么情况下才能算是闭包；形成闭包的条件；列了三个题让你判断是不是闭包；

19-14、v-if和v-show是干什么的；应用场景有哪些；给定一对父子组件，默认值是false，另外有一个ajax请求，值发生了以下变化（false true false true true），在v-show和v-if中，父子组件的哪个阶段里会请求ajax；

19-15、computed的实现原理，怎么实现一个computed；

19-16、css中，transform，margin，position的都是怎么渲染的，渲染机制是什么；amd，cmd，commonjs了解吗；

2021上海中级前端面试常问问题整理

金九银十的时间到了，又是适合跳槽的时间，我之前是在郑州工作，然后九月来上海这边，面了一周左右，找到了还算满意的工作，现在整理一下面试中遇到的问题，给要在上海找工作的小伙伴一个参考，也给自己下次换工作做一个参考，哈哈

我是主要做vue的还没有学vue3所以面试中大多是vue2的问题，但是上海挺多公司开始转vue3了，这个还是要抓紧学习

先把问题记录下来，有时间会更新答案

在mvvm架构下，View和Model之间并没有直接的联系，而是通过ViewModel进行交互，Model 和 View 之间的交互是双向的， 因此View 数据的变化会同步到Model中，而Model 数据的变化也会立即反应到View 上。

ViewModel通过双向数据绑定把View层和Model层连接起来，而View和Model之间的同步工作完全是自动的，无需人为干涉，因此开发者只需要关注业务逻辑，不需要手动操作DOM，不需要关注数据状态的同步问题，复杂的数据状态维护完全由MVVM来统一管理

computed是vue的计算属性，可以用于一些复杂的运算，有缓存性，依赖的值不变的情况下不会重新计算

1.是计算值，

2.应用：就是简化tempalte里面{{}}计算和处理props或$emit的传值

3.具有缓存性，页面重新渲染值不变化,计算属性会立即返回之前的计算结果，而不必再次执行函数

watch是监听属性，没有缓存，deep(深度监听，用于数组，对象)，handler，immediate（立即执行）

1.是观察的动作，

2.应用：监听props，$emit或本组件的值执行异步操作

3.无缓存性，页面重新渲染时值不变化也会执行

组件实例对象data必须为函数，目的为了防止多个组件实例直接共用一个data，产生数据污染

在组件复用时，data作为函数，有自己的存储空间，每次都能返回一个新的data，其中一个组件中data的值变化，不会影响其他组件中的data

pc：elementui，avue，Ant Design of Vue

移动：vantui，mint ui

不能，v-for优先级比v-if高，放在一起使用的时候，v-if要在每个循环中创建销毁dom，浪费资源

onLoad(option)

上传---提审---发布

wx.navigateToMiniProgram

可配置跳转版本（开发版，体验版，正式版)

配置合法域名，新建web-view页面

wx-open-launch-weapp 小程序原始id

可参考

计算宽度不一致

ie：content+padding+border

标准：content

box-sizing：content-box ( 标准 )

box-sizing：border-box ( ie )

flex布局可以更好的适配移动端

1.flex布局

2.不知道子元素宽高：position:absolute;top:50%;left50%; transform:translate(-50%,-50%)

3.已知子元素的宽高：position:absolute;top:50%;left50%;margin-left:宽的一半,margin-top:高的一半

1.flex布局，左侧固定宽，右侧flex:1

2.左侧浮动，右侧margin-left:左侧的宽

3.左侧定宽，右侧绝对定位，left:左侧的宽

4.左侧绝对定位，右侧margin-left:左侧的宽

上下宽高固定，下用绝对定位定在底部，中间绝对定位，top：上高，bottom：下高；height：auto

相当于一个完全封闭的盒子，元素布局不受外界影响

生成BFC的条件：float(除none)、overflow、

可以解决浮动布局造成的父元素塌陷

解决外边距重合的问题

可以计算浮动的高，

web前端面试笔记，基础题

1、让一个p水平居中，至少写出3中；

2、有几种前端储存的方式？这些方式的区别是什么？

3、以下代码输出什么？

const arr = [x=x*1,x=x*2,x=x*3,x=x*4];

console.log(arr.reduce((agg,el)=agg+el(agg),1));

4、null与undefined的区别是什么？

6、Vue的生命周期有哪些

7、Vue组件如何通信？

8,Vue是如何实现双向绑定的？请用代码实现

9、实现一个防抖函授

10，实现Event(event bus)

11、实现一个call方法；

12：CSS盒子模型，

13：CSS优先级；

14：CSS伪类；

15：vue过滤器和拦截

16：vue dom

17：js循环机制；

18：JS异步

19：JS的数据类型分为哪2种类型；

20：forEach() 和 map() 的区别

21：js对象

22：vue搜索组件，

23：V-MODLE调用；

24：同步异步方法；

25：js是单线程还是多线程；

单线程；

26：js循环机制

27：深拷贝和浅拷贝

28：原型链

29：vue通讯方式

30：数组去重,

31：小程序开发流程

32：vue生命周期

33：js跨域

34：Cookie、sessionStorage、localStorage的区别及用法

35：typeof 返回的数据类型

36：px、em、rem、rpx区别和为什么使用62.5%；

37：vue基本命令

关于前端小程序开发面试题和前端开发面试题目的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。