Java教程

基于TOP-K的面试题解总结(1)

本文主要是介绍基于TOP-K的面试题解总结(1),对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
1.Vue 中双向数据绑定的实现原理是怎样的?
  • 核心方法就是通过Object.defineProperty( )在setter和getter里面进行设置
  • 实现一个监听器Observer,用来劫持并监听所有属性,如果有变动的,就通知订阅者。
  • 实现一个订阅者Watcher,可以收到属性的变化通知并执行相应的函数,从而更新视图。
  • 实现一个解析器Compile,可以扫描和解析每个节点的相关指令,并根据初始化模板数据以及初始化相应的订阅器。
2. 什么是闭包,什么是立即执行函数,它的作用是什么?简单说一下闭包的使用场景
  • 闭包:
    • 闭包是一个函数
    • 闭包可以访问当前函数以外的变量
    • 即使外部函数已经返回,闭包仍能访问外部函数定义的变量
    • 闭包可以更新外部变量的值
    • 使用场景:
      • 作为回调函数绑定到事件
      • 函数防抖
  • 立即执行函数:
    • 声明一个函数,并马上调用这个匿名函数就叫做立即执行函数。 函数在定义以后立即执行
    • 作用:
      • 不必为函数命名,避免了污染全局变量
      • 立即执行函数内部形成了一个单独的作用域,可以封装一些外部无法读取的私有变量
      • 封装变量
(function(){ //code }())   (function (){ //code })()   3.  简述浏览器中URL到页面展示的渲染过程,重绘和重排在渲染过程中的哪一部分?
  • 渲染过程
    • URL解析:判断URL是否合法并完成字符编码
    • 查询缓存:检查浏览器缓存,检查之前是否访问过该URL所对应的IP
    • DNS解析:如果浏览器、DNS缓存都没有记录,则开始DNS解析,将域名转化为IP进行网络请求
    • HTTP连接:通过DNS解析得到的IP地址,进行TCP数据请求(三次握手,四次挥手),发送请求报文
    • 服务器处理请求:创建http响应报文,将资源信息放到响应报文的响应体(body)中并返回
    • 浏览器响应报文:浏览器根据报文的状态码(200,302,304,404,502,504等)进行相应操作
            • 200请求正常:接收正常的返回信息,开始渲染页面
            • 302缓存过期:根据响应报文的location,再次发送访问请求
            • 304缓存有效:直接使用缓存中页面源文件即可
            • 404Not Found:找不到对应服务器
            • 502请求方式错误:get,post等方式错误
            • 504服务器响应超时:服务器问题
    • 浏览器渲染页面:
      • 根据html文件构建DOM树
      • 根据CSS文件构建CSSOM树
      • 根据DOM树和CSSOM树构建渲染树
      • 计算每个节点的大小和位置信息,对渲染树进行布局
      • 按照布局绘制显示渲染树
  • 重排: 当通过JS或css改变了元素的宽度、高度等,修改了元素的几何位置属性,那么浏览器会触发重新布局,解析之后的一系列子阶段,这个过程就叫重排。例如修改了width、display,margin等等。
  • 重绘: 如果修改了元素的背景颜色,并没有引起几何位置的变换,所以就直接进入了绘制阶段,然后执行之后的一系列子阶段,这个过程就叫重绘。例如修改了color,border-radius,background等等。
  4.   简述 diff 算法的实现机制和使用场景
  • diff算法:计算两颗树形结构差异并进行转换,运用动态规划求解最长递归子序列
    • 传统:循环递归每一个节点,将左侧树的每一个节点拿出与右侧树每个节点进行对比,算法复杂度是O(n^3)
    • Vue:
      • 比较只会在同层级进行,不会跨层级比较
      • diff过程依靠调用patch函数,通过打补丁方式修改真实dom
      • 采用了双端比较的算法,同时从新旧children的两端开始进行比较,借助key值找到可复用的节点,再进行相关操作。
  • 使用场景:Vue中通过diff算法比较虚拟DOM和真实DOM中节点是否相似来进行DOM更新
这篇关于基于TOP-K的面试题解总结(1)的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!