前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >javascript数组常用函数与实战总结

javascript数组常用函数与实战总结

作者头像
coder_koala
发布2019-07-30 17:30:46
1.1K0
发布2019-07-30 17:30:46
举报
文章被收录于专栏:程序员成长指北

前言

在node.js后端开发过程中,数组这种数据类型(Object类型)再常见不过,本文主要介绍数组的一些常见函数,以及在实战开发过程中能更好的操作数组的lodash包

函数介绍

向数组末尾添加值

push

说明:向数组的末尾添加一个或多个元素,并返回新的长度 代码:

代码语言:javascript
复制
let array=[11,22];
let arrayChange=array.push("333");
console.log(arrayChange)
//返回的结果就是数组改变后的长度:3
console.log(arrayChange.length)//undefined

向数组头部添加值

unshift

说明:将参数添加到原数组开头,并返回数组的长度 代码:

代码语言:javascript
复制
let array=[11,22];
let arrayChange=array.unshift("333");
console.log(array) //[333,11,22]
console.log(arrayChange)
//返回的结果就是数组改变后的长度:3
console.log(arrayChange.length)//undefined

删除数组元素

splice

说明: 当splice传递两个参数的时候,参数1:开始删除的下标位置,参数2:删除数组元素的个数,返回新的数组。当splice传递三个参数的时候,参数1:开始删除的下表位置,参数2:删除数组元素的个数,参数3:向数组添加的新元素。注意数组下标0开始。

代码:

代码语言:javascript
复制
let array=[11,22,33,44];
let arrayChange=array.splice(1,2);//movePos.splice(开始删除的下表位置,删除数组元素的个数);
console.log(arrayChange) ; //返回新的数组:22,11
console.log(arrayChange.length) ;//返回数组长度2

let array =[111,222,333,444];
let arrayChange=array.splice(2,1,"666")//movePos.splice(开始删除的下表位置,删除数组元素的个数,向数组添加的新项目。);从下标2开始删除一位,并用666替换删除下表位置的元素
console.loge(arrayChange + "<br />")
//返回新的数组 11,22,666,44

获取数组的最后一个元素

常规获取元素最后一个值

代码语言:javascript
复制
let array=['1','2','3','312哦哦'];
console.log(array[array.length-1]);

pop 也可以说是删除数组的最后一个元素,与删除数组的第一个元素shift用法基本相同

说明:注意使用pop获取数组最后一个元素的时候,同时会删除掉数组的最后一个元素;使用shift获取数组最后一个元素的时候,同时会删除掉数组的最后一个元素,二者都是返回的那个元素的值,原始数组也发生变化。

代码语言:javascript
复制
let array=['1','2','3','312哦哦'];
console.log(array.pop())
console.log(array)

Lodash中的函数_last

说明:不会改变原始数组

代码语言:javascript
复制
let array=['1','2','3','312哦哦'];
console.log(_.last(array))

颠倒数组元素(数组的反转)

  • 数组传统方法 reverse 说明:颠倒数组元素后返回新的数组

代码:

代码语言:javascript
复制
let array=[11,22];

let arrayChange=movePos.reverse();

console.log(arrayChange) //返回新的数组:22,11

console.log(arrayChange.length) //返回数组长度2
  • lodash提供的函数 _.reverse

代码:

代码语言:javascript
复制
let array=[11,22];
console.log(_.reverse(array))

分隔数组放入字符串

join

说明:用于把数组中的所有元素放入一个字符串。元素是通过指定的分隔符进行分隔的。返回一个字符串 代码

代码语言:javascript
复制
let array=[11,22];

let arrayChange=array.join("+");
console.log(arr)  //11+22

连接两个或多个数组

contact

说明:用于连接两个或多个数组,并返回一个新数组,新数组是将参数添加到原数组中构成

代码语言:javascript
复制
let array=[11,22];
let arrayChange=array.concat(4,5);
console.log(arrayChange);//[11, 22, 4, 5]

数组元素的去重

  • 传统方法遍历去重 for of

代码:

代码语言:javascript
复制
    let arr = ['数字','花朵','数字'];
    let result=[];
    for (let i of arr) {
        if (!result.includes(i)) {
            result.push(i)
        }
    }
  • ES6 新增了Set这一数据结构 类似数组 但是Set成员具有唯一性,基于唯一性适合做数组去重

代码:

代码语言:javascript
复制
let array=['数字','花朵','数字','地球','人类','头发','眼睛','细胞'];
console.log(...(new Set(array)))
  • lodash提供的函数 _uniq

代码:

代码语言:javascript
复制
let array=['数字','花朵','数字','地球','人类','头发','眼睛','细胞'];
console.log(_.uniq(array));

