数组方法

    

js操作数组方法,目前总结了:22 + 11种。


 

 ES5中的已有的方法👇  22个

 

🌲  Array.isArray(arr) :

  • ES5提供的判断一个值是否为数组的方法,该方法没有instanceof由于环境不同导致准确的问题。可能有兼容性问题
  • Object.prototype.toString.call(value) == "[object Array]"。使用该方法没有兼容性,也是常用的方法

  

🌲 filter((item, index, array) => {}): 返回一个新数组, 其包含通过所提供函数实现的测试的所有元素,不改变原数组。

  • 对数组进行过滤,对数组每一项运行给定的函数,返回该函数返回true的项组成的数组
  • 返回是一个新数组,不会影响到原数组
  • 同样,对于对象元素,是浅拷贝

🌲 forEach( (item, index, array) => {}): 对数组的每个元素执行一次给定的函数。 

  • 遍历函数,不会修改原数组,该方法没有返回值
  • 无法使用break终止循环,意味着forEach是无法终止循环的
  • for循环可使用continue跳过本次循环,forEach中可以return false 来跳过本次循环

🌲  map( (item, index, array) => {}), 返回一个新数组,其结果是该数组中的每个元素是调用一次提供的函数后的返回值。原数组不受影响。

  • 对数组每一项运行给定的函数,返回每次调用函数的结果组成的数组
  • 不会改变原数组,返回值是一个新数组
  • 如果数组元素是对象,那么是浅拷贝过去,修改对象属性会影响到原数组对象的属性


📒 map和forEach比较:https://juejin.im/post/5e09cf5ff265da33d21e8ef8

相同点:都是用来遍历数组的。

区别:forEach没有返回值,返回的是undefined, map会返回一个新数组。

 

🌲 indexOf(): 数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1;

 

 🌲  toString():  返回一个字符串,用逗号隔开,表示指定的数组及其元素

🌲 toLocaleString() : 返回一个特定语言环境的字符串.

    https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/toLocaleString

常见应用:

 

🌲 shift()  : 删除原数组第一项,并返回删除元素的值;如果数组为空则返回undefined (前删,返回值,改变原数组)   

 

🌲 pop() :删除原数组最后一项,并返回删除元素的值;如果数组为空则返回undefined (后删,返回值,改变原数组)

🌲 unshift() :将参数添加到原数组开头,并返回数组的长度 (前增,返回长度,改变原数组)

  

🌲 push() :将参数添加到原数组末尾,并返回数组的长度 (后增,返回长度,改变原数组)

 

🌲 concat(元素1,元素2) :返回一拼接新数组,是将参数添加到原数组中构成的 

 

🌲 splice(start,deleteCount,val1,val2,...) : 从start位置开始删除deleteCount项,并从该位置起插入val1,val2,...,(返回裁剪后的新数组,改变原数组)

🌲 slice(start,end): 返回从原数组中指定开始下标到结束下标之间的项 组成的切割新数组 

🌲 join(separator, mapFn可选): 将数组的元素组起一个分隔符拼接字符串,以separator为分隔符,省略的话则用默认用逗号为分隔符 

 

🌲 reverse :将数组反序 ,返回反序后的数组(反序,改变原数组)

🌲 sort(order function) :按指定的参数对数组进行排序

 function是可选的,返回值若 小于0,第一个参数就会排列在前。等于0,相对位置不变;大于0,b在a前。

 若不传function,默认排序顺序是按照转换为的字符串的诸个字符的 Unicode位点 进行排序。

 

🌲 reduce(function(accumulator, currentValue)): 累计器,迭代器。对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值,  即, 由reduce返回的值将是最后一次回调返回值

 

 例子:求1-100的和。

🌲 reduceRight: 接收一个函数作为累加器,和数组的每个值(从右到左) 

🌲 some(function(ele,index可选,array可选)): 判断测试数组中,是不是至少有1个元素通过了被提供的函数测试, 返回布尔值Boolean.

常见应用:判断数组元素中是否存在某个值, 该方法模仿了 includes()  方法

🌲 every(function(ele)) : 和some一起记忆。 判断测试数组中,是不是每个元素通过了被提供的函数测试, 返回布尔值Boolean.

 

  


 

ES6数组方法: 👇 11个

 


🌲 includes(ele[, fromIndex可选]): 判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回false。

 

🌲 Array.from(arryLike): 把一个类数组或者可迭代对象( Map和 Set )创建为一个新的浅拷贝的数组实例.   兼容性:不支持IE,支持edge. 

 

 常见应用: 从String生成数组;从Set生成数组;从Map生成数组;类数组对象arguments生成数组;

                 数组去重合并;使用箭头函数;

 

 

⚠️  补充:call 和 aplly 的用法和差异 

⚠️  补充:Set对象

 

🌲  find : 返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined

🌲  findIndex:方法返回数组中满足提供的测试函数的第一个元素的索引。否则返回-1。

  

🌲 fill(ele,startIndex,endIndex(可选)):用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引的那一个,会改变原数组。

 

 🌲 flat() : 扁平化数组,按照一个可指定的深度depth(默认是1)递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。不改变原数组。

语法: var newArray = arr.flat([depth])

  

🌲  flatMap(function):首先使用映射函数映射每个元素,然后将结果压缩成一个新数组。 flatMap 通常在合并成一种方法的效率稍微高一些

  • 同flat一样,先执行map函数再进行拉平
  • 只能拉平一层

⚠️  map 和 flatMap的比较

 

 

 

 

🌲 entries() : 返回一个新的Array Iterator对象,该对象包含数组中每个索引的键/值对。 

🌲 keys() :  返回一个包含数组中每个索引键的Array Iterator对象。

🌲 values() :方法返回一个新的 Array Iterator 对象,该对象包含数组每个索引的值

 🌲 copyWithin(target, start = 0, end = this.length): 浅部分数组的一部分到同一数组中的另一个位置,并返回它,不会改变原数组的长度。

  • 在当前数组内部,将指定位置的成员复制到其他位置(会覆盖原有成员),然后返回当前数组
  • 该方法会修改当前数组
  • 结束参数不包括end位置
  • 数组长度不变,数组start到end-1的元素会从target(包括该位置)开始依次覆盖数组原有成员
  • 参数可以是负数,表示倒着数

 

    

 

 

 

 

 

 

posted @ 2018-06-25 10:52  CatherLee  阅读(851)  评论(0编辑  收藏  举报