【3.15】阿里钉钉前端一面 复盘

3.15 钉钉前端一面复盘

• 1.java的八种基本数据类型
  boolean short int long byte float char double

• 2.ts的基本数据类型
  number string boolean bigint symbol null undefined（也就是js那七个呗）
  （补充：一些比较特殊的ts关键字void never any unknown）
  （ts里还存在数组 元祖 对象 enum）

• 3.osi七层模型
  物理层 数据链路层 网络层 传输层 会话层 表示层 应用层

• 4.浏览器缓存机制
  先看强制缓存（cache-control是否过期），如果没过期直接读缓存，如果已过期，进入协商缓存判断，是否有Etag，有的话带If-None-Match向服务器发请求，如果没有Etag那就会判断是否有Last-Modified，有的话带If-Modefied-Since向服务器请求，服务器接收请求之后判断是否有更新，有的话就返回更新的，没有的话直接返回304，让浏览器读取缓存即可

• 5.css盒模型
  content-box 标准盒模型（默认）/IE怪异盒模型，主要就是width怎么算，标准的就是content，怪异的就是content+padding+border，切换模式就用box-sizing

• 6.sass和less的区别
  – sass变量符是$，iess是@
  – sass基于Ruby开发，在服务端处理，less通过js编译，在客户端处理
  – sass支持条件语句，less不支持
  – sass工具库Compass，less是bootstrap
  – sass提供输出选项，less不提供

• 7.说一下flex
  – flex-direction/flex-wrap => flex-flow
  – justify-content/align-items/align-content
  – order/align-self
  – flex-grow/flex-shrink/flex-basis => flex
  flex默认0 1 auto
  flex:0 => 0 1 0%
  flex:1 => 1 1 0%
  flex:auto => 1 1 auto
  flex:initial => 0 1 auto（默认）
  flex:none => 0 0 auto

• 8.如何让一个元素垂直居中
  参考：如何让一个元素水平垂直居中？

• 9.css的动画和js的动画一般哪个更快，说出原因
  css更快，因为css支持gpu加速，以及css动画(transform)直接属于合成事件，不用回流重绘，js动画操作dom会涉及回流重绘，明显开销大于css动画

• 10.箭头函数和普通函数有什么区别
  箭头函数的this和外层非箭头函数的内部this一致，箭头函数不能用作构造函数，call/bind/apply不能改变箭头函数this的指向

• 11.var，let，const的区别
  – var有变量提升，另两个没有
  – var允许重复声明，另两个不行
  – var没有块级作用域，let和const有
  – 全局作用域里面，var声明的变量和函数都会变成window对象的变量属性和方法，另两个不会
  – const声明常量后不能重新赋值，否则报错，let/var可重新赋值

• 12.xhr和fetch有什么区别
  xhr是ajax核心，xhr=>ajax=>axios，fetch更像promise的写法，fetch不自带cookie，没有办法监测原生请求的进度，只对网络请求报错，fetch是不基于xhr的，底层其实是基于Promise

• 13.处理跨域的方式有哪些
  websocket/cors/jsonp/nginx…

• 14.Promise.all和Promise.race的区别
  两者都传入一个数组，数组里都是异步任务，all的作用就是等所有异步任务结束之后统一按函数中参数写的顺序输出结果（有一个reject就立刻停止），race则是有一个异步任务结束（最快的那个，不管成功失败），就输出该任务结果，然后race函数停止运行

• 15.async/await和Generator的区别
  前者es7引进，后者es6引进，其实前者就是对后者的封装，前者不用.next，写起来方便，async函数的返回值是Promise对象，后者返回的是Iterator对象

• 16.useEffect，useState，useMemo的区别
  useEffect在页面初次挂载之后才执行，或者deps变化之后才执行，useState负责接收值的更新，set新值之后，页面会刷新，但是注意涉及到同步异步问题以及合并更新问题（参考React18的相关改进），useMemo是缓存了一个值（或者对象啥的），页面重新加载时，本来按道理对象会重新生成，组件如果使用这个对象作props，会重新渲染，useMemo避免了这种不必要的重渲染，节省开销

• 17.React类组件和函数式组件生命周期有区别吗，useEffect相当于类式组件的哪个生命周期
  基本一致，useEffect相当于componemtdidmount+componentdidupdate+componentwillunmount（稍对useEffect加一些改变即可）

• 18.不用别人的组件库，有写过自己的组件吗
  略，暂时还没写过

以下为三道js手写题（只能使用原生js）

• 1.写一个节流函数
• 2.把一个对象按照key的字母序排列然后输出，写出该函数
• 3.写一个queryString函数，当输入字符串时，比如"a=1&b=2&b=3"，需输出转化后的对象{a:1,b:[2,3]}；当输入对象时，比如输入{a:1,b:[2,3]}，需输出转化后的字符串"a=1&b=2&b=3"

以下是1面补充提问

• 19.对于手写题1，防抖和节流有什么区别
• 20.对于手写题2，如果一个对象里面嵌套了很多个对象，对于每个子对象都必须按照key的字母序排列然后输出，怎么做
• 21.对于手写题3，如何采用正则表达式判断输入为字符串时，字符串是否符合题中所给格式

---