前端面试题之——移动Web

一 面试题汇总

1. 移动web开发与PC web开发的区别有哪些？
2. 移动web开发中css常用的单位有哪些？
3. 常见的移动端事件有哪些？

二 面试题解答(仅供参考)

2.1 移动web开发与PC web开发的区别有哪些？

移动 Web 开发和 PC Web 开发在设计和实现上有一些明显的区别，主要体现在以下几个方面：

1-屏幕尺寸和分辨率：
移动设备的屏幕尺寸和分辨率通常比 PC 设备小，
因此移动 Web 开发需要考虑到屏幕空间的限制，设计页面布局和元素大小以适应不同尺寸的移动设备。

2-触摸操作：
移动设备使用触摸屏幕进行交互，而不是鼠标和键盘，
因此移动 Web 开发需要考虑到触摸操作的特点，设计交互元素（如按钮、链接等）大小和位置以便用户轻松操作。

3-性能和资源限制：
移动设备的性能和资源通常比 PC 设备低，
因此移动 Web 开发需要考虑到性能和资源消耗，尽量减少页面加载时间和内存占用，优化代码和资源。

4-网络环境：
移动设备通常在不稳定的网络环境下使用，如移动网络或公共 Wi-Fi，
因此移动 Web 开发需要考虑到网络延迟和带宽限制，优化页面加载和数据传输。

5-用户体验：
移动设备的用户通常处于不同的使用场景和情境中，
如移动、站立或者在交通工具上，因此移动 Web 开发需要考虑到用户体验的多样性，
设计简洁、直观且易于操作的界面。

6-功能和交互：
移动设备和 PC 设备有不同的功能和交互需求，例如摄像头、地理位置等，
因此移动 Web 开发需要根据设备的特点和用户的需求设计相应的功能和交互。

总的来说，移动 Web 开发和 PC Web 开发在设计和实现上有一些区别，需要根据目标用户群体、设备特点和使用情境来进行针对性的优化和调整，以提供更好的用户体验和性能表现。

2.2 移动web开发中css常用的单位有哪些？

移动web开发中的css单位除了PC web开发常见的px、em、百分比，
还有rem、vh、vw，rem类似于em，是一个相对字体大小， 
不过rem相对的是根元素的字体大小，vw和vh是相对于viewport的宽高，
这两个单位将viewport等分为100份，也就是说1vw 相当于viewport宽度的百分之一

2.3 常见的移动端事件有哪些？

移动端事件是指在移动设备上触发的各种交互事件，主要用于响应用户的触摸、手势和其他操作。
常见的移动端事件包括以下几种：

1-touchstart：当用户触摸屏幕时触发，即手指触摸屏幕的时候。
2-touchmove：当用户在屏幕上滑动手指时触发，即手指在屏幕上移动的时候。
3-touchend：当用户手指从屏幕上移开时触发，即手指离开屏幕的时候。
4-touchcancel：当触摸事件被中断时触发，例如系统取消了触摸事件，或者触摸事件被其他操作中断。
5-tap：当用户轻触屏幕时触发，类似于鼠标的点击事件，用于模拟简单的点击操作。
6-swipe：当用户在屏幕上进行滑动操作时触发，包括向左滑动、向右滑动、向上滑动和向下滑动等。
7-doubletap：当用户双击屏幕时触发，类似于鼠标的双击事件，用于模拟双击操作。
8-pinch：当用户使用两个手指在屏幕上捏合或张开时触发，用于缩放操作。
9-rotate：当用户使用两个手指在屏幕上旋转时触发，用于旋转操作。
10-longpress：当用户长按屏幕时触发，用于模拟长按操作，例如长按菜单或长按拖拽。

以上是常见的移动端事件，开发者可以根据具体需求监听相应的事件，并编写相应的处理逻辑来实现各种交互效果。

三 参考

• FE-Interview—移动Web