面经-2022-秋招-腾讯wxg一面-问的很细

大厂面试题
发布日期:   2024-01-10
更新日期:   2024-04-13
文章字数:   6.1k
阅读时长:   21 分
阅读次数:  

[TOC]

1.小程序开发中遇到过什么问题？怎么解决的

  1. 界面布局混乱：在进行小程序开发时，需要仔细规划每个组件的位置和大小，避免出现重复或遗漏的情况。可以通过使用小程序框架提供的Flex布局和Grid布局等技术来解决。
  2. 数据获取失败：小程序在使用网络请求时，需要及时捕获错误并进行处理。可以通过封装网络请求的方法，加入错误处理和重试机制，避免数据获取失败。
  3. 页面加载速度慢：可以通过使用小程序框架提供的分包加载技术，将小程序的页面和功能分成若干模块，每次只加载需要的模块，从而提高小程序的加载速度。
  4. 兼容性问题：不同的设备、操作系统和版本对小程序的兼容性要求不同。开发时需要考虑不同平台和屏幕尺寸的适配，以保证在各种设备上正常运行和显示。

2.跨端方式有哪几种解决方案？

跨端方式主要有以下几种解决方案：

  1. Web 天然跨平台：Web App、PWA（Progressive Web Apps）、Hybrid App、PHA（Progress Hybrid App）都可以实现跨平台。WebView 是一种基于浏览器内核的跨平台解决方案，通过在移动应用中嵌入一个浏览器组件，可以使用 HTML、CSS 和 JavaScript 来构建应用界面和逻辑。这种方案可以快速开发应用，同时具备一定的跨平台能力，因为 WebView 在不同的平台上基本上都有良好的支持。但是，由于 WebView 的性能和原生应用相比较差，且无法完全融入操作系统的特性，因此在一些对性能和用户体验要求较高的场景中，可能不太适合使用。
  2. 容器化 Native 跨端：这种方案主要基于原生应用的能力，通过将应用的业务逻辑封装成一个容器，在不同平台上进行适配和渲染，从而实现跨平台。这种方案通常使用一种统一的开发语言和框架，如React Native、Flutter、Ionic等，来编写应用逻辑，并通过桥接层将原生的API暴露给开发者。这样可以在一定程度上实现代码的重用，并且性能较好，能够更好地融入操作系统的特性。但是由于底层仍然使用了原生组件和功能，因此在一些特定平台的适配上可能需要额外的工作。
  3. 小程序跨平台方案：小程序跨平台是一种相对较新的跨平台方案，微信、支付宝等巨头的小程序框架不统一，于是有了FinClip、Taro、kbone等一系列跨小程序框架的方案。小程序提供了一种相对封闭的开发环境和运行时，开发者可以使用一种统一的技术栈（如基于HTML、CSS和JavaScript的开发方式）来构建应用，并在不同平台上运行。
  4. 小程序跨端技术是编译时和运行时的结合方案。编译时和运行时是软件开发里面用于描述两个不同的软件开发阶段。开发一个程序，程序员首先需要写源代码（Source Code），来完成程序的功能。源代码需要被编译成机器可以识别的程序，这个编译过程被称为编译时。用户可以运行编译过的程序，程序运行的过程被称为运行时。小程序多端方案主要有：类 Vue 风格框架、类 React 风格框架、自定义 DSL 框架。

3.字节小程序和微信小程序有什么区别

字节小程序和微信小程序在多个方面存在差异：

  1. 应用场景：微信小程序主要应用于社交、电商、教育等领域，而字节小程序则主要应用于内容分发、电商等方面，两者在应用场景上有所不同。
  2. 开发技术：微信小程序基于微信开发平台，使用的是小程序开发框架，而字节小程序则基于字节跳动开发平台，使用的是字节小程序开发框架。两者在开发技术上存在差异。
  3. 开放能力：微信小程序开放了很多接口和组件，提供了丰富的能力，包括位置信息、支付、扫码等，而字节小程序则相对较少，主要依赖于抖音等字节跳动系产品提供的能力。
  4. 推广方式：微信小程序可以通过微信朋友圈、公众号等方式进行推广，而字节小程序则主要通过抖音等字节跳动系产品进行推广。

4.Uni-app框架做了什么工作、处理？

