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）的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！
您可能喜欢
栏目导航