Lodash学习笔记 - compact函数

habren 发布于2019-08-22 15:25 / 2032人阅读

摘要：文档地址中文文档英文文档源码地址创建一个新数组，包含原数组中所有的非假值元素。例如和都是被认为是假值。下面对比一下两者效率，如下图传送门可以看到使用更快，如果没有兼容性需求，还是使用原生函数比较好。

百忙之中（闲来无事）想抽点时间好好读一下源码，于是就选了Lodash来写一个系列罢。读源码顺序就按照loadsh文档顺序来。

文档地址：中文文档英文文档
源码地址：gayhub

   _.compact(array)

创建一个新数组，包含原数组中所有的非假值元素。例如false, null, 0, "", undefined, 和 NaN 都是被认为是“假值”。
代码比较简单，直接上源码：

   /**
 * Creates an array with all falsey values removed. The values `false`, `null`,
 * `0`, `""`, `undefined`, and `NaN` are falsey.
 *
 * @since 0.1.0
 * @category Array
 * @param {Array} array The array to compact.
 * @returns {Array} Returns the new array of filtered values.
 * @example
 *
 * compact([0, 1, false, 2, "", 3])
 * // => [1, 2, 3]
 */
function compact(array) {
  let resIndex = 0
  const result = []

  if (array == null) {
    return result
  }

  for (const value of array) {
    if (value) {
      result[resIndex++] = value
    }
  }
  return result
}

export default compact

可以看到只是一个简单的for of循环，然后将非真的值全部剔除，es5中的filter也可以做到。下面对比一下两者效率，如下图：传送门

可以看到使用filter更快，如果没有兼容性需求，还是使用es5原生函数比较好。

至于filter比较快的原因，猜测是chrome排序算法导致的，以后有空时间我会看一波源码再来补充这篇blog

GPU云服务器云服务器学习笔记学习笔记一基础学习笔记深度学习笔记

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/93449.html

Lodash源码讲解-compact函数

摘要：首先我们先说一下这个函数的作用，这个函数接收一个数组作为参数然后将数组中所有通过布尔转换可以变为的值去除从而生成一个新的数组。原文首发于Lodash源码讲解这是我们阅读Lodash源码的第3篇博客，在这篇文章里我们来学习一下Lodash的compact方法。 compact函数内部没有依赖别的函数，让我们先来看一下compact函数的源码。 /** * Creates an ar...

glumes 2019-08-21 12:03 评论0 收藏0
lodash源码分析之compact中的遍历

摘要：到这里，源码分析完了。但是，有两个致命的特性的遍历不能保证顺序会遍历所有可枚举属性，包括继承的属性。的遍历顺序依赖于执行环境，不同执行环境的实现方式可能会不一样。小时候，乡愁是一枚小小的邮票，我在这头，母亲在那头。长大后，乡愁是一张窄窄的船票，我在这头，新娘在那头。后来啊，乡愁是一方矮矮的坟墓，我在外头，母亲在里头。而现在，乡愁是一湾浅浅的海峡，我在这头，大...

dmlllll 2019-08-22 11:20 评论0 收藏0
lodash数组篇之2 compact()

摘要：创建一个新数组，包含原数组中所有的非假值元素。例如和都是被认为是假值。创建一个新数组，包含原数组中所有的非假值元素。例如false, null, 0, , undefined, 和 NaN 都是被认为是假值。以下是自己实现的compact() compact:(array)=>{ let result = [] //判断参数是否是数组如果不是...

robin 2019-08-23 18:35 评论0 收藏0
2017-08-20 前端日报

摘要：前端日报精选数组所有全解密原生实现最简单的图片懒加载译如何抓取数据中种常见的内存泄露陷阱内部原理，第一部分基础渲染前端国际化中文深入理解笔记模块掘金译热的冷的掘金模块，桌面端的支付请求，和迷津欲有问遮罩层状态丢失及解决方案全 2017-08-20 前端日报精选 JavaScript数组所有API全解密原生JS实现最简单的图片懒加载【译】React如何抓取数据JavaScript 中 ...

molyzzx 2019-08-21 12:02 评论0 收藏0
Lodash 中文文档 (v3.10.1) - “Chain” 方法

摘要：中文文档方法方法创建一个包含的对象以开启内置的方法链。注意该方法会修改包装数组。返回返回强制转为字符串的值示例执行方法链队列并提取未包装的值别名返回返回已处理的未包装的值示例 Lodash 中文文档 (v3.10.1) - Chain 方法 Translated by PeckZegOriginal Docs: Lodash v3.10.1 Docs Chain 方法 _(value)...

BLUE 2019-08-19 17:18 评论0 收藏0