Uni-app是一个跨平台开发框架，它提供了一系列的功能和工具，帮助开发者快速构建跨平台的应用。

  1. 组件库：Uni-app提供了一套丰富的组件库，包括基础组件、表单组件、交互组件等等，这些组件可以在开发中被多次使用，通过拖拽组件来快速构建页面。
  2. 页面设计：在Uni-app中，可以创建多个页面，每个页面可以有不同的模板、不同的组件和不同的样式。开发人员可以通过页面设计实现页面样式和布局的构建。
  3. 状态管理：Uni-app提供了一种称为Vuex的状态管理方案，通过Vuex，开发者可以将应用中的状态统一管理和控制，避免了状态分散、难以维护的问题。
  4. 代码编辑：Uni-app中内置了Code Snippet，这是一种代码块，它可以帮助开发人员节省大量的时间和代码。Code Snippet可以在代码编辑器中自动补全代码，并可以帮助开发人员快速完成代码片段，避免了大量重复性的代码编写。
  5. 预览和调试：Uni-app支持在IDE中直接进行预览和调试，这样的调试方式可以省去开发者在多个平台中来回切换的过程。同时，Uni-app还提供了具有一定模拟性的多平台真机预览模拟器，也可以帮助开发者更加直观地了解应用在不同平台中的表现。

5.用Uni-app开发的过程中遇到过什么问题？怎么解决的？

在使用Uni-app开发过程中，可能会遇到一些问题，以下是一些常见的问题以及相应的解决方法：

  1. 渲染问题：在某些情况下，Uni-app可能会出现渲染问题，例如在页面滚动时可能会出现卡顿或闪烁的情况。这可能与Uni-app的运行机制有关，因为Uni-app是使用Web技术来开发原生应用的，所以它在渲染时需要将Web页面转换为原生页面，这个过程中可能会出现一些问题。

解决方法：可以尝试优化页面的渲染性能，减少重排和重绘，使用双缓冲技术来减少闪烁和卡顿的情况。同时，可以使用Uni-app提供的异步组件和按需加载功能，来提高应用的启动速度和渲染性能。
2. 性能问题：由于Uni-app需要同时支持多个平台，因此它在某些情况下可能会出现性能问题。例如，在处理大量数据或进行复杂的计算时，Uni-app可能会出现卡顿或延迟的情况。
解决方法：对于性能问题，可以通过优化代码和减少不必要的操作来提高应用的性能。例如，可以使用异步操作来避免长时间阻塞主线程，优化数据结构和算法来减少计算量，以及使用缓存和按需加载等技术来减少请求次数和数据量。

6.从输入网址到整个渲染过程描述？

  1. 输入网址：用户在浏览器地址栏输入要访问的网址。
  2. DNS解析：浏览器将网址解析为对应的IP地址。DNS（Domain Name System）是用来将域名转换为IP地址的系统。
  3. 建立TCP连接：浏览器与服务器之间建立TCP连接，这是传输控制协议的一种，用于在网络中建立可靠的、面向连接的通信通道。
  4. 发送HTTP请求：浏览器向服务器发送HTTP请求，请求中包含了要获取的网页地址。
  5. 服务器响应：服务器接收到请求后，处理请求并返回响应。响应中包含了请求的网页内容，如HTML、CSS、JavaScript等。
  6. 解析和渲染HTML：浏览器接收到HTML代码后，开始解析和渲染页面。解析过程中，浏览器会根据HTML代码生成DOM树，DOM树是网页内容的结构化表示。
  7. 解析和渲染CSS：同时，浏览器会解析CSS代码，生成CSS Rule Tree。DOM树和CSS Rule Tree共同决定了页面的最终呈现效果。
  8. 解析和执行JavaScript：浏览器还会执行页面中的JavaScript代码，这些代码可能会修改DOM树或CSS Rule Tree，导致页面的重新渲染。
  9. 渲染完成：当页面解析、渲染完成后，用户就可以看到完整的网页内容了。

7.除了HTTP缓存还有什么缓存方式？

