ES5:
数组方法:
ES6:
数组创建:
数组扩展方法:
扩展运算符: ...
ES5:
数组方法:
- join():该方法不改变原数组
语法:arr.join(separator) 参数:separator: 指定一个字符串用来分隔数组的每个元素, 如果指定为空字符串,则分隔元素之间没有字符 返回值:返回一个字符串(数组的所有元素都转换成单独的字符串,如果数组是空数组,则返回空字符串 let arr1 = [], arr2 = [1,3,5,'ssfs']; console.log(arr1.join("")); // 空字符串 console.log(arr2.join("")); // 135ssfs console.log(arr1.join("_")); ///空字符串 console.log(arr2.join("s*n"));//1s*n3s*n5s*nssfs console.log(arr2.join("-")); //1-3-5-ssfs 注:当数组元素转换字符串时,这些特例: null和undefined它将转换为空字符串,对象将转换为空字符串[object,Object] let fn = function(){return 1;}, arr3 = [{a:[2,3],null,undefined,true,false,fn] console.log(arr3.join(" ")); //[object Object] 2,3 true false function(){return 1;}
- concat():该方法不改变原数组
功能:拼接数组 // 拼接:concat() 方法用于合并两个或多个数组,不改原数组,而是返回一个新数组。 let arr5 = [1,2,3,0], arr6 = 二,三d']; console.log(arr5.concat(arr(6); 2, 3, 0, 1, '2', '3', 'd'] console.log(arr6.concat(arr5));//[1, '2', '3', 'd', '1', 2, 3, 0] console.log(arr5,arr6);//['1', 2, 3, 0] [1, '2', '3', 'd']
- pop()这种方法会改变原数组
功能:删除数组的最后一个元素 返回值:数组中删除的元素(当数组空时,返回undefined) let arr1 = [], arr2 = ['start','middle','end']; console.log(arr1.pop()); //undefined console.log(arr2.pop()); //end console.log(arr2); //['start', 'middle']
- push()这种方法会改变原数组
功能:在数组末尾添加一个或多个元素 语法:arr.push(element1...elementN) 参数:element:添加的元素 返回值:返回数组的新长度 let arr1 = [], arr2 = ['start','middle','end']; console.log(arr1.push('newElement一、二、三); //4 console.log(arr1); //['newElement', 1, 2, 3] console.log(arr2.push('add new',-1)); //5 console.log(arr2); //['start', 'middle', 'end', 'add new', -1]
- shift()这种方法会改变原数组
功能:删除数组的第一个元素 返回值:返回数组中删除的元素(如果数组为空,则返回undefined) let arr1 = [0,1,2,3,4], arr2 = []; console.log(arr1.shift()); //0 console.log(arr1); //[1, 2, 3, 4] console.log(arr2.shift()); //undefined
- unshift()这种方法会改变数组
功能:在数组头部添加(一个或多个元素) 返回值:返回新元素后的数组长度 // 头部新增值:unshift(可增加一个或多个值) let arr = [[12,0],{as:1}] console.log(arr.unshift('start,0,1,2,3);/7 console.log(arr); //['start', 0, 1, 2, 3, Array(2), {as:1}]
- slice():不改变原数组
slice(): 用于数组的浅拷贝 语法:arr.slice(start,end) :提取从start(包括start处)到end(不包括end结束的数组元素 参数:start: 下标(默认为0)开始提取, 若为负数时,则-n指原数组倒数第n个元素的索引 若大于原数组的索引范围,返回空数组 end: 下标终止提取 若它为负数(-n), 原数组中倒数第n个元素的提取 若忽略,默认提取到最后 (与字符串slice()不同的方法,当提取的开始和结束索引为负,后者的绝对值大于前者时,前后索引不会交换) 返回值:返回符合提取条件的新数组 let arr = [1,'a',1,0,122,'b',742,-1]; console.log(arr.slice(-1,)); //[-1] console.log(arr.slice(-6,)); //[1, 0, 122, 'b', 742, -1] console.log(arr.slice(8)); //[] console.log(arr.slice(1,2)); //['a'] console.log(arr.slice(-5,-6);//[] console.log(arr.slice(-5,-4)
- splice()这种方法会改变原数组
功能:可添加、删除、替换数组元素 返回值:返回由删除元素组成的数组,如果不删除元素,返回空数组 // splice:删除或替换现有元素或添加新元素 会改变原数组 // array.splice(start deleteCount [item1,item2,item3...]) // 开始的索引 删除元素数量 删除替换或添加的元素 let array2 = ['Monday',20,'Wednesday',40,'Friday',60]; // 替换 onsole.log(array2.splice(1,1,'Tuesday')); //[20] array2.splice(3,1,'Thursday'); // 删除 array2.splice(5,1); // 新增 array2.splice(5,0,'Saturday','Sunday'); console.log(array2);//['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']
- indexOf():不改变原数组
indexOf(): 语法:arr.indexOf(searchElement, fromIndex) 参数:searchElement:要查找的元素 fromIndex:开始查找的位置(下标):默认值为0 下标为负数时(查找顺序仍为从前往后):则将其作为数组末尾的一个抵消,即 -1 表示从最后一个元素开始查找 ,-2 表示从倒数第二个元素开始查找,若抵消后的索引值仍小于 0,则查询整个数组 下标大于等于数组长度时:返回-1 返回值:返回第一次查找到的元素下标,没找到则返回-1 let arr = ['a','b','c','a','d','e',-1]; console.log(arr.indexOf('a')); //0 console.log(arr.indexOf('a',1)); //3 console.log(arr.indexOf('a',-7));//0 console.log(arr.indexOf('a',-8));//0 console.log(arr.indexOf('a',4)); //-1 console.log(arr.indexOf('a',-4));//3
- lastIndexOf():不改变原数组
lastIndexOf():返回指定元素在数组中出现的最后一个下标(逆向查找,但是下标仍为从左往右递增) 语法:arr.indexOf(searchElement, fromIndex) 参数:searchElement:要查找的元素 fromIndex:开始查找的下标(默认为数组长度减一,即从最后一个元素开始逆向查找) 如果该值大于或等于数组的长度,则整个数组会被查找 若为负值,将其视为从数组末尾向前的偏移 若该值为负值且其绝对值大于等于数组长度,则返回 -1 返回值:返回最后一次查找到的元素下标,没找到则返回-1 let arr = ['ncsu',1,31,657,'snc',1,null,{a:1},'e']; console.log(arr.lastIndexOf(1)); //5 console.log(arr.lastIndexOf(2)); //-1 console.log(arr.lastIndexOf(1,9));//5 console.log(arr.lastIndexOf(1,-4));//5 console.log(arr.lastIndexOf(1,-5));//1 console.log(arr.lastIndexOf(1,-9));//-1
ES6:
数组扩展方法:
- find():不改变原数组
作用:返回满足条件的第一个元素(不满足则返回undefined) 语法:arr.find(callback[, thisArg]) 参数:callback:在数组每一项上执行的函数,接收3个参数(element index array) thisArg(可选):执行回调时用作 this 的对象。 //find 返回数组元素 let arr = [12,43,50,52524,313], e1 = arr.find(function(element){ if(element > 100){ return element; } }) e2 = arr.find(function(element){ if(element < 10){ return element; } }) console.log(e1); //52524,返回数组元素 console.log(e2); //undefined
- findIndex():不修改原数组
返回值:返回数组中满足条件的第一个元素的下标(索引),没有则返回-1 参数:同find()方法 // findIndex 返回符合条件的下标 console.log(arr1.findIndex(function(element,index,arr){ if(element > 100){ return element; } })); //3 console.log(arr1.findIndex(function(element,index,arr){ if(element < 10){ return index; } })); //-1
- fill():会改变原数组
语法:arr.fill(value, startIndex , endIndex); 参数: value:用于填充数组元素的值 startIndex:填充开始的索引(使用中为写值时,默认为0) 当它为负数时,把它看成startIndex+arr.length endIndex:终止索引,当它为负数时,把它看成endIndex+arr.length 返回值:修改后的数组 // 用一个固定值填充一个数组中从起始索引到终止索引内的全部元素,不包括终止索引。 let arr1 = [], arr2 = [1,2,3,4]; console.log(arr1.fill("hello")); //空数组 console.log(arr2.fill('start')); //['start', 'start', 'start', 'start'] console.log(arr2.fill('add new',2,5)); //['start', 'start', 'add new', 'add new'] console.log(arr2.fill('change',-1)); // ['start', 'start', 'add new', 'change'] start:-1+4->3 console.log(arr2.fill('replace',2,-1)); // ['start', 'start', 'replace', 'change'] end:-1+4->3 ->起终位置:(2,3) console.log(arr2); //['start', 'start', 'replace', 'change'] // 当开始和结束位置都为负数时,若开始位置加上数组长度,小于,结束位置加上数组长度的索引大小 则修改不生效 console.log(arr2.fill('a',-1,-2));//->('a',3,2) ['start', 'start', 'replace', 'change'] console.log(arr2.fill('b',-2,-1));//->('b',2,3) ['start', 'start', 'b', 'change']
- entries():不改变原数组
/* 简单了解: entries():返回一个新的Array Iterator对象,该对象包含数组中每个索引的键/值对 */ let arr = [1,22,535,'dwf',['sdq',4]], iterator = arr.entries(); console.log(iterator);//Array Iterator {} console.log(iterator.next().value);//[0,1] console.log(iterator.next().value);//[1, 22] console.log(iterator.next().value);//[2, 535] console.log(iterator.next().value);//[3, 'dwf'] console.log(iterator.next().value);//[4, Array(2)]
- keys():不改变原数组
keys()方法:返回一个包含数组中每个索引键的Array Iterator对象(返回数组中每个元素的下标) 返回值:一个新的Array迭代器对象 let arr1 = [1,[22],[1232]] let result=arr1.keys() for (let a of result) { console.log(a) //0 1 2 }
- values():不改变原数组
values()方法:返回一个新的 Array Iterator 对象,该对象包含数组每个索引的值 返回值:一个新的迭代对象 let arr = [12,4324,'120',{s:111}], va = arr.values(); for(let value of va){ console.log(value); // 12 4324 120 {s:111} }
- includes():不改变原数组
作用:用于检查一个数组中是否包含某个指定值 语法:arr.includes(valueToFind, fromIndex) 参数:valueToFind:要查找的指定元素值(0 的值将全部视为相等,与符号无关(即 -0 与 0 和 +0 相等)) fromIndex: 查找开始的索引(下标)默认为0开始,若为负值,则开始索引为:fromIndex+arr.length 返回值:布尔类型(true / false) let arr = [21,12,'c','Stwcs',['a'],{a:1}] console.log(arr.includes(12)); //true console.log(arr.includes(12,2));//false console.log(arr.includes(12,-5));//true ->(12,-5+6)->(12,1) console.log(arr.includes(12,-4));//false console.log(arr.includes('a')); //false
- flat()
语法:arr.flat(depth) 参数:提取嵌套数组的结构深度(维度),默认为1 返回值:一个的新数组 //按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。 let arr=[[11,22,33],4,5,[[666,777],88,[999,[1111],100]]], arr2 = arr.flat(3), arr3 = arr.flat(1); console.log(arr2);//[11, 22, 33, 4, 5, 666, 777, 88, 999, 1111, 100] console.log(arr3);// [11, 22, 33, 4, 5, Array(2), 88, Array(3)] console.log(arr); //[Array(3), 4, 5, Array(3)]