200字范文,内容丰富有趣,生活中的好帮手!
200字范文 > JS数组常用方法整理(14种常用方法)

JS数组常用方法整理(14种常用方法)

时间:2022-07-15 09:15:31

相关推荐

JS数组常用方法整理(14种常用方法)

目录

1.增

1.1 push():

1.2 unshift():

2.删

2.1 pop():

2.2 shift()

3.改(增、删):

3.1 splice()

4.查

4.1 slice()

5.将数组转换为字符串:

5.1 toString()

5.2 join()

6.数组拼接

6.1concat()

7.检测数组中是否包含某一项

7.1 indexOf()

7.2 lastIndexOf()

7.3 includes()

8.数组排序

8.1 reverse()

8.2 sort()

1.增

1.1 push():

push方法会改变原数组

/*数组.push():向数组的末尾添加元素@params:多个任意类型值@return:新增后的数组长度*/let arr = [0,1,2,3],newArr = arr.push(4);console.log('newArr:', newArr, "|", "arr:", arr)//=> 5,[0,1,2,3,4,5]

结果为:

1.2 unshift():

unshift方法会改变原数组

/*数组.unshift():向数组开头添加元素@params:多个任意类型值@return:新增后的数组长度*/let arr = [1,2,3],newArr = arr.unshift(0);console.log('newArr:', newArr, "|", "arr:", arr)

结果为:

2.删

2.1 pop():

pop方法会改变原数组

/*数组.pop():删除数组中最后的那项@params:@return:被删除的那项*/let arr = [0,1,2,3,4,5],newArr = arr.pop();console.log('newArr:', newArr, "|", "arr:", arr)

结果为:

2.2 shift()

shift方法会改变原数组

/*数组.shift():删除数组中开头的那项元素@params:@return:被删除的那项*/let arr = [0,1,2,3,4],newArr = arr.shift()console.log('newArr:', newArr, "|", "arr:", arr)

结果为:

3.改(增、删):

3.1 splice()

splice方法会改变原数组,并且能进行增删改操作

/*数组.splice(n,m,x):对数组进行增/删/改操作@params:n:从索引n开始(必填)m:向后截取m个元素,没有填写则默认截取到数组末尾(非必填)。x:代替截取掉的部分(非必填)@return:将截取到的部分以新数组的方式返回*///增:let arr = [0,1,2,3,4,5,6],newArr = arr.splice(arr.length-1,0,7); //从数组末尾开始向后截取0个元素,并在此插入新元素7console.log(newArr,arr)// => [],[0,1,2,3,4,5,6,7]//删:let arr2 = [0,1,2,3,4,5,6],newArr2 = arr2.splice(0,1);//从索引0开始向后截取1个元素console.log(newArr2,arr2)// => [0],[1,2,3,4,5,6]//改:let arr3 = [0,1,2,3,4,5,6],newArr3 = arr3.splice(0,1,0.5)//从索引0开始向后截取1个元素,并在此插入元素0.5console.log(newArr3,arr3)// => [0],[0.5,1,2,3,4,5,6]

4.查

4.1 slice()

slice方法不会改变原数组,以下列出的n和m的情况也适用于splice

/*数组.slice(n,m):查询数组@params:n:从索引n开始(必填)m:查询到索引m为止,不包含m,如果m不填或大于arr.length,默认查询到末尾(非必填)@return:将查找到的元素以新数组的方式返回,如果没有查找到,返回空数组*///1.当n和m都为正整数:let arr = [0,1,2,3,4,5],newArr = arr.slice(0,arr.length);//从索引0开始查询到数组末尾的后一项(复制数组)console.log(newArr,arr)// => [0,1,2,3,4,5],[0,1,2,3,4,5]//2.当n和m为小数时,会先通过parseInt转换为整数在进行查询操作let arr2 = [0,1,2,3,4,5],newArr2 = arr2.slice(1.9,2.1);//从索引1开始查询到索引为2的元素console.log(newArr2,arr2)// => [1],[0,1,2,3,4,5]//3.当n是负数时,m不能大于n 否则返回空数组;表示从数组的末尾开始查找,数组最后一项索引为-1,越往前越小(原正数索引-arr.length=当前的负数索引)let arr3 = [0,1,2,3,4,5],newArr3 = arr3.slice(-3,-1);//从索引-2开始向前查找到索引为-1的元素console.log(newArr3,arr3);// => [3,4],[0,1,2,3,4,5],//4.当n或m不是有效数字时,先通过parseInt转换为有效数字,转换为NaN则默认为0let arr4 = [0,1,2,3,4,5],newArr4 = arr4.slice('1.9','哈哈哈');//从索引1开始向后查询到索引为0的元素,返回空数组console.log(newArr4,arr4)// => [],[0,1,2,3,4,5]let arr5 = [0,1,2,3,4,5],newArr5 = arr4.slice('1.9','3.1');//从索引1开始向后查询到索引为3的元素,返回空数组console.log(newArr4,arr4)// => [1,2],,[0,1,2,3,4,5]