除了HTTP缓存，还有以下几种常见的缓存方式：

  1. 本地存储（Local Storage）：这是HTML5提供的一种在客户端存储大量结构化数据的机制，一般用于存储JSON数据。Local Storage的数据是存储在用户的浏览器上的，因此即使浏览器关闭，数据也不会丢失。
  2. 会话存储（Session Storage）：与Local Storage类似，会话存储也是HTML5提供的一种在客户端存储数据的机制。不同之处在于，会话存储的数据在浏览器关闭后会被清除。
  3. Cookies：Cookies是一种在浏览器和服务器之间传递信息的机制，通常用于存储用户身份验证信息和会话状态。然而，由于Cookie的大小限制（通常为4KB）和安全性问题，对于大量数据的存储并不适用。
  4. 缓存代理（Cache proxies）：这种缓存方式是在Web服务器和应用服务器之间引入一层缓存代理，所有的请求都会先经过代理服务器，再转发给应用服务器。代理服务器可以缓存来自应用服务器的响应，减少对后端服务器的请求。
  5. 反向代理（Reverse proxies）：反向代理与缓存代理类似，它也是部署在Web服务器和应用服务器之间的一层。不同的是，反向代理会直接处理用户的请求，然后将处理结果返回给用户。通过配置反向代理的缓存策略，可以实现对静态资源的缓存，进一步减少对后端服务器的请求。

8.HTTP缓存、localstorge、sessionstorge、cookie、indexDB这些方式实现缓存有什么区别、特点

HTTP缓存、LocalStorage、SessionStorage、Cookies和IndexedDB这些缓存方式各自有不同的特点和使用场景。

  1. HTTP缓存：
  • 特点：由浏览器和服务器之间进行管理和控制，通过HTTP协议的响应头中的Cache-Control、ETag、Last-Modified等字段进行缓存控制。
  • 适用场景：适用于在多个页面或请求之间共享的数据，例如图片、CSS文件、JavaScript文件等。
  • 限制：HTTP缓存机制对于单个页面的动态内容或者需要个性化设置的内容并不适用。
  1. LocalStorage：
  • 特点：存储的数据没有过期时间，除非手动删除或者清空，数据会一直存在。数据以键值对的形式存储，可以存储大量结构化数据。
  • 适用场景：适用于存储不需要频繁更新的数据，例如用户的偏好设置、登录状态等。
  • 限制：LocalStorage的数据是存储在用户的浏览器上的，因此安全性较低，且不同的浏览器有各自的存储限制。
  1. SessionStorage：
  • 特点：与LocalStorage类似，但存储的数据在浏览器窗口或选项卡关闭后会被清除。
  • 适用场景：适用于存储用户会话期间的数据，例如用户在购物车中添加的商品列表。
  • 限制：与LocalStorage一样，数据存储在用户的浏览器上，并且有存储大小的限制。
  1. Cookies：
  • 特点：可以用来存储小量数据，通常用于跟踪用户会话、存储登录状态等。数据在浏览器和服务器之间进行传输。
  • 适用场景：适用于需要跟踪用户行为或个性化设置的情况，例如记录用户偏好、购物车内容等。
  • 限制：由于Cookie的大小限制（通常为4KB）和安全性问题，对于大量数据的存储并不适用。另外，如果Cookie中存储的数据过多，会影响页面加载速度。
  1. IndexedDB：
  • 特点：IndexedDB是一个基于JavaScript的客户端存储API，可以存储大量结构化数据，包括文件/二进制对象。它提供了对数据的查询和索引功能。
  • 适用场景：适用于在客户端存储大量结构化数据的情况，例如离线应用、游戏数据存储等。
  • 限制：IndexedDB的使用相对复杂，需要对数据进行操作和管理。另外，IndexedDB在不同的浏览器中的实现和性能可能会有差异。

9.做过CDN相关的工作吗？

我从事过CDN相关的工作，主要涉及CDN系统的缓存策略制定、缓存内容管理、缓存系统性能优化等方面。

10.CDN有什么好处呢？

CDN（内容分发网络）有很多好处，以下是其中的一些：

  1. 提高网站的响应速度：CDN将内容节点分布到全球各地，使得用户可以就近获取所需内容，降低网络延迟，提高网站响应速度。
  2. 提升用户满意度：通过CDN加速，可以大大提升用户访问网站的速度，尤其对于跨国或跨地区的访问，效果更为显著。用户满意度的提升能够带来更多的回头客，增加网站流量。
  3. 降低服务器压力：CDN能够分担服务器的负载，将内容的分发压力转移到各个节点上。这有助于减轻服务器压力，提高网站的稳定性和可靠性。
  4. 提升网站的性能和可扩展性：CDN通过缓存技术和负载均衡技术，优化数据传输路径，提高数据传输速度。这使得网站能够更好地应对大规模并发流量的挑战，提升网站的扩展性和稳定性。
  5. 保障网站安全：CDN具有一定的安全防护功能，可以抵御DDoS攻击等网络攻击，增强网站的安全性。同时，通过隐藏源站IP地址等措施，可以保护用户隐私和数据安全。
  6. 降低运营成本：CDN能够降低带宽成本和服务器成本，减轻运维压力。通过合理配置缓存策略和节点分布，可以最大化资源利用效率，降低运营成本。
  7. 提升搜索引擎排名：CDN能够加快网页的加载速度，提高搜索引擎的排名。这有助于提高网站的曝光率和流量。

