JS Array 数组详解

在JavaScript中，Array(数组)是一个十分重要的数据类型之一。本篇攻略将深入讲解JS数组的定义、用法、属性、方法等知识点，帮助读者全面理解和掌握JS数组的使用。

数组的定义

JS数组是一个用来存储一组数据的有序集合，可以存储不同数据类型和数据结构（如数字、字符串、对象、函数等）的值。可以使用数组字面量([])或Array()构造函数来创建一个空数组对象。

以下是创建一个空数组的示例：

const myArray = [];  // 数组字面量方式
const myOtherArray = new Array();  // 构造函数方式

可以使用Array.isArray()函数来判断一个变量是否为数组类型：

const arr = [1, 2, 3];
console.log(Array.isArray(arr));  // true

数组的属性和方法

接下来我们了解以下JS数组的重要属性和方法。

length

length属性用于获取或设置数组的长度（也就是数组中元素的个数）。当数组中有删除或添加元素操作时，数组长度自动更新。

以下是使用length属性获取数组长度的示例：

const myArray = [1, 2, 3, 4, 5];
console.log(myArray.length);  // 5

使用length属性修改数组长度：

const myArray = [1, 2, 3, 4, 5];
myArray.length = 3;
console.log(myArray);  // [1, 2, 3]

push和pop

push()和pop()是对数组末尾元素进行添加和删除的方法。

以下是使用push()向数组末尾添加元素的示例：

const myArray = [1, 2, 3];
myArray.push(4);
console.log(myArray);  // [1, 2, 3, 4]

以下是使用pop()删除末尾元素的示例：

const myArray = [1, 2, 3];
myArray.pop();
console.log(myArray);  // [1, 2]

unshift和shift

unshift()和shift()是对数组开头元素进行添加和删除的方法。

以下是使用unshift()向数组开头添加元素的示例：

const myArray = [1, 2, 3];
myArray.unshift(0);
console.log(myArray);  // [0, 1, 2, 3]

以下是使用shift()删除数组开头元素的示例：

const myArray = [1, 2, 3];
myArray.shift();
console.log(myArray);  // [2, 3]

concat

concat()方法用于连接多个数组，并返回一个新的数组。原始数组不会被修改。

以下是使用concat()方法连接多个数组的示例：

const arr1 = [1, 2];
const arr2 = [3, 4];
const arr3 = [5, 6];
const newArr = arr1.concat(arr2, arr3);
console.log(newArr);  // [1, 2, 3, 4, 5, 6]

slice

slice()方法用于截取一个数组的一段，并返回一个新的数组。不会影响原始数组。

以下是使用slice()方法截取数组的示例：

const myArray = [1, 2, 3, 4, 5];
const slicedArray = myArray.slice(2, 4);
console.log(slicedArray);  // [3, 4]

join

join()方法将数组的所有元素拼接成一个字符串。可以传入一个字符串参数作为分割符号。

以下是使用join()方法拼接数组元素的示例：

const myArray = [1, 2, 3];
const joinedString = myArray.join(',');
console.log(joinedString);  // "1,2,3"

示例

示例1：数组操作

以下是一个对数组进行操作的示例，代码中使用了数组的push、pop、shift、unshift、concat、slice以及length等方法：

const arr = [1, 2, 3];
console.log(arr.length);  // 3

arr.push(4);
console.log(arr);  // [1, 2, 3, 4]

arr.pop();
console.log(arr);  // [1, 2, 3]

arr.unshift(0);
console.log(arr);  // [0, 1, 2, 3]

arr.shift();
console.log(arr);  // [1, 2, 3]

const arr2 = [4, 5, 6];
const newArr = arr.concat(arr2);
console.log(newArr);  // [1, 2, 3, 4, 5, 6]

const slicedArr = newArr.slice(2, 4);
console.log(slicedArr);  // [3, 4]

const joinedString = newArr.join('-');
console.log(joinedString);  // "1-2-3-4-5-6"

示例2：多维字母数组排序

以下是一个使用数组进行多维排序的示例：

const alphabet = [['c', 'b', 'a'], ['f', 'e', 'd'], ['i', 'h', 'g']];

alphabet.forEach(item => {
  item.sort();
});

alphabet.sort((a, b) => {
  if (a[0] < b[0]) {
    return -1;
  } else if (a[0] > b[0]) {
    return 1;
  } else {
    return 0;
  }
});

console.log(alphabet);  // [['a', 'b', 'c'], ['d', 'e', 'f'], ['g', 'h', 'i']]

在上述示例中，我们首先使用forEach()方法对每个子数组进行字母排序，然后使用sort()方法对整个二维数组进行第一列的字母排序。最终输出结果为[['a', 'b', 'c'], ['d', 'e', 'f'], ['g', 'h', 'i']]。