数组是一种特殊对象。js中并没有真正的数组，只是用对象模拟数组。数组是值的有序集合，每一个值叫做一个元素，而每一个元素在数组中有一个位置，以数字表示，称为所以。而JS中没有真正的数组，只是用对象模拟数组。很多刚接触和学习JS的朋友，对于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数据内容大家可以关注其他文章。

免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。

猜你喜欢

• vue中怎样实现全局右键菜单的组件，代码是什么

  前段时间公司在做一个webIDE项目，其中有对文件树的各种操作，主要通过右键菜单实现，今天就来记录一下怎么在vue项目中实现全局的自定义右键菜单。效果如图所示：注意：需要在项目中找到页面整体布局的组件，比如项目使用Home.vue作为整个项目的公共布局，将根元素定位设置成relative，使右键菜单相对于其进行定位。本

• JavaScript类型检测方法是什么，具体怎样做

  JavaScript是web前端广泛应用的语言之一，在网页应用制作、脚本制作、小程序等诸多领域具有不可替代的的地位。笔者学习了一端时间的前端，颇感JS知识点的繁碎，故将学习到的一些知识、思考和感悟记录下来。

• JavaScript中循环方法有哪些，你知道几个？

  js中的循环方法有哪些？关于在JavaScript 中的遍历循环的方法很多，下面给大家分享的是for循环、for...in循环、for...of循环、foreach(...)、some(...)、every(...)这六种循环，感兴趣的朋友可以参考学习。

• vue框架怎样实现选择题的答题功能？

  这篇文章主要给大家分享怎样用vue框架来实现选择题的答题功能，也就是选对选项跳下一题，选错则提示重新答题，下文有具体的代码，感兴趣的朋友可以参考，下面我们一起来了解一下吧。

• 浅谈js中this和箭头函数用法

  文本给大家分享的是js中this和箭头函数，其中关于this关键字是很多新手学习JavaScript时，比较难理解。箭头函数是新增的，小编觉得比较有意思，因此下文给大家介绍一下。对js中this和箭头函数感兴趣的朋友就继续往下看吧。