背景
设计一个模态弹窗，讲一下你会怎么设计。
该题目来自某大厂的电话面试。该题目具有开放性，可以考察面试者的项目构思经验与能力，是一个比较不错的题目。
场景分析
听到这种开放性问题，不能直接开始进行思考解答，最好要跟面试官进一步询问。
- 弹窗的应用范围？移动端
- 弹窗是给什么项目、业务用的呢？公司统一用的
先整理一下场景信息。
移动端，说明需要考虑体积，键盘弹出，移动端兼容，手势，自适应尺寸等问题。
统一用的，说明要进行充分的测试，支持样式如颜色字体的配置。
配置
根据之前的工作经验，一个模块弹窗可能需要有这样的配置
弹窗类型：仅有确认按钮的弹窗，还有取消按钮的弹窗，能输入内容的弹窗，没有按钮的弹窗
文字：标题、按钮、内容的文字的内容、字体大小、颜色，位置
遮罩层：是否显示，点击是否关闭弹窗。
行为：能否拖拽，调整大小，是否有关闭按钮
高度：固定大小还是根据内容自适应
尺寸：高度或宽度是固定尺寸或是特定比例
位置：居中或是特定的上边距和左边距
行为
模块弹窗可能会有这样的行为
点击确定按钮，抛出确定的事件
点击取消按钮，抛出取消的事件
点击关闭按钮，抛出关闭的事件（可以跟第二点合并）
点击遮罩层，抛出的事件
拖拽弹窗，可能改变弹窗的位置
按住弹窗的角并拖拽，可能改变弹窗的尺寸
方案
- 会使用flex或是绝对定位控制位置和尺寸
- 引入皮肤概念，使得一个class能控制颜色字体大小等属性
- 使用单例模式避免启用重复的弹窗
结尾
感觉自己写的还不是很完善，希望可以跟大家讨论交流一下。
更多的前端面试题，可以看一下我之前的文章大厂前端面试考什么
