js数组方法sort，splice等详解

js数组常见方法

---

---

一、数组常见方法

1.sort( )

说明：数组排序，对数组中的每个元素先调用toString方法进行转化，再进行排序，注意：此时10会排在2的前面【会改变原数组】

进行数字排序时需重写排序方法，否则将按数字字符串进行排序，而不是按照数字大小排序

let arr=[1,10,9,8,28,3,2];
arr.sort()
console.log(arr) //[1, 10, 2, 28, 3, 8, 9]
//重写排序方法（升序）
arr.sort((a,b)=>a-b);
console.log(arr) 
//降序排列
arr.sort((a,b)=>b-a);
console.log(arr) 

2. slice( )

说明：slice意思是切片，顾名思义就是截取原数组中的一段，slice（）接收一个或两个参数 ，第一个参数表示截取开始的位置，第二参数表示截取的结束位置，注意：区间是左闭右开[ ),即不包含结束位置下标，若只有一个参数，则从参数位置截取一直到数组结束。【不改变原数组】

let arr=['one','two','three','foure'];
//从下标1开始截取到下标2的位置（不包含下标3）
let newArr=arr.slice(1,3);
console.log(newArr) //['two','three']

3.splice( )

说明：splice是拼接的意思，它可以实现删除也可以实现插入，还可以同时实现删除和插入，接收的参数为两个及其以上，即最少两个参数。第一个参数表示起始位置；第二个参数表示删除元素个数；第三个及其以后的参数表示插入的元素。注意：会改变原数组,且只返回被删除的元素所组成的数组，只有插入操作则返回空数组。【会改变原数组】

当第二个参数为0时，表示只有插入操作；当第二个参数不为0且只有两个参数时，表示只有删除操作；当第二个参数不为0且有三个及其以上个参数时，表示既有删除也有插入操作。

let arr=["we","her","she","he","you"];
//从下标2的位置开始，删除一个
let remove = arr.splice(2,1);
console.log(arr) //['we', 'her', 'he', 'you']
console.log(remove) //['she']
----------------------------------------------
let arr=["we","her","she","he","you"];
//从下标2的位置开始，删除0个，插入三个元素
let remove = arr.splice(2,0,"it","me","his");
console.log(arr) //['we', 'her', 'it', 'me', 'his', 'she', 'he', 'you']
console.log(remove) //[]
----------------------------------------------
let arr=["we","her","she","he","you"];
//从下标2的位置开始，删除1个，插入3个元素；(先删除后插入)
let remove = arr.splice(2,1,"it","me","his");
console.log(arr) //['we', 'her', 'it', 'me', 'his', 'he', 'you']
console.log(remove) //['she']

4.split( ) 和join( )

说明：split( )是用特定的字符去分割字符串（返回数组），而join( )是用特定的字符去拼接出字符串（返回字符串）

let str = "123-abc 566"
let arr = ["123","456","789"];
//用空格去分割字符串
let res1= str.split(" ");
//用 - 去拼接字符串
let res2= arr.join('-') 
console.log(res1)//['123-abc', '566']
console.log(res2) //123-456-789

5.indexOf( )和lastIndexOf( )

说明：查找数组元素的位置，返回索引位置，未找到返回-1。从头到尾开始找，indexof找到第一个即返回其索引位置；lastIndexOf顾明思义，找到最后一个才返回其索引位置，也可以理解为从尾到头开始找，找到第一个即返回其索引位置。

let arr=["red","blue","green","orange","green"];
//元素green第一次出现的索引位置
let index=arr.indexOf("green") 
console.log(index) //2
---------------------------------------------------
let arr=["red","blue","green","orange","green"];
//元素green最后一次出现的索引位置
let index=arr.lastIndexOf("green") 
console.log(index) //4
---------------------------------------------------
let arr=["red","blue","green","orange","green"];
let index=arr.indexOf("black") 
console.log(index) //-1

三、 toString( ) ， toLocaleString( )和valueOf( ) 的区别

说明：对于数组，toString返回数组元素组成的字符串，toLocalString( )也是返回数组元素组成的字符串但会根据本地环境的不同将会有所差异，valueOf( )返回数组本身。

let arr=[1,2,3,4];
let newArr1 = arr.toString()
let newArr2 = arr.toLocaleString()
let newArr3 = arr.valueOf()
console.log(newArr1) //1,2,3,4
console.log(newArr2) //1,2,3,4
console.log(newArr3) //[1, 2, 3, 4]
------------------------------------------------
let num=Number(12345678);
console.log(num.toString()) //12345678
//把数字转换为字符串，使用本地数字格式顺序。
console.log(num.toLocaleString()) //12,345,678
-------------------------------------------------
let nowDate = new Date();
console.log(nowDate.toString()) //Tue May 10 2022 14:19:36 GMT+0800 (中国标准时间)
console.log(nowDate.toLocaleString()) //2022/5/10 14:19:36
console.log(nowDate.valueOf()) //1652163576691

总结
toString()：返回字符串。
toString() ：返回字符串，但会按照本地环境规则。
valueOf() ：返回原始值。

四、every( ) ，some( ) 和filter( )的区别

说明： every( ) 和 some( ) 都是返回布尔值，every是根据传入函数得出每一项都为true才返回true【类似于且运算】，而some( )则是根据传入函数得出任意一项为true则返回true【类似于或运算】

let numArr = [1,2,3,4,5,6];
//数组每一项是否都大于3
let res1 = numArr.every((item)=>{
	return item > 3 ;
})
//数组中是否有大于3的项
let res2 = numArr.some((item)=>{
	return item > 3 ;
})
console.log(res1) //false
console.log(res2) //true

说明：filter( ) 返回数组，filter是过滤筛选的意思，根据传入函数，筛选出是true的项，并返回true的项所组成的新数组。

let numArr = [1,2,3,4,5,6];
//筛选出数组中大于3的项
let res = numArr.filter((item)=>{
	return item > 3 ;
})
console.log(res) //[4, 5, 6]

五、forEach( ) 和 map( )的区别

说明：都是对数组进行遍历操作，forEach( )没有返回值，map( )有返回值

map和forEach都可填一个两个或三个参数，参数一表示每一项，参数二索引下标，参数三原数组

let arr = [1,2,3,4,5,6];
//每一项乘以2
let res = arr.map((item,index,array)=>{
	return item*2;
})
console.log(res) //[2, 4, 6, 8, 10, 12]
---------------------------------------------------
let arr = [1,2,3,4,5,6];
//每一项乘以2
arr.forEach((item,index,array)=>{
	arr[index]=item*2;
})
console.log(arr) //[2, 4, 6, 8, 10, 12]

reduce( )

说明：reduce
语法 reduce（callback,initialValue）,第一个参数是每一项都会执行的函数，第二项是执行函数初始值可选填，

reduce(
	callback（
		preValue:前一个值
		curValue：当前值
		curIndex：当前下标（可选）
		array：调用reduce()方法的数组（可选）
	）,
	initialValue
)

renduce的一些应用

1.数组求和

let arr = [1,2,3,4,5,6,7,8,9];
let sum = arr.reduce((pre,cur,index,array)=>{
	return pre+cur;
})
console.log(sum) //45

---

完结