11.聊参与的开源项目技术栈、云开发

编程导航

12.进程和线程的区别？

进程和线程是操作系统中的两个基本概念，它们都涉及到程序的执行，但又有一些重要的区别。

  1. 首先，进程是操作系统分配资源的基本单位，每个进程都有独立的内存空间和系统资源，相互之间互不干扰。而线程是进程的一个执行单元，一个进程至少包含一个线程，这个线程被称为主线程。

  2. 其次，线程的创建、切换和销毁的开销通常比进程小。因为线程共享其父进程的资源，所以多个线程之间的切换很快，而且系统在切换线程时只需保存和恢复线程的上下文信息，不需要像进程那样保存和恢复整个进程的上下文信息。

  3. 此外，进程是独立的，一个进程出现问题不会影响其他进程的执行。而线程是进程的一部分，一个线程的错误可能导致整个进程的崩溃。

在并发性方面，一个进程可以包含多个线程，这些线程可以同时执行。因此，进程的并发性高于线程。但因为每个线程都共享进程的资源，所以多个线程之间可以通过共享内存直接通信，这使得线程间通信更加高效。

13.进程间通信方式有哪些？

进程间通信方式有多种，以下是其中一些常见的进程间通信方式：

  1. 管道（Pipe）：管道是一种半双工的通信方式，数据只能单向流动。它通常用于具有亲缘关系的进程之间的通信。管道可以分为无名管道和有名管道。
  2. 信号（Signal）：信号是一种比较复杂的通信方式，用于通知接收进程某个事件已经发生。
  3. 消息队列（Message Queue）：消息队列是由消息的链表，存放在内核中并由消息队列标识符标识。消息队列克服了信号传递信息少、管道只能承载无格式字节流以及缓存区大小受限等缺点。
  4. 共享内存（Shared Memory）：共享内存是一种高效的进程间通信方式，多个进程可以共享同一块内存空间。共享内存允许多个进程之间快速地交换数据，但需要同步机制来防止数据冲突。
  5. 套接字（Socket）：套接字也是一种进程间通信的机制，与其他通信机制不同的是，它可用于不同机器之间的进程通信。套接字可以基于多种协议（如TCP、UDP等）进行通信，支持各种数据传输模式。

14.有用过Mysql？讲解一下什么是事务？

  1. 原子性（Atomicity）：事务被视为不可分割的最小工作单元，整个事务中的所有操作要么全部提交成功，要么全部失败，对于一个事务来说，不可能只执行其中的一部分操作。
  2. 一致性（Consistency）：事务必须使数据库从一个一致性状态变换到另一个一致性状态。所谓一致性，指的是数据处于一种有意义的状态，这种状态是语义上的而不是语法上的。
  3. 隔离性（Isolation）：一个事务的执行不能被其他事务干扰。即一个事务内部的操作及使用的数据对并发的其他事务是隔离的，并发执行的各个事务之间不能互相干扰。
  4. 持久性（Durability）：一旦事务提交，它对数据库中数据的改变是永久性的。接下来的操作或故障不应对其有任何影响。

15.二叉树有哪些遍历方式？哪些属于DFS?

二叉树的遍历方式主要有四种：前序遍历、中序遍历、后序遍历和层次遍历。

  1. 前序遍历（Preorder Traversal）：首先访问根节点，然后递归地遍历左子树，最后递归地遍历右子树。
  2. 中序遍历（Inorder Traversal）：首先递归地遍历左子树，然后访问根节点，最后递归地遍历右子树。
  3. 后序遍历（Postorder Traversal）：首先递归地遍历左子树，然后递归地遍历右子树，最后访问根节点。
  4. 层次遍历（Level Order Traversal）：按照树的层次，从上到下、从左到右遍历节点。

