高大上的数组操作方法

1.扁平化n维数组

1.终极篇

  • [
    1
    ,[
    2
    ,
    3
    ]].
    flat
    (
    2
    )
     
    //[1,2,3]
  • [
    1
    ,[
    2
    ,
    3
    ,[
    4
    ,
    5
    ]].
    flat
    (
    3
    )
     
    //[1,2,3,4,5]
  • [
    1
    ,[
    2
    ,
    3
    ,[
    4
    ,
    5
    ]]].
    toString
    ()
     
    //'1,2,3,4,5'
  • [
    1
    [
    2
    ,
    3
    ,[
    4
    ,
    5
    [...]].
    flat
    (
    Infinity
    )
     
    //[1,2,3,4...n]

Array.flat(n)是ES10扁平数组的api,n表示维度,n值为Infinity时维度为无限大

2.开始篇

  • function
     flatten
    (
    arr
    )
     
    {
  •    
    while
    (
    arr
    .
    some
    (
    item
    =>
    Array
    .
    isArray
    (
    item
    )))
     
    {
  •         arr
    =
     
    [].
    concat
    (...
    arr
    );
  •    
    }
  •    
    return
     arr
    ;
  • }
  • flatten
    ([
    1
    ,[
    2
    ,
    3
    ]])
     
    //[1,2,3]
  • flatten
    ([
    1
    ,[
    2
    ,
    3
    ,[
    4
    ,
    5
    ]])
     
    //[1,2,3,4,5]

实质是利用递归和数组合并方法concat实现扁平

2.去重

1.终极篇

  • Array
    .
    from
    (
    new
     
    Set
    ([
    1
    ,
    2
    ,
    3
    ,
    3
    ,
    4
    ,
    4
    ]))
     
    //[1,2,3,4]
  • [...
    new
     
    Set
    ([
    1
    ,
    2
    ,
    3
    ,
    3
    ,
    4
    ,
    4
    ])]
     
    //[1,2,3,4]

set是ES6新出来的一种一种定义不重复数组的数据类型

Array.from是将类数组转化为数组

...是扩展运算符,将set里面的值转化为字符串

2.开始篇

  • Array
    .
    prototype
    .
    distinct
    =
     
    function
    (){

  • var
     arr
    =
     
    this
    ,
  •   result
    =
     
    [],
  •   i
    ,
  •   j
    ,
  •   len
    =
     arr
    .
    length
    ;

  • for
    (
    i
    =
     
    0
    ;
     i
    <
     len
    ;
     i
    ++){
  •  
    for
    (
    j
    =
     i
    +
     
    1
    ;
     j
    <
     len
    ;
     j
    ++){
  •  
    if
    (
    arr
    [
    i
    ]
     
    ===
     arr
    [
    j
    ]){
  •     j
    =
     
    ++
    i
    ;
  •  
    }
  •  
    }
  •   result
    .
    push
    (
    arr
    [
    i
    ]);

  • }

  • return
     result
    ;
  • }
  • [
    1
    ,
    2
    ,
    3
    ,
    3
    ,
    4
    ,
    4
    ].
    distinct
    ();
     
    //[1,2,3,4]

取新数组存值,循环两个数组值相比较

3.排序

1.终极篇

  • [
    1
    ,
    2
    ,
    3
    ,
    4
    ].
    sort
    ((
    a
    ,
     b
    )
     
    =>
     a
    -
     b
    );
     
    // [1, 2,3,4],默认是升序
  • [
    1
    ,
    2
    ,
    3
    ,
    4
    ].
    sort
    ((
    a
    ,
     b
    )
     
    =>
     b
    -
     a
    );
     
    // [4,3,2,1] 降序

sort是js内置的排序方法,参数为一个函数

2.开始篇

冒泡排序:

  • Array
    .
    prototype
    .
    bubleSort
    =
    function
     
    ()
     
    {
  •    
    let
     arr
    =
    this
    ,
  •         len
    =
     arr
    .
    length
    ;
  •    
    for
     
    (
    let
     outer
    =
     len
    ;
     outer
    >=
     
    2
    ;
     outer
    --)
     
    {
  •      
    for
     
    (
    let
     inner
    =
     
    0
    ;
     inner
    <=
     outer
    -
     
    1
    ;
     inner
    ++)
     
    {
  •        
    if
     
    (
    arr
    [
    inner
    ]
     
    >
     arr
    [
    inner
    +
     
    1
    ])
     
    {
  •          
    //升序
  •          
    [
    arr
    [
    inner
    ],
     arr
    [
    inner
    +
     
    1
    ]]
     
    =
     
    [
    arr
    [
    inner
    +
     
    1
    ],
     arr
    [
    inner
    ]];
  •           console
    .
    log
    ([
    arr
    [
    inner
    ],
     arr
    [
    inner
    +
     
    1
    ]]);
  •        
    }
  •      
    }
  •    
    }
  •    
    return
     arr
    ;
  •  
    }
  • [
    1
    ,
    2
    ,
    3
    ,
    4
    ].
    bubleSort
    ()
     
    //[1,2,3,4]   

选择排序

  •    
    Array
    .
    prototype
    .
    selectSort
    =
    function
     
    ()
     
    {
  •        
    let
     arr
    =
    this
    ,
  •             len
    =
     arr
    .
    length
    ;
  •        
    for
     
    (
    let
     i
    =
     
    0
    ,
     len
    =
     arr
    .
    length
    ;
     i
    <
     len
    ;
     i
    ++)
     
    {
  •    
    for
     
    (
    let
     j
    =
     i
    ,
     len
    =
     arr
    .
    length
    ;
     j
    <
     len
    ;
     j
    ++)
     
    {
  •      
    if
     
    (
    arr
    [
    i
    ]
     
    >
     arr
    [
    j
    ])
     
    {
  •        
    [
    arr
    [
    i
    ],
     arr
    [
    j
    ]]
     
    =
     
    [
    arr
    [
    j
    ],
     arr
    [
    i
    ]];
  •      
    }
  •    
    }
  •  
    }
  •    
    return
     arr
    ;
  •  
    }
  •  
    [
    1
    ,
    2
    ,
    3
    ,
    4
    ].
    selectSort
    ()
     
    //[1,2,3,4]

4.最大值

1.终极篇

  • Math
    .
    max
    (...[
    1
    ,
    2
    ,
    3
    ,
    4
    ])
     
    //4
  • Math
    .
    max
    .
    apply
    (
    this
    ,[
    1
    ,
    2
    ,
    3
    ,
    4
    ])
     
    //4
  • [
    1
    ,
    2
    ,
    3
    ,
    4
    ].
    reduce
    (
     
    (
    prev
    ,
     cur
    ,
    curIndex
    ,
    arr
    )=>
     
    {

  • return
     
    Math
    .
    max
    (
    prev
    ,
    cur
    );
  • },
    0
    )
     
    //4

Math.max()是Math对象内置的方法,参数是字符串;

reduce是ES5的数组api,参数有函数和默认初始值;

函数有四个参数,pre(上一次的返回值),cur(当前值),curIndex(当前值索引),arr(当前数组)

2.开始篇

先排序再取值

5.求和

1.终极篇

  • [
    1
    ,
    2
    ,
    3
    ,
    4
    ].
    arr
    .
    reduce
    (
    function
     
    (
    prev
    ,
     cur
    )
     
    {
  •  
    return
     prev
    +
     cur
    ;

  • },
    0
    )
     
    //10

2.开始篇

  • function
     sum
    (
    arr
    )
     
    {
  •  
    var
     len
    =
     arr
    .
    length
    ;
  •  
    if
    (
    len
    ==
     
    0
    ){
  •    
    return
     
    0
    ;
  •  
    }
     
    else
     
    if
     
    (
    len
    ==
     
    1
    ){
  •    
    return
     arr
    [
    0
    ];
  •  
    }
     
    else
     
    {
  •    
    return
     arr
    [
    0
    ]
     
    +
     sum
    (
    arr
    .
    slice
    (
    1
    ));
  •  
    }
  • }
  • sum
    ([
    1
    ,
    2
    ,
    3
    ,
    4
    ])
     
    //10

利用slice截取改变数组,再利用递归求和

6.合并

1.终极篇

  • [
    1
    ,
    2
    ,
    3
    ,
    4
    ].
    concat
    ([
    5
    ,
    6
    ])
     
    //[1,2,3,4,5,6]
  • [...[
    1
    ,
    2
    ,
    3
    ,
    4
    ],...[
    4
    ,
    5
    ]]
     
    //[1,2,3,4,5,6]
  • [
    1
    ,
    2
    ,
    3
    ,
    4
    ].
    push
    .
    apply
    ([
    1
    ,
    2
    ,
    3
    ,
    4
    ],[
    5
    ,
    6
    ])
     
    //[1,2,3,4,5,6]

2.开始篇

  • let
     arr
    =[
    1
    ,
    2
    ,
    3
    ,
    4
    ];
  •  
    [
    5
    ,
    6
    ].
    map
    (
    item
    =>{
  •   arr
    .
    push
    (
    item
    )

  • })

  • //arr值为[1,2,3,4,5,6],注意不能直接return出来,return后只会返回[5,6]

7.判断是否包含值

1.终极篇

  • [
    1
    ,
    2
    ,
    3
    ].
    includes
    (
    4
    )
     
    //false
  • [
    1
    ,
    2
    ,
    3
    ].
    indexOf
    (
    4
    )
     
    //-1 如果存在换回索引
  • [
    1
    ,
     
    2
    ,
     
    3
    ].
    find
    ((
    item
    )=>
    item
    ===
    3
    ))
     
    //3 如果数组中无值返回undefined
  • [
    1
    ,
     
    2
    ,
     
    3
    ].
    findIndex
    ((
    item
    )=>
    item
    ===
    3
    ))
     
    //2 如果数组中无值返回-1

includes(),find(),findIndex()是ES6的api

2.开始篇

  • [
    1
    ,
    2
    ,
    3
    ].
    some
    (
    item
    =>{
  •  
    return
     item
    ===
    3
  • })
     
    //true 如果不包含返回false

8.类数组转化

1.终极篇

  • Array
    .
    prototype
    .
    slice
    .
    call
    (
    arguments
    )
     
    //arguments是类数组(伪数组)
  • Array
    .
    prototype
    .
    slice
    .
    apply
    (
    arguments
    )
  • Array
    .
    from
    (
    arguments
    )
  • [...
    arguments
    ]

类数组:表示有length属性,但是不具备数组的方法

call,apply:是改变slice里面的this指向arguments,所以arguments也可调用数组的方法

Array.from是将类似数组或可迭代对象创建为数组

...是将类数组扩展为字符串,再定义为数组

2.开始篇

  • Array
    .
    prototype
    .
    slice
    =
     
    function
    (
    start
    ,
    end
    ){
     
  •      
    var
     result
    =
     
    new
     
    Array
    ();
     
  •       start
    =
     start
    ||
     
    0
    ;
     
  •      
    end
     
    =
     
    end
     
    ||
     
    this
    .
    length
    ;
     
    //this指向调用的对象,当用了call后,能够改变this的指向,也就是指向传进来的对象,这是关键 
  •      
    for
    (
    var
     i
    =
     start
    ;
     i
    <
     
    end
    ;
     i
    ++){
     
  •           result
    .
    push
    (
    this
    [
    i
    ]);
     
  •      
    }
     
  •      
    return
     result
    ;
     

  • }
     

9.每一项设置值

1.终极篇

  • [
    1
    ,
    2
    ,
    3
    ].
    fill
    (
    false
    )
     
    //[false,false,false]

fill是ES6的方法

2.开始篇

  • [
    1
    ,
    2
    ,
    3
    ].
    map
    (()
     
    =>
     
    0
    )

10.每一项是否满足

  • [
    1
    ,
    2
    ,
    3
    ].
    every
    (
    item
    =>{
    return
     item
    >
    2
    })
     
    //false

every是ES5的api,每一项满足返回 true

11.有一项满足

  • [
    1
    ,
    2
    ,
    3
    ].
    some
    (
    item
    =>{
    return
     item
    >
    2
    })
     
    //true

some是ES5的api,有一项满足返回 true

12.过滤数组

  • [
    1
    ,
    2
    ,
    3
    ].
    filter
    (
    item
    =>{
    return
     item
    >
    2
    })
     
    //[3]

filter是ES5的api,返回满足添加的项的数组

13.对象和数组转化

    • Object
      .
      keys
      ({
      name
      :
      '张三'
      ,
      age
      :
      14
      })
       
      //['name','age']
    • Object
      .
      values
      ({
      name
      :
      '张三'
      ,
      age
      :
      14
      })
       
      //['张三',14]
    • Object
      .
      entries
      ({
      name
      :
      '张三'
      ,
      age
      :
      14
      })
       
      //[[name,'张三'],[age,14]]
    • Object
      .
      fromEntries
      ([
      name
      ,
      '张三'
      ],[
      age
      ,
      14
      ])
       
      //ES10的api,Chrome不支持 , firebox输出{name:'张三',age:14}

猜你喜欢

转载自www.cnblogs.com/songyuhao/p/10582671.html