splice() 添加/删除/替换数组元素
定义: splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目
语法: array.splice(index,howmany,item1,…,itemX)
删除:可以删除任意数量的项,只需指定 2 个参数:要删除的第一项的位置和要删除的项数。例如, splice(0,2)会删除数组中的前两项。
插入:可以向指定位置插入任意数量的项,只需提供 3 个参数:起始位置、 0(要删除的项数)和要插入的项。例如,splice(2,0,4,6)会从当前数组的位置 2 开始插入4和6。
替换:可以向指定位置插入任意数量的项,且同时删除任意数量的项,只需指定 3 个参数:起始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等。例如,splice (2,1,4,6)会删除当前数组位置 2 的项,然后再从位置 2 开始插入4和6。
splice()方法始终都会返回一个数组,该数组中包含从原始数组中删除的项,如果没有删除任何项,则返回一个空数组。
var arr = [1,3,5,7,9,11]; var arrRemoved = arr.splice(0,2); console.log(arr); //[5, 7, 9, 11] console.log(arrRemoved); //[1, 3] var arrRemoved2 = arr.splice(2,0,4,6); console.log(arr); // [5, 7, 4, 6, 9, 11] console.log(arrRemoved2); // [] var arrRemoved3 = arr.splice(1,1,2,4); console.log(arr); // [5, 2, 4, 4, 6, 9, 11] console.log(arrRemoved3); //[7]
slice() 返回从原数组中指定开始下标到结束下标之间的项组成的新数组。
slice()方法可以接受一或两个参数,即要返回项的起始和结束位置。在只有一个参数的情况下, slice()方法返回从该参数指定位置开始到当前数组末尾的所有项。
如果有两个参数,该方法返回起始和结束位置之间的项——但不包括结束位置的项。
var arr = [1,3,5,7,9,11]; var arrCopy = arr.slice(1); var arrCopy2 = arr.slice(1,4); var arrCopy3 = arr.slice(1,-2); var arrCopy4 = arr.slice(-4,-1); console.log(arr); //[1, 3, 5, 7, 9, 11](原数组不变) console.log(arrCopy); //[3, 5, 7, 9, 11] console.log(arrCopy2); //[3, 5, 7] console.log(arrCopy3); //[3, 5, 7] console.log(arrCopy4); //[5, 7, 9]
.indexOf() & lastIndexOf()
indexOf():接收两个参数:要查找的项和(可选的)表示查找起点位置的索引。其中, 从数组的开头(位置 0)开始向后查找。
lastIndexOf:接收两个参数:要查找的项和(可选的)表示查找起点位置的索引。其中, 从数组的末尾开始向前查找。
这两个方法都返回要查找的项在数组中的位置,或者在没找到的情况下返回1。在比较第一个参数与数组中的每一项时,会使用全等操作符。
注意:indexOf()不能识别NaN
var arr = [1,3,5,7,7,5,3,1]; console.log(arr.indexOf(5)); //2 console.log(arr.lastIndexOf(5)); //5 console.log(arr.indexOf(5,2)); //2 console.log(arr.lastIndexOf(5,4)); //2 console.log(arr.indexOf("5")); //-1
push() & pop()
push(): 可以接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度。
pop():数组末尾移除最后一项,减少数组的 length 值,然后返回移除的项。
var arr = ["Lily","lucy","Tom"]; var count = arr.push("Jack","Sean"); console.log(count); // 5 console.log(arr); // ["Lily", "lucy", "Tom", "Jack", "Sean"] var item = arr.pop(); console.log(item); // Sean console.log(arr); // ["Lily", "lucy", "Tom", "Jack"]
shift() & unshift()
shift():删除原数组第一项,并返回删除元素的值;如果数组为空则返回undefined 。
unshift:将参数添加到原数组开头,并返回数组的长度 。
var arr = ["Lily","lucy","Tom"]; var count = arr.unshift("Jack","Sean"); console.log(count); // 5 console.log(arr); //["Jack", "Sean", "Lily", "lucy", "Tom"] var item = arr.shift(); console.log(item); // Jack console.log(arr); // ["Sean", "Lily", "lucy", "Tom"]
reverse() 将数组中的元素进行反转,倒序显示
定义: reverse() 方法用于颠倒数组中元素的顺序。
var arr = [13, 24, 51, 3]; console.log(arr.reverse()); //[3, 51, 24, 13] console.log(arr); //[3, 51, 24, 13](原数组改变)
sort() 将数组元素进行排序
定义: sort()方法对数组元素进行排序,并返回这个数组。
按升序排列数组项——即最小的值位于最前面,最大的值排在最后面。
默认情况下sort()方法没有传比较函数的话,默认按字母升序,如果不是元素不是字符串的话,会调用toString()方法将元素转化为字符串的Unicode(万国码)位点,然后再比较字符。(其实就是默认按照asc码升序排列)
// 字符串排列 看起来很正常 var a = ["Banana", "Orange", "Apple", "Mango"]; a.sort(); // ["Apple","Banana","Mango","Orange"] // 数字排序的时候 因为转换成Unicode字符串之后,有些数字会比较大会排在后面 这显然不是我们想要的 var a = [10, 1, 3, 20,25,8]; console.log(a.sort()) // [1,10,20,25,3,8];
sort排序常见用法:
var array = [10, 1, 3, 4,20,4,25,8]; // 升序 a-b < 0 a将排到b的前面,按照a的大小来排序的 array.sort(function(a,b){ return a-b; }); console.log(array); // [1,3,4,4,8,10,20,25]; array.sort(function(a,b){ return b-a; }); console.log(array); // [25,20,10,8,4,4,3,1];
数组多条件排序
var array = [{id:10,age:2},{id:5,age:4},{id:6,age:10},{id:9,age:6},{id:2,age:8},{id:10,age:9}]; array.sort(function(a,b){ if(a.id === b.id){// 如果id的值相等,按照age的值降序 return b.age - a.age }else{ // 如果id的值不相等,按照id的值升序 return a.id - b.id } }) // [{"id":2,"age":8},{"id":5,"age":4},{"id":6,"age":10},{"id":9,"age":6},{"id":10,"age":9},{"id":10,"age":2}]
ES6扩展运算符…合并数组
定义: 方法用于合并两个或多个数组,返回一个新数组。
代替concat()
var a = [2, 3, 4, 5] var b = [ 4,...a, 4, 4] console.log(a,b); // [2, 3, 4, 5] [4,2,3,4,5,4,4]
forEach() 循环遍历里面的每一个元素
forEach():对数组进行遍历循环,对数组中的每一项运行给定函数。
这个方法没有返回值。参数都是function类型,默认有传参,参数分别为:遍历的数组内容;对应的数组索引,数组本身。
forEach()注意点:
无法中途退出循环,只能用return退出本次回调,进行下一次回调。
它总是返回 undefined值,即使你return了一个值。
var arr = [1, 2, 3, 4, 5]; arr.forEach(function(item, index, array){ console.log(item + '-' + index + '-' + (array === arr)); }); // 输出为: //1-0-true //2-1-true //3-2-true //4-3-true //5-4-true
filter() 过滤原始数组,返回新数组
定义: 返回一个新数组, 其包含通过所提供函数实现的测试的所有元素。
返回true的留下,false的舍弃
回调函数的参数
var a = [32, 33, 16, 40]; var result = a.filter(function (value, index, array) { return value >= 18; // 返回a数组中所有大于18的元素 }); console.log(result,a);// [32,33,40] [32,33,16,40]
find() & findIndex() 根据条件找到数组成员
find()定义:用于找出第一个符合条件的数组成员,并返回该成员,如果没有符合条件的成员,则返回undefined。
findIndex()定义:返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1。
语法:
var new_array = arr.find(function(currentValue, index, arr), thisValue) var new_array = arr.findIndex(function(currentValue, index, arr), thisValue)
回调函数的参数
// find var a = [1, 4, -5, 10].find((n) => n < 0); // 返回元素-5 var b = [1, 4, -5, 10,NaN].find((n) => Object.is(NaN, n)); // 返回元素NaN // findIndex var a = [1, 4, -5, 10].findIndex((n) => n < 0); // 返回索引2 var b = [1, 4, -5, 10,NaN].findIndex((n) => Object.is(NaN, n)); // 返回索引4
reduce() 数组归并方法
语法
arr.reduce(function(prev,cur,index,arr){ ... }, init);
示例
//求数组项之和
var arr = [3,9,4,3,6,0,9];
var sum = arr.reduce(function (prev, cur) {
return prev + cur;
},0);
//求数组项最大值
var max = arr.reduce(function (prev, cur) {
return Math.max(prev,cur);
});
//数组去重
var newArr = arr.reduce(function (prev, cur) {
prev.indexOf(cur) === -1 && prev.push(cur);
return prev;
},[]);
① 初始化一个空数组
② 将需要去重处理的数组中的第1项在初始化数组中查找,如果找不到(空数组中肯定找到),就将该项添加到初始化数组中
③ 将需要去重处理的数组中的第2项在初始化数组中查找,如果找不到,就将该项继续添加到初始化数组中
⑤ 将需要去重处理的数组中的第n项在初始化数组中查找,如果找不到,就将该项继续添加到初始化数组中
⑥ 将这个初始化数组返回
toString() & String()将任何类型的数据都转换为字符串
toString()
var num=24;
var mystr=num.toString(); //"24"
String()
var num=24;
var mystr=String(num); //"24"
slice(start,end) 可提取字符串的某个部分,并以新的字符串返回被提取的部分。
str.slice(start,end),截取str从start到end的所有字符(包含起始位置,不包含结束位置,)start和end都可以是负数,如果是负数,就从字符串的尾部开始算起,例如-1就是最后一个字符,-2就是倒数第二个字符,以此类推。如果未指定end参数,则截取从 start 到原字符串结尾的字符串。返回的是字符串。
var str = 'abc&ABC&123';
console.log(str.slice(3));//&ABC&123
console.log(str.slice(3,7));//&ABC
console.log(str.slice(-2));//23
console.log(str.slice(-3,-1));//12
substring(start,end)
用于提取字符串中介于两个指定小标之间的字符,两个参数都必须是非负整数.str.substring(start,end) 截取str从start到end的所有字符(包含起始位置,但不包含结束位置),两个参数都必须是非负整数,如果参数start与end相等,那么该方法返回的就是一个空字符串,如果start比end大,那么该方法在提取字符串之前会先交换这两个参数,如果未指定end参数,则截取从start到原字符串结尾的字符串。
var str = 'abc&ABC&123';
console.log(str.substring(3));//&ABC&123
console.log(str.substring(3,7));//&ABC
substr(start,length)
可在字符串中抽取从start下标开始的指定数目的字符串。(ECMAscript 没有对该方法进行标准化,因此反对使用它。)str.substr(start,length)截取str从start开始的length个字符(包含起始位置)。start参数可以是任意整数,如果是负数,则从str的尾部开始算起,例如-1就是str的最后一个字符。length是可选的,如果没有,则表示截取从str开始的位置到字符串的尾部。
var str = 'abc&ABC&123';
console.log(str.substr(3));//&ABC&123
console.log(str.substr(3,7));//&ABC&12
console.log(str.substr(-2));//23
console.log(str.substr(-5,4));//C&12
replace(regexp/substr,replacement) 替换与正则表达式匹配的子串。
regexp/substr 必需。规定子字符串或要替换的模式的 RegExp 对象。replacement 必需。一个字符串值。规定了替换文本或生成替换文本的函数。返回 一个新的字符串,是用 replacement 替换了 regexp 的第一次匹配或所有匹配之后得到的。
var str = 'abc&ABC&123';
console.log(str.replace(1,','));//abc&ABC&,23 --srting
console.log(str.replace(/&/g,''));//abcABC123
split(separator,howmany) 返回的是字符串数组。字符串或正则表达式。
separator必需。字符串或正则表达式。howmany可选。该参数可指定返回的数组的最大长度 。返回值,一个字符串数组。
var str = 'abc&ABC&123';
console.log(str.split(1,1));//["abc&ABC&"]
console.log(str.split(/&/g));//["abc", "ABC", "123"]
console.log(str.split(''));// ["a", "b", "c", "&", "A", "B", "C", "&", "1", "2", "3"]
indexOf(searchvalue,fromindex) 返回某个指定的字符串值在字符串中首次出现的位置
如果要检索的字符串值没有出现,则该方法返回 -1。indexOf() 方法对大小写敏感!searchvalue 必需。规定需检索的字符串值。 fromindex(0~str.len-1) 可选整数。规定在字符串中开始检索的位置。
var str = 'abc&ABC&123';
console.log(str.indexOf(1));//8
console.log(str.indexOf(3,6));//10
console.log(str.indexOf(5,6));//-1
match() 字符串内检索指定的值
match() 方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。类似 indexOf() 和 lastIndexOf(),但是它返回指定的值,而不是字符串的位置。.match(searchvalue) 必需。规定要检索的字符串值。 .match(regexp) 必需。规定要匹配的模式的 RegExp 对象 ---- 多用这种操作 返回需要的字符串数组
var a = 'abc&CDE&啊啊啊';
var f = a.match(/[A-z]/g);
console.log(f);
["a", "b", "c", "C", "D", "E"]
search() 用于检索字符串中指定的子字符串
用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串 search(regexp) 该参数可以是需要在 stringObject 中检索的子串,也可以是需要检索的 RegExp对象。 如果没有找到任何匹配的子串,则返回 -1
var a = 'abc&CDE&啊啊啊';
a.search('啊');//8
a.search(/[A-z]/g);//0