面试题系列均来自鱼皮的知识星球——编程导航

JS 为什么存在数字精度丢失的问题，如何解决？

JavaScript 存在数字精度丢失的问题是因为它使用的是基于 IEEE-754 标准的双精度浮点数格式，即使用 64 位来存储数字，其中只有 53 位用于存储有效数字。这意味着当数字的位数超过 53 位时， JavaScript 将不得不丢失一些精度。

解决这个问题的方法通常有：

  1. 使用 JavaScript 的内置 BigInt 类型，它可以表示任意长度的整数。BigInt 类型是在 ECMAScript 2020 标准中引入的，因此可能不受所有浏览器的支持。
  2. 使用第三方库，如 big.js、decimal.js 等。这些库使用不同的算法来处理数值，可以避免丢失精度问题。
  3. 将数值转化为字符串进行处理，可以使用一些库来进行数值的精确计算。
  4. 避免使用小数运算，可以将小数转化为整数进行运算，再将结果转化为小数。

例如，可以使用 toFixed() 方法将浮点数转化为字符串，并指定小数位数来避免精度丢失：

1
2
3
4
javascriptCopy codelet a = 0.1;
let b = 0.2;
let c = a + b;
console.log(c.toFixed(1)); // 输出 0.3

总之，由于 JavaScript 使用的是双精度浮点数格式，因此在进行数值处理时，应该注意避免超出精度的数字运算，或者使用正确的方法来处理精度丢失的问题。

什么是前端跨平台？你用过哪些跨平台框架？

前端跨平台通常指的是使用一种代码语言或框架开发应用，然后在多个不同的操作系统或设备上运行应用的能力。这样可以避免为每个平台分别开发应用程序的麻烦，减少了开发时间和成本，提高了开发效率。

常见的前端跨平台框架包括：

  1. React Native：用于构建iOS和Android应用程序的开源框架，基于React构建。
  2. Flutter：一个由Google开发的开源框架，可用于快速构建高性能、美观的Android和iOS应用程序。
  3. Electron：一个使用Web技术（HTML、CSS和JavaScript）构建跨平台桌面应用程序的开源框架。
  4. Ionic：一个基于HTML、CSS和JavaScript的开源框架，用于构建跨平台移动应用程序。
  5. Weex：阿里巴巴推出的用于构建Android和iOS应用程序的框架，使用Vue构建。
  6. Uniapp是一款基于Vue.js的跨平台开发框架，它可以用于构建iOS、Android、Web、以及各种小程序（如微信小程序、支付宝小程序等）等应用程序。

我之前使用过React Native和Electron框架。其中React Native用于开发一个婚礼管理App，Electron用于构建一个简单的桌面应用程序。这些跨平台框架都提供了良好的跨平台兼容性和可移植性，使得开发人员可以将更多的精力放在业务逻辑的开发上，而不用担心跨平台的问题。

什么是 Javascript 的事件流？有哪些事件流模型？

JavaScript 的事件流（Event Flow）指的是浏览器中处理事件时所采用的机制和流程。当用户和 DOM 元素交互时，浏览器会按照一定的规则决定事件从哪个元素开始，经过哪些元素，最终到达目标元素，并触发相应的事件。

JavaScript 的事件流有三种模型：

  1. 事件冒泡（Bubbling）：事件从目标元素开始向上冒泡，逐步传递到父元素，直到根元素。可以使用 stopPropagation() 方法停止事件冒泡。
  2. 事件捕获（Capturing）：事件从根元素开始向下捕获，逐步传递到子元素，直到目标元素。不同于事件冒泡的是，事件捕获需要在父元素阶段处理该事件，再传递到目标元素。可以使用 addEventListener() 方法设置监听器，第三个参数为 true 时即表示使用事件捕获。
  3. DOM0 级事件处理程序：也称为“传统事件模型”，是一种将事件处理函数直接绑定到 DOM 元素上的方式。这种方式只支持事件冒泡，并且会覆盖同一元素上已有的事件处理函数。

事件流模型的使用取决于事件需要处理的元素层级和业务需求。默认情况下，addEventListener() 方法使用事件冒泡模型，而且通常情况下使用事件冒泡模型更为通用，只有在特定需求下才需要使用事件捕获模型。