array-flatten使用方法和源码

2019-08-28 08:32:55

将嵌套数组的数组展开为一个平面数组。 可指定深度。

作用#

Copy    var flatten = require('array-flatten')
    
    flatten([1, [2, [3, [4, [5], 6], 7], 8], 9])    //=> [1, 2, 3, 4, 5, 6, 7, 8, 9]
    
    flatten([1, [2, [3, [4, [5], 6], 7], 8], 9], 2)    //=> [1, 2, 3, [4, [5], 6], 7, 8, 9]
    
    (function () {
      flatten(arguments) //=> [1, 2, 3]
    })(1, [2, 3])

Github#

https://github.com/blakeembrey/array-flatten

源码#

Copy    // 指定深度展开
    function flattenWithDepth (array, result, depth) {      for (var i = 0; i < array.length; i++) {        var value = array[i]        
        // 判断是否到了指定的深度 或者 当前数组是否已经全部展开
        if (depth > 0 && Array.isArray(value)) {
          flattenWithDepth(value, result, depth - 1)
        } else {
          result.push(value)
        }
      }    
      return result
    }    
    // 全部展开
    function flattenForever (array, result) {      for (var i = 0; i < array.length; i++) {        var value = array[i]    
        if (Array.isArray(value)) {
          flattenForever(value, result)
        } else {
          result.push(value)
        }
      }    
      return result
    }    
    function arrayFlatten (array, depth) {      if (depth == null) {        return flattenForever(array, [])
      }    
      return flattenWithDepth(array, [], depth)
    }


  • 2020-04-17 09:27:38

    推荐一个老前端开发者的博客

    前端修炼场,首页标签大全greenSock前端研究VUE研究我们的作品flash技术探讨开发心得个人档案培训与招聘服务报价

  • 2020-04-17 09:41:47

    前端css博客推荐

    这个博客有大量的css内容,有svg,TweenMax等教程,抽空通读一下

  • 2020-04-17 10:20:47

    GreenSocks Animation Platform详细工作机制以及TweenMax用法

    GSAP(GreenSocks Animation Platform)是一个性能较好的前端动画库。最近在写一个前端SVG动画编辑器时选择了它作为底层的动画库。为了减少踩坑,我大致浏览了它的源代码,这篇文章主要是对我的理解进行记录。 我会先简单介绍一下这个动画库的API,再介绍它的插件机制,最后会从一个用例出发跟踪其运行机制。

  • 2020-04-17 10:39:02

    CSS 滤镜技巧与细节,实现火焰,融合等特效

    简单来说,CSS 滤镜就是提供类似 PS 的图形特效,像模糊,锐化或元素变色等功能。通常被用于调整图片,背景和边界的渲染。本文就会围绕这些滤镜展开,看看具体能怎么使用或者玩出什么花活。

  • 2020-04-17 10:42:29

    (三)TweenMax运动效果

    运动效果 实例化对象.set() 立刻运动到指定地点,不用加时间

  • 2020-04-17 11:19:55

    Vue中的is和操作DOM

    vue中is的属性引入是为了解决dom结构中对放入html的元素有限制的问题,譬如ul里面要接上li的标签,引入is的属性后,你完全可以写成这样

  • 2020-04-17 11:27:48

    TweenMax中文初级教程一

    TweenMax.js集成了GreenSock动画平台的大部分核心功能,且具有极高的兼容性。

  • 2020-04-17 11:28:35

    TweenMax中文初级教程二

    TimelineMax是GreenSock 动画平台中的动画组织、排序、管理工具,可创建时间轴(timeline)作为动画或其他时间轴的容器,这使得整个动画控制和精确管理时间变得简单,避免了通过反复delay和回调进行动画。 作者:李霖弢 链接:https://www.jianshu.com/p/8c0361e43bf5 来源:简书 著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

  • 2020-04-17 11:28:57

    TweenMax中文初级教程三

    动画关键词:CSS(一般可以省略) CSSPlugin用于在TweenMax中对DOM元素的CSS相关属性进行动画 在CSSPlugin中CSS属性需要写成驼峰式,例如font-size应当写作fontSize。有时候你可以在一些默认px为单位的属性中省略单位,CSSPlugin还可以在不同的单位间做动画: