数组及其一些方法(数组·上)
数组的一些方法:
push、unshift都是给数组添加元素,都可以接受多个参数,都会返回添加后的目标数组的长度。前者从数组结尾添加,后者从数组开头处添加。
pop、shift都是从数组删除元素,都不接受参数!都是每次只能删除一个元素,都会返回当次被删除的元素。前者从数组结尾删除,后者从数组开头处删除。
splice方法能在删除给定数量的元素的同时在第一个参数的位置添加给定数量的新元素。它可以接收3个参数——第一个参数是开始的位置(索引);第二个参数是要删除的元素个数(如果未提供第二个参数,则默认删到数组结尾);第三个参数就是要添加的新元素(当不写第三个参数时就默认只是删除元素),数量不限。splice会改变原始数组!慎用:
const inputCities = ["Chicago", "Delhi", "Islamabad", "London", "Berlin"]; console.log(inputCities.splice(3));//splice会以数组的形式返回被删除的元素[ 'London', 'Berlin' ] console.log(inputCities);//原始数组变成了[ 'Chicago', 'Delhi', 'Islamabad' ]
再看例子:
//例一: const numbers = [10, 11, 12, 12, 15]; const startIndex = 3; const amountToDelete = 1; numbers.splice(startIndex, amountToDelete, 13, 14); console.log(numbers); //[ 10, 11, 12, 13, 14, 15 ] //例二: function htmlColorNames(arr) { arr.splice(0,2,'DarkSalmon','BlanchedAlmond'); return arr; } console.log(htmlColorNames(['DarkGoldenRod', 'WhiteSmoke', 'LavenderBlush', 'PaleTurquoise', 'FireBrick'])); /* 控制台输出如下: [ 'DarkSalmon', 'BlanchedAlmond', 'LavenderBlush', 'PaleTurquoise', 'FireBrick' ] */
slice能复制已存在的数组元素,并以数组的形式返回这些元素。它接受2个参数,第一个参数是开始提取的索引,第二个参数是停止提取的索引(提取将持续到此,但不包括该索引处的元素)。如果未提供参数,则默认值是从数组的开始到结束,即会复制粘贴整个数组。slice方法不会改变原始数组,但会返回一个新数组。看例子:
const inputAnim = ["Cat", "Dog", "Tiger", "Zebra", "Ant"]; let myarr=inputAnim.slice(); console.log(myarr);//[ 'Cat', 'Dog', 'Tiger', 'Zebra', 'Ant' ]
再看两个例子:
//例一: let weatherConditions = ['rain', 'snow', 'sleet', 'hail', 'clear']; let todaysWeather = weatherConditions.slice(1, 3);//['snow','sleet'] //例二:参数经过处理后返回新的数组 function forecast(arr) { arr=arr.slice(2,4); return arr; } console.log(forecast(['cold', 'rainy', 'warm', 'sunny', 'cool', 'thunderstorms'])); //[ 'warm', 'sunny' ]
上面例一中的todaysWeather
的值为 ['snow', 'sleet'],weatherConditions 的值仍然为 ['rain', 'snow', 'sleet', 'hail', 'clear']。
扩展符' ... '可以复制数组的全部元素。
let thisArray = [true, true, undefined, false, null]; let thatArray = [...thisArray];
上例中,thatArray 的值为[true, true, undefined, false, null],thisArray保持不变,且thatArray包含与thisArray相同的元素。
看另一个例子——目的:返回一个由arr的num个副本组成的新数组。
function copyMachine(arr, num) { let newArr = []; while (num >= 1) { newArr.unshift([...arr]); num--; } return newArr; } console.log(copyMachine([true, false, true], 2)); //[ [ true, false, true ], [ true, false, true ] ]
扩展符' ... '还能组合数组,即在任何索引处将一个数组的所有元素插入另一个数组。
let thisArray = ['sage', 'rosemary', 'parsley', 'thyme']; let thatArray = ['basil', 'cilantro', ...thisArray, 'coriander']; //['basil', 'cilantro', 'sage', 'rosemary', 'parsley', 'thyme', 'coriander']
内置方法indexOf()可以检查元素是否存在于数组。接受一个元素作为参数,当调用时,它返回该元素的位置或索引,如果数组中不存在该元素,则返回-1。
let fruits = ['apples', 'pears', 'oranges', 'peaches', 'pears']; fruits.indexOf('dates'); //-1,表示数组不存在该元素 fruits.indexOf('oranges'); //2 fruits.indexOf('pears'); //1,当有多个相同元素时,返回第一次出现的位置。
看另一个例子:函数有arr和elem这2个参数,若arr中存在传递的elem时返回true,否则返回false。
function quickCheck(arr, elem) { if(arr.indexOf(elem)>=0){ return true; } else { return false; } } console.log(quickCheck(['squash', 'onions', 'shallots'], 'mushrooms')); //false
在迭代遍历数组上,for循环比JS的内置方法如every()
, forEach()
, map()等要灵活好用。看例子:
elem表示在arr中的嵌套数组中可能存在也可能不存在的元素。使用for循环遍历arr,去掉arr中包含elem的任何数组,返回嵌套数组中不包含elem的过滤版本。
function filteredArray(arr, elem) { let newArr = []; for(let i=0;i<arr.length;i++){ if(arr[i].indexOf(elem)==-1){ newArr.push(arr[i]); } } return newArr; } console.log(filteredArray([[3, 2, 3], [1, 6, 3], [3, 13, 26], [19, 3, 9]], 3)); //[]
多维数组:
let nestedArray = [ ['deep'], [ ['deeper'], ['deeper'] ], [ [ ['deepest'], ['deepest'] ], [ [ ['deepest-est?'] ] ] ] ];
deep数组的嵌套深度为2层,deeper数组的嵌套深度为3层,deepest数组的嵌套深度为4层,deepest-est?为5层。可以很容易地使用中括号访问数组的最深层:
console.log(nestedArray[2][1][0][0][0]); //deepest-est?
取到最深层的数据之后,还能修改它:
nestedArray[2][1][0][0][0] = 'deeper still'; console.log(nestedArray[2][1][0][0][0]); //deeper still
。。。