js数组的基本使用总结

前言

数组是一种特殊对象。js中并没有真正的数组，只是用对象模拟数组。

查看对象属性的方法在数组身上也同样适用。值得注意的是:数组的下标类型为字符串，并不是数字。

典型数组和js数组区别

类似c/c++的典型数组特征如下:

  • 元素的数据类型相同
  • 使用连续的内存存储
  • 通过数字下标获取元素

js的数组

  • 元素的数据类型可以不同
  • 内存不一定是连续的(对象是随机存储的)
  • 不能通过数字下标访问，而是通过字符串下标进行访问。(这意味着数组可以有任何key)

上图说明的是最后一点:数组可以有任何key，想证明数组的下标为字符串，用 Object.keys(arr)

创建数组

创建数组有两种方式，分别是:

 let arr=[1,2,3]
 let arr=new Array(1,2,3)

字符串转化为数组 split() Array.from()

可以用这两种方法将字符串转化为字符串数组。

伪数组

没有数组共有属性的数组就是伪数组(伪数组的原型链中并没有数组的原型)

伪数组中并没有push,pop等方法(通过 console.dir(divList) 可看出)，我们可以通过 Array.from() 来转化

转化之后就可以成功的push啦

合并两个数组

  • concat()

此方法不会改变原数组

 let arr1=[1,2,3]
 let arr2=[4,5,6]
 arr1.concat(arr2)//[1,2,3,4,5,6]
 arr1//[1,2,3]
 arr2//[4,5,6]

截取数组

  • slice()

此方法不会改变原数组

let arr=[1,2,3,4,5,6]
arr.slice(3) //[4,5,6]
arr//[1,2,3,4,5,6]

删数组元素

删头部元素: arr.shift() arr会被修改，并返回被删元素

 let arr=[1,2,3,4,5,6]
 arr.shift()//1
 arr//[2, 3, 4, 5, 6]

删尾部元素: arr.pop() arr会被修改，并返回被删元素

 let arr=[1,2,3,4,5,6]
 arr.shift()//6
 arr//[1, 2, 3, 4, 5]

删中间:

arr.splice(index,1) //删除index的第一个元素,返回被删元素 arr.splice(index,1,'x') //在删除位置添加'x' ,返回被删元素 arr.splice(index,1,'x','y') //在删除位置添加'x'和'y',返回被删元素

 let arr=[1,2,3,4,5,6,7,8,9]
 //删除元素4
 arr.splice(3,1)//4
 arr//[1, 2, 3, 5, 6, 7, 8, 9]

 let arr=[1, 2, 3, 5, 6, 7, 8, 9]
 //删除下标3并添加3.5和4
 arr.splice(2,1,3.5,4)//3
 arr//[1, 2, 3.5, 4, 6, 7, 8, 9]

查看数组元素

查看属性

  • Object.keys(arr)
  • Object.values(arr)
let arr=[1,2,3,4,5]
arr.x='xxx'
Object.keys(arr)//["0", "1", "2", "3", "4", "x"]
Object.values(arr)// [1, 2, 3, 4, 5, "xxx"]

for in 循环

查看只含数字的元素

for循环

forEach循环

查看某个元素是否在数组里

arr.indexOf(item) 存在则返回数组索引，否则返回-1

let arr=[1,2,3,4,5,6]
arr.indexOf(2)//1
arr.indexOf(7)//0

使用条件查找元素

//查找第一个为偶数的元素
let arr=[1,2,3,4,5,6]
arr.find(item=>item%2===0)//2

//查找第一个为偶数的下标
let arr=[1,2,3,4,5,6]
arr.findIndex(item=>item%2===0)//1

增加数组中的元素

在尾部添加: arr.push(item1,item2)

 let arr=[3,4,5,6]
 arr.push(7,8,9)
 arr//[3,4,5,6,7,8,9]

头部添加: arr.unshift(item1,item2)

 let arr=[3,4,5,6]
 arr.unshift(1,2,3)
 arr//[1, 2, 3, 3, 4, 5, 6]

