web前端—前端三剑客之JS(7)：数组(一)

目录

创建数组

数组对象的检测

数组的操作方法

数组的高级方法

---

见：https://blog.csdn.net/JBY2020/article/details/109864650

上篇：https://blog.csdn.net/JBY2020/article/details/118438802

下篇：数组(二)的高级方法

创建数组

1、使用构造函数创建

var arr = new Array();   // 使用Array 构造函数

括号中参数说明：

• 如果没有参数，表示创建的是一个空的数组对象。
• 如果参数为一个number类型的整数，表示创建一个固定长度的数组对象，这个整数表示的就是数组的长度length。
• 如果是其他非数值类型的参数，表示的数组对象的值。

2、字面量创建

数组字面量由一对包含数组项的方括号表示，多个数组项之间以逗号隔开。

注意：如果使用数组字面量的方式创造数组的话, 那么用逗号隔开的各个数组项的最后一个, 最好不要是空的, 这样js解析引擎不同的版本会展示完全不一样的结果。

var arr1 = new Array(5);  // 创建一个长度为5的数组对象
var arr2 = new Array('zhangsan',3,arr1);
// 字面量创建数组对象
var arr3 = [1,2,3,4,5,6,7,8,9,0];
var arr4 = [2,4,6,,,,];   // 最后一个数组内容后面不要有逗号，否则会增加数组的长度

修改数组对象的长度会改变数组对象的内容

var arr4 = [2,4,6,,,,];   // 最后一个数组内容后面不要有逗号，否则会增加数组的长度
// 修改数组对象的长度
arr4.length = 2;
console.log(arr4);
// arr4.length = 5;
// console.log(arr4);

  

数组对象的检测

typeof操作符把数组归类到了对象中, 所以要判断一个数据是对象还是数组需要新的操作符来实现。

• Array.isArray(待检测对象)      // 方法1
• 待检测对象    instanceof  Array   // 方法2

        //检测数组对象
        console.log(Array.isArray(arr3));
        console.log(arr3 instanceof Array);

  

数组的操作方法

增删

Array.push(‘值’)；        ——往数组末尾增加一个数组项目，与此同时,数组的length自动加1

Array.shift()；             ——删除数组的第一个数组项目，与此同时,数组的length自动减1

Array.unshift(‘值’)；     ——往数组开始位置增加一个数组项目，与此同时,数组的length自动加1

Array.pop()；            ——删除数组的最后一个数组项目，与此同时,数组的length自动减1

var arr3 = [1,2,3,4,5,6,7,8,9,0];
arr3.push('zhangsan','lisi');  // 追加，文明排队
console.log(arr3);
arr3.shift();   // 删除第一个
console.log(arr3);
arr3.unshift('wangwu');  // 第一位开始添加，不文明插队
console.log(arr3);
arr3.pop();   // 删除最后一个
console.log(arr3);

  

• 数组队列操作方法：push、shift
• 数组反向队列操作方法：unshift、pop
• 数组栈操作方法：push、pop

数组的高级方法

反转reverse()

reverse()方法会反转数组项的顺序

直接在原始的数组上排序, 只是单纯的调转数字的数组项目的整体顺序而已，该方法会改变原始的数组

正向排序sort()

（将数组内容转为字符串之后再排序，按照ASSIC码的值，而不是数字的大小）

sort()方法会按照字符串的先后顺序对数组的每一个数组项目的字符顺序来进行排序的

如果数组的某个项目不是字符串, 那么会先把数组项目转换为字符串,再来按照字符串的比较方式来排序，该方法会改变原始的数组

深复制concat()

concat()方法不会改变原数组，用于数组对象的深复制

括号中的参数：

• 没有参数时，复制一个新的数组对象
• 有参数时，每一个逗号隔开的参数都会被添加到新复制的数组对象的后面，如果参数中也有数组，则会进行数组的合并。

切片slice()

slice()方法可以接受一或两个参数，即要返回项的起始和结束位置。slice()方法不会影响原始数组

用来截取数组对象，相当于python中的切片，区间表示为左闭右开。

• 如果不传入参数的情况下, silce()方法返回完整的数组
• 在只有一个参数的情况下，slice()方法返回从该参数指定位置开始到当前数组末尾的所有项（起始下标位置到末尾）。
• 如果有两个参数，该方法返回起始和结束位置之间的项——但不包括结束位置的项。

最强大的数组方法splice()

splice()主要功能有以下三大类：

1. 删除：可以删除任意数量的项，只需指定2 个参数：要删除的第一项的位置和要删除的项数。
2. 插入：可以向指定位置插入任意数量的项，只需提供3 个参数：起始位置、0（要删除的项数）和要插入的项。如果要插入多个项，可以再传入第四、第五，以至任意多个项。
3. 替换：可以向指定位置插入任意数量的项，且同时删除任意数量的项，只需指定3 个参数：起始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等。

括号中的参数：前两个为数字的时，第一个表示开始删除的索引位置，第二个表示从索引开始的项数。项数位0时，表示没有删除替换，而是在对应索引项之后开始插入内容。splice()方法会影响原始数组

获取索引位置indexOf()和lastIndexOf()

ECMAScript 5 为数组实例添加了两个位置方法：indexOf()和lastIndexOf()。用来返回对象在数组中的索引位置，如果有相同的值，只返回最先找到的一个对应的索引下标。

这两个方法都接收两个参数：要查找的项和（可选的）表示查找起点位置的索引。

其中，indexOf()方法从数组的开头（位置0）开始向后查找，lastIndexOf()方法则从数组的末尾开始向前查找。

这两个方法都返回要查找的项在数组中的位置，或者在没找到的情况下返回-1。在比较第一个参数与数组中的每一项时，会使用全等操作符；也就是说，要求查找的项必须严格相等（就像使用===）。

var arr5 = ['2','4','6','8','10'];
console.log(arr5);
console.log(arr5.indexOf('8'));