关于javascript:es6-数组对象-Map-Set-常用操作总结

34次阅读

共计 4077 个字符,预计需要花费 11 分钟才能阅读完成。

总结 js 数组,对象,Map,Set 罕用操作
一:数组罕用操作

 遍历时,break 只能用在 for ...of.. 中无效,用在 forEach, map,find 等中有效
 break 也可用在 swich 中

1. 循环遍历相干:
(1)应用 for 遍历数组,不能扭转原数组,

let arr = [1,2,3,4]
  for(let item of arr){item = item *2}
  console.log("arr=", arr) // [1,2,3,4]

(2).forEach() 办法对数组的每个元素执行一次给定的函数。但不会扭转原数组,即便有 return 也不影响原数组,同样只是循环一遍

  let arr = [1,2,3,4]
  arr.forEach((item, index, srcArray)=>{item = item *2})
  console.log("arr=", JSON.stringify(arr)) // 还是[1,2,3,4]
// 若要扭转,能够这么写:let arr = [1,2,3,4]
  arr.forEach((item, index, srcArray)=>{arr[index] = item *2
  })
// arr = [2,4,6,8]

(3)map() 映射遍历,有 return,返回一个新数组

let arr = [1,2,3,4]
  let newArr =  arr.map((item, index, srcArray)=>{return item*2})
  console.log("arrayMap arr=", JSON.stringify(newArr)) // [2,4,6,8]

(4)arr.keys() 遍历数组索引键

let arr = [1,2,3,4]
  for(let item of arr.keys()){console.log("arrayKeys item=", item) 
  }
  // arrayKeys item= 0
  // arrayKeys item= 1
  // arrayKeys item= 2
  // arrayKeys item= 3

(5)arr.values() 遍历数组索引值

let arr = [1,2,3,4]
  for(let item of arr.values()){console.log("arrayValues item=", item) 
  }
  // arrayValues item= 1
  // arrayValues item= 2
  // arrayValues item= 3
  // arrayValues item= 4

(6)arr.entries() 返回一个新的 Array Iterator 对象,该对象蕴含数组中每个索引的键 / 值对。

let arr = [1,2,3,4]
  for(let item of arr.entries()){console.log("arrayEntries item=", item) 
  }
  // arrayEntries item= [0, 1]
  // arrayEntries item= [1, 2]
  // arrayEntries item= [2, 3]
  // arrayEntries item= [3, 4]

(7) 遍历对象数组,能够间接操作,扭转原数组

let arr = [{"id": 1, "name": "a"}, {"id": 2, "name": "b"}]
  for(let item of arr){item.id += 1}
  console.log("arrayValueOfObject arr=", arr)
 //[{ id: 2, name: 'a'}, {id: 3, name: 'b'} ]

2. 满足条件 相干
(1)arr.filter(callback): 过滤满足条件的元素,有 return, 返回一个新数组

 let arr = [1,2,3,4]
  let newArr =  arr.filter((item, index, srcArray)=>{return item%2 === 0})
  console.log("arrayFilter arr=", JSON.stringify(newArr)) // [2,4]

(2)arr.every() 测试数组的所有项是否满足条件,满足则返回 true,否则 false,有 return,

let arr = [1,2,3,4]
  let ret =  arr.every((item, index, srcArray)=>{return item>0})
  console.log("arrayEvery ret=", ret)  // true

(3)arr.some() 测试数组是否有一项满足条件,有返回 true,否则 false 有 return

let arr = [1,2,3,4]
  let ret =  arr.some((item, index, srcArray)=>{return item===2})
  console.log("arraySome ret=", ret) // true

(4)arr.find() 找到数组中符合条件的第一个元素的值。否则返回 undefined。有 return

let arr = [1,2,3,4]
  let retItem =  arr.find((item, index, srcArray)=>{return item===2})
  console.log("arrayFind retItem=", retItem) // 2

(5)arr.findIndex()找到数组中符合条件的第一个元素的值。否则返回 -1,有 return

let arr = [1,2,3,4]
  let retItemIndex =  arr.findIndex((item, index, srcArray)=>{return item===2})
  console.log("arrayFindIndex retItem=", retItemIndex) // 1
  1. arr.reduce(callback, initialValue) 累加器
    把数组中的所有项累加起来 , 有 return
let arr = [1,2,3,4]
  let initialValue = 10
  let result =  arr.reduce((previousValue, currentValue, index, srcArray)=>{return previousValue + currentValue}, initialValue)

  console.log("arrayReduce result=", result) // 20
参数:callback: previousValue 必选 -- 上一次调用回调返回的值,或者是提供的初始值(initialValue)currentValue 必选 -- 数组中以后被解决的数组项
          index 可选 -- 以后数组项在数组中的索引值
          array 可选 -- 原数组
     initialValue: 可选 -- 初始值
  履行办法:回调函数第一次执行时,preValue 和 curValue 能够是一个值,如果 initialValue 在调用 reduce() 时被提供,那么第一个 preValue 等于 initialValue,并且 curValue 等于数组中的第一个值;如果 initialValue 未被提供,那么 preValue 等于数组中的第一个值

还能够应用 reduce 执行一些高级操作
1. 计算数组中每个元素呈现的次数
2. 数组去重
3. 将多维数组转化为一维
  1. arr.splice(i,n) 删除从 i(索引值)开始之后 n 元素。返回值是删除的元素列表。此办法会扭转原数组。
let arr = [1,2,3,4]
  let deletItems =  arr.splice(2, 1)
  console.log("arraySplice arr=", arr) //[1,2]
  console.log("arraySplice deletItems=", deletItems)// [3,4]
  1. arr.slice() 办法返回一个新的数组对象,这一对象是一个由 begin 和 end 决定的原数组的浅拷贝(包含 begin,不包含 end)。原始数组不会被扭转。
  2. Array.from() 办法从一个相似数组或可迭代对象创立一个新的,浅拷贝的数组实例
  3. arr.fill(target, start, end) 应用给定的值,填充一个数组,ps: 填充完后会扭转原数组
    参数:target — 待填充的元素
    start — 开始填充的地位 - 索引
    end — 终止填充的地位 - 索引(不包含该地位)
    8.arr.includes(val) 数组是否蕴含某值
    arr.join()— —生成以括号内符号分隔开的字符串, 不扭转原数组
    arr.push() 后追加
    arr.pop() 后删除
    arr.unshift() 前查究
    arr.shift() 前删除
    arr.concat() 连贯
    arr.sort() 将数组进行排序, 返回值是排好的数组,默认是依照最右边的数字进行排序,不是依照数字大小排序的
    arr.reverse() 反转
    …..

二:对象 object 即 {}
1. 对象遍历
(1) Object.entries(obj) 返回一个给定对象本身可枚举属性的键值对数组

let obj = {"id": 1, "name": "a", "score": 99, "class": "1-1"}
  for(let [key, val] of Object.entries(obj)){console.log("objFor key=", key) 
    console.log("objFor val=", val) 
  }
 //objFor key= id
 //objFor val= 1
 //objFor key= name
 //objFor val= a
 //objFor key= score
 //objFor val= 99
 //objFor key= class
 //objFor val= 1-1

(2)Object.keys(obj) 返回一个对象键组成的数组,数组中属性名的排列程序和失常循环遍历该对象时返回的程序统一
(3)4.Object.values() 返回一个给定对象本身可枚举属性的值数组

2.Object.is() 办法判断两个值是否为同一个值。
3.Object.assign() 办法用于将所有可枚举属性的值从一个或多个源对象调配到指标对象。它将返回指标对象。

正文完
 0