17、数组中的常用方法思维导图模板_ProcessOn思维导图、流程图

1、增删改

push

1、作用  和  含义

向数组的末尾追加元素

2、参数 @params

追加的项（多个任意类型）

3、返回值 @return

新增数组的长度

4、是否改变原数组

改变

5、使   用   方   法

ary.push(增加的项)

pop

1、作用  和  含义

删除数组的最后一项

2、参数 @params

无

3、返回值 @return

删除的那一项

4、是否改变原数组

改变

5、使   用   方   法

ary.pop()

unshift

1、作用  和  含义

向数组的开头增加元素

2、参数 @params

追加的项（多个任意类型）

3、返回值 @return

新增数组的长度

4、是否改变原数组

改变

5、使   用   方   法

ary.unshift(增加的项)

shift

1、作用  和  含义

删除数组的开头项

2、参数 @params

无

3、返回值 @return

删除的那一项

4、是否改变原数组

改变

5、使   用   方   法

ary.shift()

splice

1、作用  和  含义

实现数组指定位置的增加、修改、删除

2、参数 @params

n,m,x  //都是数字

从索引n开始，删除m个元素（m不写，就是删除到末尾），用x占用删除的部分

3、返回值 @return

把删除的部分用新数组储存起来返回

4、是否改变原数组

改变

5、使   用   方   法

ary.splice(n,m,x)

删除

ary.splice(0)

可以清空数组，把原始数组中的内容基于新数组储存起来（有点类似于数组克隆）

ary.splice(ary.length-1)

删除最后一项

ary.splice(0,1)

删除第一项

增加

从n开始，一个都不删，把x放在索引n 的前面

返回的是空数组

ary.splice(ary.length,0,x)

在数组最后增加x项

ary.splice(0,0,x)

在数组开头增加x项

修改

用x替代删除的m即可

删除数组末尾一项的几种方法

arr.length--

arr.pop()

返回结果删除的项

arr.splice(arr.length-1)

返回结果是 [删除的项]

delete arr[arr.length-1]

虽然能删除，但是length长度不变（一般不用）

向数组末尾追加项的几种方法

arr.push("增加的项")

arr[arr.length]="增加的项"

arr.splice(arr.length , 0 , "增加的项")

2、查询和拼接

slice

1、作用和含义

实现数组的查询

2、参数@params

n,m  //都是数字

从索引n开始，找到索引为m的地方（不包含m这一项）

3、返回值@return

把找到的内容以新数组的形式返回

4、是否改变原数组

不改变

5、使用方法

ary.slice(n,m)

ary.slice(0)

m不写是找到末尾

实现数组的克隆，参数0不写也可以

6、思考

思考：1.如果n/m为负数会怎样，如果n>m会怎样，如果是小数会怎样，如果是非有效数字会怎样，如果m或者n的值比最大索引大会怎样2、这种克隆方式叫做浅克隆，可以先看看深度克隆如何处理？

concat

1、作用  和  含义

实现数组拼接（合并）

2、参数 @params

拼接的项（多个任意值）

3、返回值 @return

拼接后的新数组

4、是否改变原数组

不改变

5、使   用   方   法

ary.concat(拼接的内容)

ary.concat()

相当于数组克隆（真实项目一般不用）

ary.concat(‘1’)

传一个值也相当于给数组末尾追加项（真实项目一般不用）

3、把数组转换成字符串

toString

1、作用  和  含义

把数组转换为字符串

2、参数 @params

无

3、返回值 @return

转换后的字符串，每一项用逗号分隔

4、是否改变原数组

不改变

5、使   用   方   法

ary.toString()

join

1、作用  和  含义

把数组转换为字符串

2、参数 @params

指定的分隔符（字符串格式）

3、返回值 @return

转换后的字符串

4、是否改变原数组

不改变

5、使   用   方   法

ary.join(‘指定分割符’)

ary.join(' ')

'123'

ary.join()

未指定分割符用逗号隔开

‘1，2，3’

ary.join('+')

'1+2+3'

console.log(eval(res));//==>6

重点知识

eval

把字符串变为数学运算

相当于把字符串变为JS表达式（加减乘除）执行

4、检测数组中是否包含某一项

indexOf/lastIndexOf

1、作用  和  含义

检测当前项在数组中第一次/最后一次出现位置的索引值

2、参数 @params

要检索的这一项内容

3、返回值 @return

这一项出现的位置索引值（数字），如果数组中没有这一项，返回的结果是-1

4、是否改变原数组

不改变

5、使   用   方   法

ary.indexOf(检索的项)

想验证ARY中是否包含“培训”

if（ary.indexOf("培训")===-1）{//不包含}

也可以直接使用ES6新提供的includes方法判断(不兼容)

if（ary.includes("培训")）{//包含:如果存在返回的是TRUE}

6、注意

在IE6-8中不兼容

includes

1、作用  和  含义

检测当前数组是否包含某项

2、参数 @params

要检索的这一项内容

3、返回值 @return

布尔，true 包含，false 代表不包含

4、是否改变原数组

不改变

5、使   用   方   法

ary.includes(检索的项)

if（ary.includes("培训")）{//包含:如果存在返回的是TRUE}

6、注意

ES6语法，在IE6-8中不兼容

5、排序或者排列

reverse

1、作用  和  含义

把数组倒过来排列

2、参数 @params

无

3、返回值 @return

排列后的原始数组

4、是否改变原数组

改变

5、使   用   方   法

ary.reverse()

sort

1、作用  和  含义

实现数组的排序

2、参数 @params

可以没有，也可以是一个函数

3、返回值 @return

排序后的新数组

4、是否改变原数组

改变

5、使   用   方   法

ary.sort()

SORT方法中如果不传递参数，是无法处理10以上数字排序的（它默认按照每一项第一个字符来排，不是我们想要的效果）

ary.sort(function(a,b){return a-b;});

想要实现多位数正常排序，需要给SORT传递一个函数，函数中返回a-b实现升序，返回b-a实现降序

可用箭头函数表示：ary.sort((a,b) => a-b);

6、遍历及映射

forEach

1、作用  和  含义

遍历数组中的每一项内容

数组中有多少项就遍历多少次，每一次执行函数都可以在函数中获取到当前遍历的“这一项”和对应的“索引”

2、参数 @params

回调函数

3、返回值 @return

无/undefined

4、是否改变原数组

不改变

5、使   用   方   法

ary.forEach(function(item,index){ alert(item);})

ary.forEach((item,index)=>{console.log('索引：'+index+'内容：'+item)；})

基于原生JS中的循环实现

for（let i = 0；i<ary.length;i++){console.log('索引：'+i+'内容：'+ary[i])}

map

1、作用  和  含义

数组映射

forEach 是不支持返回值的，而 map 是支持返回值的，但是不会改变原数组，执行完的返回结果是修改后的新数组

2、参数 @params

回调函数

3、返回值 @return

映射后的新数组

4、是否改变原数组

不改变

5、使   用   方   法

ary.map(function(item,index){ return "真棒";})

7、其他方法

filter

find

reduce

some

every

......