JavaScript数组对象及其方法详解_js给出一个数组对象,用程序在页面中分别输出数组对象的属性值。-优快云博客

本文链接：https://blog.youkuaiyun.com/zhangawei123/article/details/127558549

本文深入探讨JavaScript中的数组对象，包括创建方式、遍历、增删改查、排序及迭代方法。通过实例解析了for循环与for-in的区别，详细介绍了push、pop、unshift、shift、splice等操作，以及indexOf、lastIndexOf、sort等查找和排序方法。同时，文章还涵盖了数组去重、快速排序等高级技巧，是前端开发者必备的JavaScript数组知识大全。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

本文章讲解JavaScript中的数组对象以及其相关方法。包括了数组的遍历，数组内容的增删改，数组元素的擦护照检索，数组的排序，数组的迭代等方法。内容比较齐全，希望可以帮助大家。

第一种方法：使用for循环和splice()

案例：indexOf()检测数组中某个元素的个数

案例：把数组中大于100的元素渲染到界面上并且换行

数组迭代方法的总结：

数组的作用：存储一系列的值，无序结合，数组可以存储任何的数据类型

数组的创建的方式：

- var

var arr=['asd',1,2,'我是数组']

- new

var arr1= new Array(1,2,3)

console.log(arr1);

var arr1= Array(1,2,3)

console.log(arr1);

如何遍历数组

for循环遍历

var arr =[1,2,3,4,5]
for (var i = 0; i < arr.length; i++) {

console.log(arr[i]);

}

输出结果：

扩展：遍历字符串也是如此

var str='asdasf'

for (var i = 0; i < str.length; i++) {

    console.log(str[i]);

 }

遍历对象 for-in

for in是一种特殊的循环，主要用来遍历对象。

语法：

for（var key in object）{}

举例，使用for-in遍历object：

var obj={
name:'张三',
age:19,
data:123,
set:1234
}

for (var key in obj) {
console.log(key);//属性名
console.log(obj[key]);//属性值
}

输出结果如下：html：27是打印key，28是打印的obj[key]

如此可见，在遍历object的时候，key是属性名，而obj[key]是属性值

举例：使用for-in遍历数组

var arr=['asd',1,2,'我是数组']
for (var key in arr) {
console.log(key);//下标
console.log(arr[key]);//每一项
 }

输出结果：html：32是打印key，33是打印的arr[key]

如此可见，在遍历数组时候，key是下标。

举例：使用for-in遍历字符串

var str='asdasd'
for(var key in str){
    console.log(str[key]);
}

输出结果：html：37是打印key，38是打印的str[key]

如此可见，在遍历字符串的时候，与遍历数组基本类似。

for和for-in的区别

先上代码：

var arr=['asd',1,2,'我是数组']
for (var key in arr) {
    console.log(typeof key);//string
 }
for (var i = 0; i < arr.length; i++) { 
    console.log(typeof i);//number
}

输出结果：

如此可见：for in遍历数组，输出的key的类型是string类型，而for循环是输出number类型的。

所以：

- for-in遍历对象更合适，但是他可以遍历数组，字符串，遍历出来的数组，字符串都是下标，下标是string类型，不方便进行运算，而for不能遍历对象（因为对象没有下标）遍历数组字符串时下标是number类型可以参与运算

- 建议使用for-in 遍历对象， for循环遍历数组字符串

给数组修改, 添加，删除内容

基本方法：

简单的改，增，把数组下标为0的元素改为a，给数组增加新元素4.

        var arr = [1, 2, 3]
        console.log(arr[0]);
        arr[0] = 'a'//修改原数组的内容
        arr[3] = 4//给数组添加内容
        console.log(arr);

给数组添加数字，给空数组arr，使用for循环添加1到20数字的元素，共长20。

var arr=[]
for(var i=1;i<=20;i++){
    arr[arr.length]=i
}
console.log(arr);

栈方法

push（）

给数组末尾添加值， push()可以添加一个或多个元素进入数组尾部，返回值是新数组的长度。

语法：数组.push('你要添加的内容')

举例：给空数组arr添加内容

var  arr=[]
arr.push('a','b',1)
console.log(arr);

结果：

举例，用push()往数组里面添加数组

        var arr = [1, ['a', 's', 'd'],8]
        arr.push('a', 'b', 1, [1, 3, 4])
        console.log(arr);

结果：

如此可见，往数组里面添加数组，添加进去的数组作为一个元素放在被添加的数组里面。

push()案例：把字符串添加进入数组中

我们可以使用for循环，遍历字符串，并在遍历的时候使用push()把字符串挨个添加进入数组。

        var arr = [1, 2, 'b', 3, 'a']
        var str = '1232134'
        for (var i = 0; i < str.length; i++) {
            arr.push(str[i])
        }
        console.log(arr);

效果：