5.将数组转换为字符串:

5.1 toString()

toString方法不会改变原数组

/*数组.toString:将数组转换为字符串@params:@return:转换后的字符串*/let arr = [1,'2',undefined,{name:"Zack"}],newArr = arr.toString();console.log(newArr,arr)

结果为:

5.2 join()

join方法不会改变原数组

/*数组.join([string]):将数组以指定分隔符的形式分隔成字符串@params:指定的分隔符(字符串格式)@return:转换后的字符串*/let arr = [0,1,2,3,4,5],newArr = arr.join('|');console.log(newArr,arr)

结果为:

6.数组拼接

6.1concat()

concat方法不会改变原数组

/*数组.concat(): 在指定数组后面将多个元素拼接成一个新数组@params:多个任意类型值@return:返回拼接后的新数组*/let arr = [1,2,3,4],arr2 = [5,6,7],newArr = arr.concat(arr2,'morning',{name:"Zack"})console.log(newArr,arr,arr2)

结果为:

7.检测数组中是否包含某一项

7.1 indexOf()

indexOf不会改变原数组

/*数组.indexOf(n,m):检测要检索这一项的值在数组中第一次出现的位置@params:n:要检索的值m:从索引m开始,不填则默认从0开始(非必填)@return:要检索的这一项第一次出现的索引,未找到则返回-1*/let arr = [0,1,2,3,4,5,'morning',7,'morning'];console.log(arr.indexOf('morning'))//=>6console.log(arr.indexOf('morning',7))//=>8

结果为:

7.2 lastIndexOf()

lastIndexOf方法不会改变原数组

/*数组.lastIndexOf():查找需要检索的元素在数组中最后一次出现的索引@params:@return: 需要检索的元素最后一次出现的索引,没有则返回-1*/let arr = [0,1,2,3,4,5,'morning',7,'morning'];console.log(arr.lastIndexOf('morning'))//=>8

结果为:

7.3 includes()

includes方法不会改变原数组

/*数组.includes(n,m):验证数组是否包含某项元素@parmas:n:需要查询的元素m:从索引m开始向后检索,默认为0,如果为负数,且它大于数组长度则会重置为从 0 开始。@return:若指定数组包含返回true否则返回flase*/let PersonA = {name: "Zack",age: 21}let arr = [0, '1', PersonA, 'morning'];console.log(arr.includes(PersonA));//=> truelet arr2 = [0, '1', PersonA, 'morning'];console.log(arr2 .includes(PersonA,-5));//=> true

结果都为:

8.数组排序

8.1 reverse()

reverse方法会改变原数组

/*数组.reverse():将数组的元素倒过来排序@params:@return:重新排序后的新数组*/let arr = [1,2,5,4,3,6,7],newArr = arr.reverse();console.log(newArr,arr)

结果为:

8.2 sort()

sort方法会改变原数组

/*数组.sort(fn => fn()):将数组按照指定的顺序进行排序@params:函数(可有可无),如果需要实现多位数正常排序,需要传递函数,并使返回值为a-b(升序)或者b-a(降序),属于冒泡排序机制@return:排序后的新数组*/let arr = [12,45,6,21,51,81],//升序:newArr = arr.sort((a,b) => (a-b));console.log(newArr,arr)

结果为:

//降序let arr = [12,45,6,21,51,81],newArr2 = arr.sort((a,b) => (b-a));console.log(newArr2,arr)

结果为:

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。