在实例中掌握数组的各类方法！

今天药忘吃喽~ 2022-11-17 14:44 129阅读 0赞

## 数组 ##

概念：可以存放多个数据，并且有序排列
    查找数组中的数据：
        数组名[下标]
        数组名[下标] = 新值
              1.如果下标存在  则修改
              2.如果下标不存在  则新增

### 检测数组的长度 ###

数组名.length

### 判断是不是一个数组 ###

Array.isArray(数组名)

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1dzaDIwMjEwMzAx_size_16_color_FFFFFF_t_70_pic_center]

### 数组新增的方法 ###

push()
        往数组的末尾添加一个或者多个元素
        每个要添加的元素之间用逗号隔开，并返回新的长度！
        
    unshift()
        向数组的最前面添加一个或者多个元素
        每个元素用逗号隔开，，并返回新的长度！

![在这里插入图片描述][20210411143855620.png]  
![在这里插入图片描述][20210411143908588.png]

### 数组的删除方法 ###

pop()
        删除数组的最后一个元素
        没有参数
    shift()
        删除数组的最前面一个元素

![在这里插入图片描述][20210411143925408.png]  
![在这里插入图片描述][20210411143940147.png]

### 排序 ###

reverse（）  没有参数   但是能够颠倒数组中的元素   改变原来的数组
    arr.sort(function(a,b){
            return b-a;
    })
    传入一个函数   a-b 升序  如果是  b-a 为降序

![在这里插入图片描述][20210411144411989.png]

### 索引 ###

indexof()
        根据数组（元素）找下标，但是只会找到第一个
        如果找不到就 返回-1
    lastindexof（）
        根据元素找下标，但是只会找最后一个

![在这里插入图片描述][20210411144125368.png]

### 数组转换为字符串 ###

toString（）  只是简单将数组转换为了字符串 但是中间有逗号分隔
    join（）      不仅是可以将数组变成字符串而且可以改变中间的分隔字符

![在这里插入图片描述][20210411144139748.png]

![在这里插入图片描述][20210411144154786.png]

### 数组元素的操作 ###

concat（）
        能将两个或者多个数组合并为一个新数组
    slice(从哪个地方开始截取,截取到的地方)

![在这里插入图片描述][2021041117101061.png]

![在这里插入图片描述][20210411144208112.png]

splice(从哪儿开始,删除多少个)
        数组删除   删除任意的一个或者多个元素  影响原来的数组

![在这里插入图片描述][20210411144227818.png]

**参考代码如下：**

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <body>
        <script> // 定义一个数组和一个字符串检测是否为数组 var arr=[10,99,188,66,25] var str="you are a lucky guy!" 在控制台显示布尔变量看看检测的结果 console.log(Array.isArray(arr));//打印出true console.log(Array.isArray(str));//打印出false //定义一个原数组，打印出它的长度 var arr=[10,99,188,66,25] console.log(arr); console.log(arr.length); // 新数组 arr.push("晴天"); console.log(arr); console.log(arr.length); //定义一个原数组，打印出它的长度 var arr=[10,99,188,66,25] console.log(arr); console.log(arr.length); // 新数组 arr.unshift("周杰伦"); console.log(arr); console.log(arr.length); //定义一个原数组，打印出它的长度 var arr=[10,99,188,66,25] console.log(arr); console.log(arr.length); // 新数组 arr.pop();//括号里没有参数 console.log(arr); console.log(arr.length); //定义一个原数组，打印出它的长度 var arr=[10,99,188,66,25] console.log(arr); console.log(arr.length); // 新数组 arr.shift(); console.log(arr); console.log(arr.length); //定义一个原数组，打印出它的长度 var arr=[10,99,188,66,25] console.log(arr); // 新数组 arr.reverse(); console.log(arr); // 根据子串找下标 var arr=["中国","美国","韩国","法国","德国","英国"]; var arr1=arr.indexOf("韩国");//返回韩国的下标2 console.log(arr); console.log(arr1); //数组转换为字符串的两种方法 //方法一： var arr=["中国","美国","韩国","法国","德国","英国"]; var str=arr.toString(); console.log(arr); console.log(str); //方法二: var arr=["中国","美国","韩国","法国","德国","英国"]; var str=arr.join("$");//jion可以改变元素中间的连接符号 console.log(arr); console.log(str); //两个或者多个数组相连接 var arr=[10,99,188,66,25]; var arr1=["中国","美国","韩国","法国","德国","英国"]; console.log(arr); console.log(arr1); var arr3= arr.concat(arr1); console.log(arr3); // 数组的截取 var arr=["晴天",123,"周杰伦","叶惠美",99,188,499]; console.log(arr); var arr5=arr.slice(0,4); console.log(arr5); 向数组数组中添加元素或者删除元素 var arr=[1,2,3]; console.log(arr); arr.splice(2,1,"中国");//表示从第三个元素开始删除一个元素，添加一个元素“中国” console.log(arr); </script>
    </body>
    </html>

### 总结： ###

在了解数组中的这些方法中，如何将这些方法融会贯通呢，那就要大家结合实际例子将各类方法多多练习，了解其中的用法和原理，才能真正掌握数组！**废话不多说大家赶紧动动小手拿起手中的键盘敲起来吧！**

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1dzaDIwMjEwMzAx_size_16_color_FFFFFF_t_70_pic_center]: /images/20221022/d9f62cd2d542403abc7fb70fa9296306.png
[20210411143855620.png]: /images/20221022/51cf9df93ab940cc95b1be13fe8695d2.png
[20210411143908588.png]: /images/20221022/c90bf887029640919896965c04d45cb3.png
[20210411143925408.png]: /images/20221022/436946722971474e9bffd5f64849d4e0.png
[20210411143940147.png]: /images/20221022/63048106829f4dbf83a6dd6028efdb4e.png
[20210411144411989.png]: /images/20221022/974aefa4eeb84684bddfa59bcc4df621.png
[20210411144125368.png]: /images/20221022/155ecb9d58a141308d59d548744320b6.png
[20210411144139748.png]: /images/20221022/c42deb5228a54ba3996f21f930cc16ee.png
[20210411144154786.png]: /images/20221022/f5ecb07c00e3405ab7e1bc656c9995af.png
[2021041117101061.png]: /images/20221022/273d80c848914481bc4788e1e135c549.png
[20210411144208112.png]: /images/20221022/339288f4baf54a22974eb89ec6bf47b9.png
[20210411144227818.png]: /images/20221022/60074e6c4d18462f827bcb10bd75998b.png