数组求和

lodash中的函数 _sum

代码:

代码语言:javascript
复制
let sorce=_.sum([32,45,86,43]);

获取数组中指定键值对的值组成数组

lodash中的函数 _map

说明:例如这样一个包含对象的数组[{id:1,name:'koala'},{id:2,name:'koala1'}],想拿到数组对象中id的数据组成一个数组。map的参数1:原型数组,参数2对象中的某一个键值对

代码:

代码语言:javascript
复制
let array=[{id:1,name:'koala'},{id:2,name:'koala1'}];
let result=_map(array,'id');
//[1,2]

获取数组中某个值的角标

注意:下面两个函数都是返回遇到的第一个符合的值的下标值。indexOf

说明:

  1. 用于在字符串和数组中找到目标的索引
  2. 在字符串中使用的话会转换类型为 "hello1".indexOf(1) //结果5
  3. 在数组中使用不会转换类型 [1,2,3,"4"].indexOf(4) //-1
  4. [,,,,,].indexOf(undefined) //-1
  5. [null,undefined,NaN].indexOf(NaN)] //-1 NaN是找不到的其他可以哟
  6. let num = 2019; (""+num).indexOf(0) //1

代码:

代码语言:javascript
复制
console.log('哈哈',("hello1".indexOf(1)))//  哈哈 5
console.log('哈哈',("hello1111".indexOf(1)))//  哈哈 5

lodash中的函数**_.findIndex** 说明:对于一个数组,里面每个值是对象的时候,这个函数,可以不完全判断对象一定是相同的。 代码:

代码语言:javascript
复制
var users = [
    { 'user': 'barney',  'active': false ,'role':1},
    { 'user': 'fred',    'active': false ,'role':2},
    { 'user': 'fred', 'active': true ,'role':3}
  ];

console.log(  _.findIndex(users, { 'user': 'fred', 'role': 3 }));// 输出2

数组包含值判断

  • indexOf 说明:返回对应元素下标,在上面已经详细介绍过。
  • includes 说明:返回的直接是true/false,同时对NaN找不到的问题也得到解决。效率应该会比indexOf高一些

代码:

代码语言:javascript
复制
let array111=['koala','kaola1',NaN];
console.log(array111.includes('koala'));//true
console.log(array111.includes(NaN));//true

把一个字符串分割成字符串数组

split

说明:split函数两个参数,参数1:字符串或正则表达式,从该参数指定的地方分割 (必须),参数2:可选。该参数可指定返回的数组的最大长度。如果设置了该参数,返回的子串不会多于这个参数指定的数组。如果没有设置该参数,整个字符串都会被分割,不考虑它的长度

代码语言:javascript
复制
var str="How are you doing today?"

document.write(str.split(" ") + "<br />")
document.write(str.split("") + "<br />")
document.write(str.split(" ",3))

输出:
How,are,you,doing,today?
H,o,w, ,a,r,e, ,y,o,u, ,d,o,i,n,g, ,t,o,d,a,y,?
How,are,you


"2:3:4:5".split(":")	//将返回["2", "3", "4", "5"]
"|a|b|c".split("|")	//将返回["", "a", "b", "c"]

"hello".split("")	//可返回 ["h", "e", "l", "l", "o"]

"hello".split("")	//可返回 ["h", "e", "l", "l", "o"]

"hello".split("", 3)	//可返回 ["h", "e", "l"]

附:

注意,文中提到的所有lodash中的函数,在使用的时候需要先

代码语言:javascript
复制
const _ = require('lodash');
一道面试题:

给定任意非负整数,反复累加各位数字直到结果为个位数为止。例如给定非负整数912,第一次累加9+1+2 = 12, 第二次累加1+2 = 3, 3为个位数,循 环终止返回3。请编程实现。

代码语言:javascript
复制
function add(num){
    if(isNaN(num)) return;
    if(num<10) return num
    const res=num.toString().split('').reduce((sum,value)=>{
        return sum+Number(value)
    },0)
    return add(res);
}
add(345);
3
本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2019-05-18,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 程序员成长指北 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 前言
  • 函数介绍
    • 向数组末尾添加值
      • 向数组头部添加值
        • 删除数组元素
          • 获取数组的最后一个元素
            • 颠倒数组元素(数组的反转)
              • 分隔数组放入字符串
                • 连接两个或多个数组
                  • 数组元素的去重
                    • 数组求和
                      • 获取数组中指定键值对的值组成数组
                        • 获取数组中某个值的角标
                          • 数组包含值判断
                            • 把一个字符串分割成字符串数组
                              • 一道面试题:
                          • 附:
                          领券
                          问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档