使用数组存储数据集合
这是一个一维数组(one-dimensional array),它只有一层,或者说在它里面没有包含其它的数组结构。你可以看到它里面包含了布尔值(booleans)、字符串(strings)、数字(numbers)以及一些其他的 JavaScript 语言中合法的数据类型:
let simpleArray = ['one', 2, 'three’, true, false, undefined, null];
console.log(simpleArray.length);
// 输出 7
你可以在上述例子中看到,所有数组都有一个长度(length)属性。你可以简单地使用Array.length方法来访问它。
使用push()和unshift()将项目添加到数组
数组是可变的。在这一挑战中,我们将研究两种可以通过编程方式修改数组的方法:Array.push()和Array.unshift()。
两种方法都将一个或多个元素作为参数,并将这些元素添加到调用该方法的数组中。该push()方法将元素添加到数组的末尾,unshift()并将元素添加到开头。考虑以下:
let twentyThree = 'XXIII';
let romanNumerals = ['XXI', 'XXII'];
romanNumerals.unshift('XIX', 'XX');
romanNumerals将具有价值[‘XIX’, ‘XX’, ‘XXI’, ‘XXII’]。
romanNumerals.push(twentyThree);
romanNumerals将具有价值[‘XIX’, ‘XX’, ‘XXI’, ‘XXII’, ‘XXIII’]。注意,我们还可以传递变量,这使我们在动态修改数组数据时具有更大的灵活性。
使用pop()和shift()从数组中删除项目
pop() 删除从阵列的端部的元件,而shift()将删除开头的元素。
使用splice()删除项目
splice()允许我们做到这一点:从数组中的任何位置删除任意数量的连续元素。
splice()最多可以包含3个参数,但现在,我们仅关注前两个参数。的前两个参数splice()是整数,它们表示splice()被调用数组的索引或位置。请记住,数组是零索引的,因此要使用表示数组的第一个元素0。splice()的第一个参数表示要从中开始删除元素的数组上的索引,而第二个参数表示要删除的元素数。例如:
let array = ['today', 'was', 'not', 'so', 'great'];
array.splice(2, 2);
在这里,我们从第三个元素(索引2)开始删除2个元素。array将具有价值[‘today’, ‘was’, ‘great’]。
使用splice()添加项目
您可以使用由一个或多个元素组成的第三个参数添加到数组中。这对于将一个元素或一组元素快速切换出另一个元素非常有用。
const numbers = [10, 11, 12, 12, 15];
const startIndex = 3;
const amountToDelete = 1;
numbers.splice(startIndex, amountToDelete, 13, 14);
console.log(numbers);
的第二个条目12被删除,我们在相同的索引处添加13和14。该numbers数组现在为[ 10, 11, 12, 13, 14, 15 ]。
在这里,我们从数字数组开始。然后,将以下内容传递给splice():从该索引处开始删除元素的索引(3),要删除的元素数(1)和其余参数(13、14)。请注意,后面可以有任意多个元素(用逗号分隔)amountToDelete,每个元素都将被插入。
使用slice()复制数组项
我们将介绍的下一个方法是slice()。无需修改数组,而是将给定数量的元素slice()复制或提取到新数组中,而无需修改即可调用该数组。slice()仅使用2个参数-第一个是开始提取的索引,第二个是停止提取的索引(提取将一直进行,直到但不包括该索引处的元素)。考虑一下:
let weatherConditions = ['rain', 'snow', 'sleet', 'hail', 'clear'];
let todaysWeather = weatherConditions.slice(1, 3);
todaysWeather会拥有价值[‘snow’, ‘sleet’],而weatherConditions仍然会有[‘rain’, ‘snow’, ‘sleet’, ‘hail’, ‘clear’]。
实际上,我们通过从现有数组中提取元素来创建了一个新数组。
使用Spread运算符复制阵列
尽管slice()可以让我们在复制数组的哪些元素方面有选择余地,但还有其他一些有用的任务,ES6的新扩展运算符使我们可以使用简单且易读的语法轻松地依次复制数组的所有元素。传播语法看起来像这样:…
在实践中,我们可以使用spread运算符来复制数组,如下所示:
let thisArray = [true, true, undefined, false, null];
let thatArray = [...thisArray];
thatArray等于[true, true, undefined, false, null]。
thisArray保持不变,并thatArray包含与相同的元素thisArray。
将数组与传播运算符组合
散布运算符的另一个巨大优势是能够组合数组,或在任何索引处将一个数组的所有元素插入另一个数组的能力。使用更传统的语法,我们可以连接数组,但这仅允许我们在一个数组的结尾和另一个数组的开头合并数组。传播语法使以下操作极为简单:
let thisArray = ['sage', 'rosemary', 'parsley', 'thyme'];
let thatArray = ['basil', 'cilantro', ...thisArray, 'coriander'];
thatArray将具有价值[‘basil’, ‘cilantro’, ‘sage’, ‘rosemary’, ‘parsley’, ‘thyme’, ‘coriander’]。