遇到数组的各种处理

1、从对象数组中找出 id 相同的对象，放到新数组(二维数组)中

• 原链接：http://www.gkh0305.com/archives/findinfobyid

  const list = [
  {
  id: 1,
  name: "张三",
  },
  {
  id: 1,
  name: "李四",
  },
  {
  id: 2,
  name: "王麻子",
  },
  ];
  // 根据吧id相同的对象整合到一个新数组里
  const newList = [];
  list.forEach(item => {
  let flag = undefined;
  newList.some(el => {
  if (el.length > 0) {
  if (el[0].id === item.id) {
  flag = el;
  return true;
  }
  }
  });
  if (typeof flag !== "undefined") {
  flag.push(item);
  } else {
  newList.push([item]);
  }
  flag = undefined;
  });

2、JavaScript 中的递归：对象数组里根据 id 获取 name，对象可能有 children 属性

• 原链接: https://www.cnblogs.com/starlog/p/15356396.html

  getFlatArr(arr) {
  return arr.reduce((a, item) => {
  let flatArr = [...a, item];
  if (item.children) {
  flatArr = [...flatArr, ...this.getFlatArr(item.children)];
  }
  return flatArr;
  }, []);
  }
  getNameByIdFromArr(arr, id) {
  return this.getFlatArr(arr).find(item => item.id === id).name;
  }
  get getName() {
  if (this.val.length === 0 || this.List.length === 0) {
  return "";
  }
  const find = this.val.map(el => {
  return this.getNameByIdFromArr(this.List, el);
  });
  return find ? find.toString() : "";
  }
  val = [1,2,3]
  List = [
  {
  id: 1,
  name: '张三',
  children: [
  {
  id: 2,
  name: '李四'
  }
  ]
  },
  {
  id: 3,
  name: '王五'
  }
  ]

3、字符串和数组的相互转换

• 原文链接：https://blog.csdn.net/weixin_45616633/article/details/119374745

1、数组转字符串

• 1、toString 能够把每个元素转换为字符串，然后以逗号链接输出显示

  const arr = [1,2,3,4]
  const str = arr.toString(); // 1,2,3,4

• 2、join 也可以把数组转成字符串，它可以指定分隔符，不指定符号默认是以逗号链接输出显示

  const arr = [1,2,3,4]
  const str = arr.join(); // 1,2,3,4
  const str = arr.join(','); // 1,2,3,4

2、字符串转数组

• 1、split 可以指定某个特定的符号来分割加入到数组中

  const str = '1,2,3'
  const arr = str.split(',') // ["1","2","3"]

• 2、字符串转换成数字数组

  const str = '1,2,3,4'
  const arr = str.split(',').map(Number) // [1,2,3,4]

• 3、使用解构形成数组

  const str = "1234"
  const arr = [...str] // ["1","2","3","4"]

3、map(Number)和 map(String)

• 1、字符串数组转数字数组

  const array = ["1","2","3"]
  const arr = array.map(Number) // [1,2,3]

• 2、数字数组转字符串数组

  const array = [1,2,3]
  const arr = array.map(String) // ["1","2","3"]

数组里的最后一级 children 去掉

• 原数组
  

• 新数组
  

  created() {
  const list = [
  {
  id: 1,
  name: "张三",
  children: [
  { id: 2, name: "李四", children: [] },
  { id: 3, name: "王五", children: [] },
  ],
  },
  ];
  console.log(this.handleTreeData(list));
  }
  handleTreeData(data) {
  for (let i = 0; i < data.length; i++) {
  if (data[i].children.length < 1) {
  data[i].children = void 0; // 看后端返的是child字段还是children字段，自行改变
  } else {
  this.handleTreeData(data[i].children); // children若不为空数组，则继续 递归调用 本方法
  }
  }
  return data;
  }