js 对象遍历和数组遍历的各种方法

作者 : 开心源码 本文共1476个字,预计阅读时间需要4分钟 发布时间: 2022-05-13 共255人阅读
对象遍历

1.for…in:对象自身(包含继承)的所有可枚举属性(不含 Symbol 属性)

const obj = {a:1, b:2, c:3};for (const prop in obj) {  console.log("obj." + prop + " = " + obj[prop]);}
  1. Object.keys:对象自身(不含继承)的所有可枚举属性(不含Symbol属性)
const obj = {a:1, b:2, c:3};Object.keys(obj).map((key) => {  console.log("obj." + key + " = " + obj[key]);})

相应的,获取对象值的方法是:Object.values。

  1. Object.entries:对象自身(不含继承)的所有可枚举属性(不含Symbol属性)的键值对数组
const obj = {a:1, b:2, c:3};//Object.entries(obj)的值:[ ['a', 1], ['b', 2] ],, ['c',3] ]Object.entries(obj).map(([key,value]) => {  console.log("obj." + key + " = " +value);})

键值顺序和for in返回的顺序一致。

  1. Object.getOwnPropertyNames:含对象自身的所有属性(包括不可枚举属性、继承属性,不含Symbol属性)
const obj = {a:1, b:2, c:3};Object.getOwnPropertyNames(obj).forEach(function(key){    console.log(key,obj[key]);});
  1. Reflect.ownKeys:包含对象自身的所有属性,包含继承属性、Symbol属性和不可枚举属性
const obj = {a:1, b:2, c:3};Reflect.ownKeys(obj).forEach(function(key){    console.log(key,obj[key]);});
数组遍历

1.for

const arr = [10, 20, 30];for (const i = 0; i < arr.length; i++) {    console.log(arr[i]);// 10 20 30}
  1. for…of
const arr = [10, 20, 30];for (const value of arr) {  console.log(value);// 10 20 30}

for of可以随时退出循环,还可以遍历string

  1. for…in(不建议,i 是数组下标)
const arr = [10, 20, 30];for (const i in arr) {  console.log(i);// 0 1 2}

4.forEach

const arr = [10, 20, 30];arr.forEach((value) => {    console.log(value);// 10 20 30});
  1. map
const arr = [10, 20, 30];const sumArr=arr.map((value) => {    return value+10;});console.log(sumArr);//[20, 30, 40]
  1. reduce
const arr = [10, 20, 30];const sum = arr.reduce((total, value) => {    return total + value;});console.log(sum); // 60
  1. filter
const arr = [10, 20, 30];const filterArr =arr.filter((value, index, array) => {    return (value % 2) == 0;});
说明
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是摆设,本站源码仅提供给会员学习使用!
7. 如遇到加密压缩包,请使用360解压,如遇到无法解压的请联系管理员
开心源码网 » js 对象遍历和数组遍历的各种方法

发表回复