HC是广告投放那边的,最后的结果应该是挂了。六个问题,两道很基础和技术相关的,四道open的。很基础的问题但却精准打击到了知识盲区。
一、纵向排列的两个<img/>
标签,中间为什么会有1px的间隙?
之前确实没注意过这个问题,下来做了验证,确实是这样,横向的时候没有,纵向的时候莫名其妙的多了缝隙,但不止1px
。
查了下资料,我的理解是:<img/>
作为行内元素,它的真实行内对齐方式与展示出来的并不一致。
不知我的理解是否正确,几个有效的解决方案都是围绕修改或重置其行内对齐行为来实现的:
-
<img/>
设置dispaly: block
-
父容器设置
font-size: 0
-
父容器设置
line-height: 0
二、页面上只有若干个div,没有id没有class,怎么拿到他们组成的NodeList
?如果他们都有id,其中一部分id是以固定的字符串为前缀(或后缀)加随机生成的内容,另一部分的id是其他格式的,怎么拿到这些有固定字符串id的div?
第一个问题没什么疑问,getElementByTagName
第二个问题我回答的是querySelectorAll
传进去一个正则,但后来查了下,querySelectorAll
并不支持正则,它只能接收css选择器作为参数。
所以正确的做法应该是querySelectorAll
+ css的attribute选择器
。
需要注意的就是:
attr^=value
匹配前缀attr$=value
匹配后缀attr*=value
匹配包含
这也是跟正则相似的语法,另外还有几种含义相似的attribute选择器
,感兴趣的可以点击复习一下。
三、vue2和vue3的选型,如果让你做,你会考虑哪些因素?
答:团队的技术储备、项目是否有历史遗留问题、vue3是趋势以及一些vue3的优势(Composition Api更现代更有利于维护、TS支持、编译时优化、社区生态支持等)。
补充:也可以提一下新的对象劫持方式,更全面,能有效避免一些开发时的低级错误。
四、Vite用过吗?和Webpack有什么区别?
答:Vite在开发时启动很快,主要是因为Vite的dev环境只用esbuild做了代码转义没有对模块进行打包,而是利用了浏览器原生支持module的特性,直接通过websocket服务发出信号告知浏览器并通过http传输新的模块来进行热更新。而在生产环境则使用rollup进行全量代码打包,与webpack的行为类似。
补充:vite在dev环境用esbuild不止是做了代码转义,还做了依赖的预构建,将一些浏览器不支持的格式转化为浏览器支持的语法;vite更偏向于esm优先的策略,而webpack则是通用的打包工具。
五、你的项目中提到了基于元数据的低代码平台,这和传统的低代码平台有什么区别?在最初开始研发的时候你都做了哪些考量?
答1:传统的低代码平台多以拖拽+可视化编辑区的形式呈现,这也是做开源或做商业化面对各式繁杂需求所必须的。而企业内部由于需求明确、系统风格统一,所以不必要去支持深度的自定义。加上我们大部分需求都是后台系统中常见的CRUD页面,故选择了元数据驱动的低代码平台:精细的梳理公司各个业务线的逻辑,明确每个业务字段的意义并定义它们的数据模型和在不同场景下的组件表现行为,然后为其封装业务组件和数据源,这样在生成页面时,我们只需要圈定一个字段范围,就能根据对应的json渲染出整个页面。
答2:元数据驱动的低代码平台,最重要的就是业务字段和数据模型,所以前期的主要精力都集中在寻找一块相对简单的业务,和对应的业务leader梳理业务逻辑,和后端梳理数据模型。至于运行时的渲染器,我们内部已经沉淀出了一个页面级的大组件,其功能和稳定性已经得到了验证,在当时我们要做的是寻找一种方式可以自动生成组件所需的配置json。
六、有一个线上bug,你会怎么解决?事后怎么复盘?
这个问题见仁见智,不再赘述