皮皮网

1.Underscore源码分析
2.原来 JS 的 Array.sort 是插入排序和快速排序的集合！
3.为什么 querySelectorAll 返回的不是 Array?

Underscore源码分析

       JavaScript，作为最被低估的编程语言之一，自从Node.js的出现，全端开发（All Stack/Full Stack）概念日渐兴起，现今，vc 碎片清理源码其地位不可小觑。JavaScript实质上是一种类C语言，对于具备C语言基础的学习者，理解JavaScript代码大体上较为容易，然而，作为脚本语言，JavaScript的灵活性远超C语言，这在一定程度上给学习者带来了一定的困难。

       集合是JavaScript中一种重要的概念，下面我们就来看看其中的几个迭代方法。

       首先，vue引入项目源码集合中的迭代方法包括`_.each`和`_.forEach`，这两个方法在功能上基本一致，主要用于对集合进行遍历。它们接受三个参数：集合、迭代函数和执行环境。其中，`_.each`和`_.forEach`在ES6中为数组添加了原生的`forEach`方法，但后者更灵活，能够应用于所有集合。

       `_.each`和`_.forEach`在遍历时会根据集合的类型（类数组或对象）调用不同的实现。如若集合有`Length`属性且为数字且在0至`MAX_ARRAY_INDEX`之间，则判定为类数组，否则视为对象集合。在遍历过程中，`_.each`和`_.forEach`会根据集合的特性使用合适的迭代方式。

       在处理集合时，萝卜视频4.4.5源码`_.map`和`_.reduce`方法的实现原理类似，`_.map`用于获取集合中元素的映射结果，而`_.reduce`则用于逐元素执行函数并逐步聚合结果。

       此外，`_.find`函数与`Array.some()`具有相似性，不同之处在于`_.find`返回第一个使迭代结果为真的元素，而`Array.some()`则返回一个布尔值。`_.find`和`_.detect`函数基于`_.findIndex`和`_.findLastIndex`实现，它们分别在正序和反序的情况下查找满足条件的元素。

       在处理集合时，`_.max`方法用于寻找集合中的最大值，通过循环比较集合中的所有项，最终返回最大值。`_.toArray`则负责将各种类型的集合转换为数组，确保数据的格式统一。对于数组、极具价值指标源码类数组对象、普通对象以及null或undefined的情况，`_.toArray`分别采用了不同的处理方式，确保了转换过程的灵活性与准确性。

       至于集合转换为数组的问题，JavaScript中的数据类型多样，理解它们之间的区别对于开发者来说至关重要。然而，`_.toArray`函数的设计似乎更侧重于处理特定类型的数据，而不仅仅基于JavaScript的基本数据类型。在实际应用中，开发者需要根据具体场景灵活运用这些工具，以实现高效、准确的数据处理。

原来 JS 的 Array.sort 是插入排序和快速排序的集合！

       深入解析 JS 数组的易源码密码解除 `sort` 方法，你将发现它是快速排序和插入排序的巧妙结合。这篇文章带你探索 `sort` 方法的内部实现，了解它如何根据数组的长度选择合适的排序算法，从而提升编程思维。

       `sort` 方法的基本使用涉及到对数组元素进行排序，返回的是排序后的数组引用。默认情况下，数组元素会被转换为字符串，然后按照 UTF- 码元值进行升序排序。此排序行为依赖于具体实现，因此其时间和空间复杂度无法保证。

       为了自定义排序顺序，可以提供一个 `compareFunction` 函数，用于比较两个元素，并返回一个数字，正负性表示两个元素的相对顺序。这个函数使用一系列参数调用，确保排序过程符合预期。

       若未提供 `compareFunction`，所有非 `undefined` 的数组元素将转换为字符串进行排序。数值排序时，9 在 之前排序，但在 Unicode 顺序中，“”排在“9”之前。所有 `undefined` 元素会被排列到数组末尾。

       接下来，让我们探索 `sort` 方法的底层实现。在 V8 内部，`sort` 方法对于多种边界情况进行了优化，其源码揭示了有趣实现。对于数组长度 n 的不同情况，`sort` 方法采用了不同的排序算法。

       当 n 小于等于 时，插入排序被采用；插入排序是一种直观简单的排序算法，通过构建有序序列，扫描未排序数据，找到相应位置并插入，实现排序效果。插入排序在小数据集上性能优越，尤其是在数据量足够小时，其性能优于快速排序或合并排序。

       当 n 大于 时，快速排序成为首选。快速排序的基本思想是通过一趟排序将待排记录分隔成独立两部分，其中一部分记录的关键字均比另一部分的小，递归地对这两部分进行排序。快速排序的核心是“三路切分”，通过一个整数 x 将数组切分成小于、等于、大于三部分，实现时间复杂度 O(N)，空间复杂度 O(1)。

       具体来说，当 n 小于 时，直接取中点作为三路切分的中位数。当 n 大于 时，通过挑选元素排序后取中位数。这样的设计旨在优化排序性能，避免在某些极端情况下退化为 O(n^2) 级别的时间复杂度。

       总之，`sort` 方法结合了快速排序和插入排序，根据数组长度选择最优排序算法。当数据量较小（n 小于等于 ）时，插入排序性能更优；当数据量较大时，快速排序的性能优势显著。深入理解 `sort` 方法的实现逻辑，有助于提升 JavaScript 编程能力，增强对算法的理解。

为什么 querySelectorAll 返回的不是 Array?

       查询所有元素涉及到的规范与数组规范不同，因此查询所有元素返回的不是数组类型。

       从规范角度看，查询所有元素属于 DOM 规范，而数组属于 ECMAScript 规范。DOM 规范强调平台中立性，但并未在规范中提及与数组相关的概念。

       实际上，查询所有元素返回的是 NodeList 类型，这与数组有本质区别。Array 类型来源于 ECMAScript 规范，而 NodeList 则是 DOM 中用于表示一组节点的类。

       具体到源码层面，Chromium 的实现中，查询所有元素返回的是 StaticElementList 类型。该类封装了选择器字符串并提供了节点集合，但与 JavaScript 数组的实现不同。

       JavaScript 数组由 V8 引擎实现，其长度属性通过特定的偏移量在 JSArray 对象上获取。与此相反，StaticElementList 的长度属性计算逻辑与 JavaScript 数组完全不同。

       综上，查询所有元素返回的 NodeList 不是 Array 类型的原因，主要在于两者所属的规范体系不同，以及在实现细节上的差异。