在中间添加: arr.splice(index,0,'x')

 let arr=[1,2,3,4,5,6,7]
 //在下标为2的位置添加3.33,3.44
 arr.splice(2,0,3.33,3.44)//[1, 2, 3.33, 3.44, 3, 4, 5, 6, 7]

总结

到此这篇关于js数组的基本使用总结的文章就介绍到这了,更多相关js数组使用内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • 常用的JavaScript数组方法

    目录 1.filter() 2.forEach() 3.some() 4.every() 5.reduce() 6.合并数组 1.filter() 语法: array.filter(function(currentValue,index,arr), thisValue) 参数说明: currentValue:当前元素对象(必选) index:当前元素的索引值(可选) arr:当前元素属于的数组对象(可选) thisValue:对象作为该执行回调时使用,传递给函数,用作 "this" 的

  • JavaScript数组详细归纳

    JavaScript数组详细归纳

    目录 一.数组归纳 1. 字符串拆分为数组 2. 将集合和映射转换为新数组 3. 对现有数组进行浅复制 4. arguments 对象轻松转换为数组 5. 转换自定义对象 二.迭代器方法 三.数组常用操作方法 一.数组归纳 1. 字符串拆分为数组 console.log(Array.form("red")) // ["r", "e", "d"] 2. 将集合和映射转换为新数组 const a1 = new Map().set(

  • javascript 数组精简技巧小结

    数组是 JS 最常见的一种数据结构,咱们在开发中也经常用到,在这篇文章中,提供一些小技巧,帮助咱们提高开发效率. 1. 删除数组的重复项 2. 替换数组中的特定值 有时在创建代码时需要替换数组中的特定值,有一种很好的简短方法可以做到这一点,咱们可以使用.splice(start.value to remove.valueToAdd),这些参数指定咱们希望从哪里开始修改.修改多少个值和替换新值. 3. Array.from 达到 .map 的效果 咱们都知道 .map() 方法,.from() 方

  • 浅谈JavaScript数组简介

    浅谈JavaScript数组简介

    目录 数组简介 数组字面量 二维数组 总结 数组简介 数组(Array) - 数组也是一个对象 它和我们普通对象功能类似,也是用来储存一些值的 不同的是普通对象是使用字符串作为属性值的,而数组时使用数字来作为索引操作元素. 索引:从0开始的整数 数组的储存性能比普通对象要好,在开发中我们经常使用数组来储存一些数据 创建数组: var arr = new Array(); 使用 typeof检查一个数组时,会返回 object 向数组中添加元素 语法: 数组[索引] = 值 读取数组中的元素 语法

  • javascript类数组的深入理解

    javascript类数组的深入理解

    js数组,相比大家都很熟悉,因为走到哪都要用,但它有个"双胞胎弟弟" ,叫类数组(也叫伪数组),可能有的人了解,有的人不了解,今天我们来看一看. 什么是类数组 顾名思义,这玩意儿肯定是个长得像数组,但又不算数组的东西.那到底是个啥,其实它就是一个对象,一个长的像数组的对象. 和数组的区别 那类数组和数组有啥区别: 1.都有length属性 2.类数组也可以for循环遍历,有的类数组还可以通过 for of 遍历 3.类数组不具备数组的原型方法,因此类数组不可调用相关数组方法(如,pus

  • JSON用法之将PHP数组转JS数组，JS如何接收PHP数组

    JSON用法之将PHP数组转JS数组，JS如何接收PHP数组

    首先下载下面这个文件(这是一段是别人写出来专门解析json的代码),然后引入这个文件! http://pan.baidu.com/s/1dD8qVr7 现在当我们需要用ajax与后台进行交互时,怎样将php的数组传送到js文件并且并js所识别? 先看php文件,当我们获取到$arr这个数组后 foreach ($arr as $value) { $json .= json_encode($value) . ','; } echo '[' . substr($json,0,strlen($json

  • js数组如何添加json数据及js数组与json的区别

    JSON(JavaScript Object Notation )是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,JSON是JavaScript原生数据格式. 下面给大家介绍js数组添加json数据的两种方式. // 第一种方式 personInfo : [], for(var i = 0; i < _STAGE.passengerInfoArray.length; i++){ var name = _STAGE.passengerInfoArray[i]; var person =

  • JS数组操作(数组增加、删除、翻转、转字符串、取索引、截取(切片)slice、剪接splice、数组合并)

    POP 删除最后一项 删除最后一项,并返回删除元素的值:如果数组为空则返回undefine var a = [1,2,3,4,5]; a.pop();//a:[1, 2, 3, 4] a.pop();//a:[1, 2, 3] a.pop();//a:[1, 2] shift 删除第一项 删除原数组第一项,并返回删除元素的值:如果数组为空则返回undefine var a = [1,2,3,4,5]; a.shift(); //a:[2,3,4,5] a.shift(); //a:[3, 4,

  • js 数组随机字符串(广告不重复)

    比较好的地方就是js数组的操作,不重复的数组id显示,完美实现. theAds=new Array(); shu =13; dot=''; theAds[1]='我们第一条'; theAds[2]='我们第二条'; theAds[3]='我们第三条'; theAds[4]='我们第四条'; theAds[5]='我们第五条'; theAds[6]='我们第六条'; theAds[7]='我们第七条'; theAds[8]='我们第八条'; theAds[9]='我们第九条'; theAds[10

  • JS数组的赋值介绍

    复制代码 代码如下: var test=[1,2,3,4,5,6,7]; var arr=test;arr.splice(2,1);alert(test);//1,2,4,5,6,7 JS数组实质上是对象.因此,上面的源代码最后打印出的是1,2,3,4,5,6.这是因为将test赋值给arr实际上是将数组的引用赋值给arr,所以操作arr也同时会 改变源数组. 要实现数组克隆,可用以下方法: 复制代码 代码如下: Array.prototype.clone=function(){   retur

  • JS数组去掉重复数据只保留一条的实现代码

    JS数组去掉重复数据只保留一条的实现代码

    非常不多说,js数组去掉重复数据的代码如下所示: var arr = [1,2,3,4,5,6,1,6,7,2]; var newArr = []; for(var i =0;i<arr.length-1;i++){ if(newArr.indexOf(arr[i]) == -1){ newArr.push(arr[i]); } } 下面再给大家分享高效率去掉js数组中重复项 Array类型并没有提供去重复的方法,如果要把数组的重复元素干掉,那得自己想办法: function unique(ar

  • js数组操作方法总结(必看篇)

    判断数值数组中各个数字出现的奇偶次数 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>数组操作</title> </head> <body> <script type="text/javascript"> var arr=[3,1,2,2,1,3,1

  • js数组的操作详解

    用js有很久了,但都没有深究过js的数组形式.偶尔用用也就是简单的string.split(char).这段时间做的一个项目,用到数组的地方很多,自以为js高手的自己居然无从下手,一下狠心,我学!呵呵.学了之后才知道,js数组的功能强大很,远比VB,C#强多了,大家慢慢看吧 1.数组的创建 复制代码 代码如下: var arrayObj = new Array(); //创建一个数组var arrayObj = new Array([size]); //创建一个数组并指定长度,注意不是上限,是长

  • 如何高效率去掉js数组中的重复项

    如何高效率去掉js数组中的重复项

    方式一: 常规模式 1.构建一个新的临时数组存放结果 2.for循环中每次从原数组中取出一个元素,用这个元素循环与临时数组对比 3.若临时数组中没有该元素,则存到临时数组中 方式二: 使用了默认Js数组sort默认排序,是按ASCII进行排序: 若要按照升降序的排列如下:<控制台打印输出> 1.先将当前数组进行排序 2.检查当前中的第i个元素 与 临时数组中的最后一个元素是否相同,因为已经排序,所以重复元素会在相邻位置 3.如果不相同,则将该元素存入结果数组中 方式三: <推荐>利

  • 详解JS数组Reduce()方法详解及高级技巧

    基本概念 reduce() 方法接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始缩减,最终为一个值. reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参数:初始值(或者上一次回调函数的返回值),当前元素值,当前索引,调用 reduce 的数组. 语法: arr.reduce(callback,[initialValue]) callback (执行数组中每个值的函数,包含四个参数) previousValue (上

随机推荐