16.有用过预处理器吗？有什么特点？

没有

17.有考虑过多主题样式吗？怎么实现？

在Web开发中，多主题样式的实现通常依赖于CSS预处理器，如Sass、Less等。这些预处理器提供了强大的变量、混入（mixin）、扩展等特性，使得多主题样式的实现变得相对简单。

一种常见的做法是使用变量来定义主题的颜色、字体等基础样式，然后在不同的主题中重写这些变量。这样，只需要修改几个变量值，就可以轻松地切换主题。

例如，在Sass中，可以这样定义变量：

$primary-color: #3498db;
$secondary-color: #e74c3c;

然后在样式中使用这些变量：

body {
  color: $primary-color;
}

a {
  color: $secondary-color;
}

要切换主题，只需要修改变量的值：

$primary-color: #e74c3c;
$secondary-color: #3498db;

然后重新编译样式表，即可生成新的主题样式。

18.Node用过吗？用过哪些相关框架？做过哪些东西？

在使用Node.js的过程中，我使用过Express框架来构建Web应用程序的API。Express是一个轻量级的Web应用程序框架，它提供了许多有用的功能，如路由、中间件、模板引擎等，使得开发Web应用程序变得更加简单。

19.手撕jsonStringfy

JSON 序列化（stringify）是一个将 JavaScript 对象或值转换为 JSON 格式的字符串的过程。JavaScript 提供了内置的 JSON.stringify() 方法来完成这个任务。但如果你想手动实现这个功能，以下是一个简单的例子：

function stringifyJSON(obj) {
    var str = "[";
    for (var key in obj) {
        if (str != "[") { str += ","; }
        str += "{\"key\":\"" + key + "\", \"value\":\"" + obj[key] + "\"}";
    }
    str += "]";
    return str;
}

var obj = { "name": "John", "age": 30, "city": "New York" };
console.log(stringifyJSON(obj));  
// 输出: [{"key":"name","value":"John"},{"key":"age","value":"30"},{"key":"city","value":"New York"}]

这个 stringifyJSON 函数将一个对象转换为一个 JSON 格式的字符串。它首先创建一个空字符串 str，然后遍历对象的每个属性。对于每个属性，它创建一个包含属性名和属性值的 JSON 对象字符串，然后将这个字符串添加到 str 中。最后，它返回 str。

20.实现JSON.parse的思路？除了eval和new Function（AST、编译原理）

实现 JSON.parse 的基本思路是使用递归下降解析或基于生成器的解析。

递归下降解析

  1. 词法分析 (Lexical Analysis): 将输入的 JSON 字符串分割成一个个的 token，如 {, }, [, ], ", :, ,, true, false, null 等。
  2. 语法分析 (Syntax Analysis): 根据 JSON 的语法规则，使用这些 token 构建一颗解析树。
  3. 语义分析: 对解析树进行解释，生成 JavaScript 对象。

实现步骤

  1. 词法分析: 你可以使用正则表达式或简单的字符串操作来识别和提取 JSON 中的各种 token。

  2. 语法分析: 构建解析树的过程包括：

    • 识别并处理开/闭的大括号 { 和 }，以及开/闭的方括号 [ 和 ]。

    • 识别并处理键值对，包括键、冒号和值。

    • 递归地处理嵌套的对象和数组。

  3. 语义分析: 一旦你有了解析树，你可以遍历它并使用 JavaScript 对象来填充相应的值。

注意点

  • 错误处理: 需要处理各种可能的错误，如无效的 JSON、缺失的逗号、额外的逗号等。
  • 性能: 由于这个过程是递归的，对于大的 JSON 数据，可能会遇到堆栈溢出的问题。可以考虑使用迭代的方式来解决这个问题。
  • 安全性: 使用 eval 或 new Function 有安全风险，因为它们允许执行任意的 JavaScript 代码。在实现自己的解析器时，要确保输入是可信的或经过适当的清理和验证。

作者：前端LeBron
原文链接：https://juejin.cn/post/7025793782998106149

文章作者: 千羽
文章链接: https://nateshao.gitlab.io/2024/01/10/mian-jing-2022-qiu-zhao-teng-xun-wxg-yi-mian-wen-de-hen-xi/
版权声明: 本博客所有文章除特別声明外，均采用 CC BY 4.0 许可协议。转载请注明来源 千羽 !
大厂面试题
赏
评论
  目录