1. find(callback) find查詢出第一個符合條件的結果就會返回，返回是一個對象

1.基本查詢
    const arrmock=[{name:'1',age:2},{name:'2'},{name:'1',age:'3'}]
    const findname=arrmock.find(o=>o.name==='1')
    console.log(findname); // { name: '1', age: 2 } 查詢出第一個符合條件不在往后查詢
2.嵌套查詢，查詢某一個子元素對應的父元素的值（已知某個子元素中的key值，查詢父元素，再取出父元素key值）

const menuSlioder = [
  {
    key: '123123123',
    title: '賬戶管理',
    children: [
      {
        key: 'abcd',
        title: '錢包賬戶',
      },
    ],
  },
  {
    key: 'sfwfsdf',
    title: '賬戶管理',
    children: [
      {
        key: 'abc',
        title: '錢包賬戶',
      },
      {
        key: 'abcde',
        title: '賬戶流水明細',
      },
    ],
  },
];

const as = menuSlioder.find((item) => {
  return Boolean(item.children.find((o) => o.key === 'abcd'));
});
// 等價于  some的用法依據(jù)判斷條件，數(shù)組的元素是否有一個滿足，若有一個滿足則返回ture，否則返回false
// const as = menuSlioder.find((item) => {
//   return item.children.some((o) => o.key === 'abcd');
// });
console.log(as); 
// {
//   key: '123123123',
//   title: '賬戶管理',
//   children: [
//     {
//       key: 'abcd',
//       title: '錢包賬戶',
//     },
//   ],
// }

2.filter(callback) 過濾數(shù)組，返回一個滿足要求的數(shù)組，callback是一個條件語句

1.基本用法
const users = [
  { 'user': 'barney', 'age': 36, 'active': true },
  { 'user': 'fred',   'age': 40, 'active': false },
  { 'user': 'ared',   'age': 24, 'active': false },
  { 'user': 'ered',   'age': 80, 'active': false },
  { 'abc': 'ered',   'age': 80, 'active': false }
]
// 篩選 age等于40或者age等于24的 數(shù)組對象
const filtered = users.filter(n => n.age===40 || n.age===24)
console.log('filter后的鍵名', filtered)   // => [{user: "fred", age: 40, active: false}，{user: "ared", age: 24, active: false}]
const  ac=users.filter(n => n.age===100)
console.log(ac);  // []

2.數(shù)組中的空字符串刪除
const spread = ['A', '', 'B', null, undefined, 'C', '  ']
const filtered = spread.filter((item) => {
  return item && item.trim()
})
console.log('數(shù)組中的空字符串刪掉', filtered) // => ["A", "B", "C"]

3.filter+map寫法用于剔除某些元素的騷操作
const arr = [
  {
    gender: 'man',
    name: 'john',
  },
  {
    gender: 'woman',
    name: 'mark',
  },
  {
    gender: 'man',
    name: 'jerry',
  },
];
// filter : 有條件的篩選，返回條件為true的數(shù)組
// 篩選出性別為男性的名字集合
const newArr = arr
  .filter((n) => n.gender === 'man')
  .map((item) => {
    return {
      name: item.name,
    };
  });
console.log('男性名字集合', newArr); // => [{name: 'john'}, {name: 'jerry'}]

4.在案例find中使用filter
const as = menuSlioder.filter((pro) => pro.children.some((o) => o.key === 'abcde'))
// => [ { key: 'sfwfsdf', title: '賬戶管理', children: [ [Object], [Object] ] } ]
menuSlioder.filter((pro) => pro.children.some((o) => o.key === 'abcde')).map((item)=>console.log(item))
// {
//   key: 'sfwfsdf',
//   title: '賬戶管理',
//   children: [ { key: 'abc', title: '錢包賬戶' }, { key: 'abcde', title: '賬戶流水明細' } ]
// }