美文网首页
JS数组方法

JS数组方法

作者: royluck | 来源:发表于2018-05-27 22:21 被阅读0次

汇总:

join、slice、splice、concat、push、pop、unshift、
shift、forEach、map、filter、every、some、sort、
reverse、indexOf、lastIndexOf、reduce、reduceRight、
isArray、toString、toLocaleString、valueOf

join:把数组转换成字符串,默认以逗号形式拼接。

var arg = [1,2,3,4,5];
console.log(arg.join());  // 1,2,3,4,5 
console.log(arg.join("|"));  // 1|2|3|4|5 
使用场合:一个H5页面,需要收集用户填写的信息或者上传的照片,后台要求复选的内容或者上传的图片以"|"拼接成,然后以某个字段传值给后台。

slice:对数组进行切割,并返回新的数组(不改变旧数组),可以传参一或两个参数,(左闭右开区间)。

var arg = [1,2,3,4];
console.log(arg.slice(0,2)) // [1,2]
console.log(arg) //[12,3,4] arg未改变

splice:对数组进行增删改,改变旧数组,可以传参多个参数,参数1为起始位置(左闭右开区间),参数2为要删除的数量(0表示不删除),参数3开始,表示要添加的值。

splice是slice的进化版,能进行删除,也能进行修改,和增加
var arg = [1,2,3,4];
console.log(arg.splice(0)) //[1,2,3,4]  全部删除
console.log(arg) // [] 空数组
arg.splice(0,0,1,2,3,4) // [1,2,3,4]  增加新内容
arg.splice(arg.length,0,5) //[1,2,3,4,5] 在数组尾部增加新内容
arg.splice(4,1,6)  //[1,2,3,4,6] 把5修改成6

concat:在数组尾部拼接新内容,并返回新的数组(不改变旧数组)

var arg = [1,2,3];
arg.concat(4,[5,6]); // [1,2,3,4,5,6]  返回新数组
console.log(arg) // [1,2,3]  不改变旧数组

push:在数组尾部添加内容,改变旧数组
pop:移除数组尾部的内容,改变旧数组
unshift:在数组头部添加内容,改变旧数组(跟push相反)
shift:移除数组头部的内容,改变旧数组(跟pop相反)

forEach:循环执行数组的每个变量

var arg1= [1,2,3,4];
var arg2 = [
  {
    name:"roy",
    age:27
  }
]
var newArg1 = arg1.forEach(function(item,index,array){
  item*2
})
arg2.forEach(function(item,index,array){
  item.age*2
})
console.log(arg1);  //[1,2,3,4] 没有改变,说明基本类型传值,只是复制了一个副本,并没有修改原数组;
console.log(newArg1);//undefined 说明没有返回值;
console.log(arg2); //[{name:"roy",age:54}],值发生改变,引用类型传值(同一个指针地址),二者都是共享同一个对象,所以发生了改变。

map:

var arg = [1,2,3,4];
var newArg = arg.map(function(item,index,array){
  return item*2 
});
console.log(arg);  //arg不改变
console.log(newArg);  //返回新数组
var arg2 = [
{
  name:"roy",
  age:21
}
];
var newArg2 = arg2.map(function(item,index,array){
  return item.age*2
})
console.log(newArg2);  //[{name:"roy",age:42}]
console.log(arg2);  //[{name:"roy",age:42}] 也发生改变,因为arg2值为对象

var arg3= [
{
  name:"roy",
  age:21
}
];
var newArg3 = arg3.map(function(item,index,array){
 return{
  ...item;
  item.age*2
}
})
console.log(newArg3);  //[{name:"roy",age:42}]
console.log(arg3);  //[{name:"roy",age:21}] 不发生改变

filter:返回满足条件的新数组,不改变旧数组

        var arg3 = [
            {
                name:"roben",
                age:21
            }
        ];
        var arg5 = arg3.filter(function(item){
             if(item.age == 21){
                item.age*2
                return item
            }
        })
        console.log(arg3); //[{name:"roben",age:21}]不改变  ????这里不是引用对象吗,为什么不改变,疑惑疑惑!!!!!!!!!!!!!1
        console.log(arg5);//[{name:"roben",age:21}]

every:遍历数组的值是否满足某个条件,如果都满足,则返回true,否则false(记得添加return)
some:遍历数组的值是否满足某个条件,如果有一个满足,则返回true,否则false(记得添加return)

sort:排序,需定义排序函数,默认是字符编码排序
reverse:颠倒数组
indexOf:返回查询值在数组所在的位置(从左到右),不存在返回-1
lastIndexOf:返回查询值在数组所在的位置(从右到左),不存在返回-1
reduce:从左到右对数组进行叠加操作
reduceRight:从右到左对数组进行叠加操作
isArray:用于判断某个值是否为数组,返回布尔值。

var arg = [];
Arrary.isArrary(arg) // 返回true

toString:转换为字符串,alert默认调用的就是toStrig()方法
toLocaleString:转换为字符串,当用在new Date对象时,根据当地时间格式显示
valueOf:valueOf() 方法通常由 JavaScript 在后台自动调用,并不显式地出现在代码中。valueOf() 方法不会改变原数组。

相关文章

  • 数组(Array)<迭代器>

    一、Js数组迭代器方法 主要介绍js数组中的forEach,every,some,filter,map迭代器方法 ...

  • js基础了解

    js数组常用遍历方法使用: js数组常用操作方法使用: 基本逻辑运算: 基本字符串操作方法:

  • js 数组

    js 中数组的长度发生改变,数组就真的发生改变,快速清空数组就让数组长度为0js 数组的方法

  • js关于数组的方法汇总

    js关于数组的方法汇总

  • 封装常用数组操作函数

    1. 数组扁平化 方法一 : 递归迭代数组 方法二 : 通过js原生 falt方法展开数组 方法三 通过正则...

  • JS数组常用方法

    @[toc] JS数组方法 数组是 js 中最常用到的数据集合,其内置的方法有很多,熟练掌握这些方法,可以有效...

  • JS如何判断一个数组是否为空、是否含有某个值

    一、js判断数组是否为空方法一: arr.length 二、js判断数组是否含有某个值方法一: arr.ind...

  • 数组进阶

    JS数组奇巧淫技 数组进阶方法~ 数组使用方法比较多。什么时候使用什么方法,用对方法,不用对很大的原因就是数组方法...

  • 数组常用方法

    数组常用方法 一、js数组常用方法: 1、join() Array.join() 方法将数组中所有元素都转换成字...

  • js 数组操作探究

    有空闲时间了, 深入的研究一下js 中的数组方法 js中的数组方法 首先是会改变原数组的方法: shift un...

网友评论

      本文标题:JS数组方法

      本文链接:https://www.haomeiwen.com/subject/zruvjftx.html