js 如何获取嵌套对象的索引值？

Question

后台返回的对象如下

{
    "result": [
        {
            "cityAndPrefecture": [
                {
                    "city": "滨海新区",
                    "prefecture": [
                        "全市",
                        "天津滨海旅游区",
                        "天津东疆海水浴场"
                    ]
                }
            ],
            "province": "天津市"
        },
        {
            "cityAndPrefecture": [
                {
                    "city": "东营",
                    "prefecture": []
                },
                {
                    "city": "威海",
                    "prefecture": []
                },
                {
                    "city": "日照",
                    "prefecture": [
                        "全市",
                        "日照桃花岛"
                    ]
                },
                {
                    "city": "滨州",
                    "prefecture": []
                },
                {
                    "city": "潍坊",
                    "prefecture": [
                        "全市",
                        "潍坊度假区"
                    ]
                },
                {
                    "city": "烟台",
                    "prefecture": [
                        "全市",
                        "海阳万米海滩",
                        "金沙滩海水浴场（烟台）",
                        "屺坶岛"
                    ]
                },
                {
                    "city": "青岛",
                    "prefecture": [
                        "全市",
                        "第一海水浴场",
                        "第六海水浴场",
                        "石老人海水浴场",
                        "金沙滩海水浴场（青岛）"
                    ]
                }
            ],
            "province": "山东省"
        },
        {
            "cityAndPrefecture": [
                {
                    "city": "唐山",
                    "prefecture": []
                },
                {
                    "city": "沧州",
                    "prefecture": []
                },
                {
                    "city": "秦皇岛",
                    "prefecture": [
                        "全市",
                        "北戴河老虎石浴场",
                        "南戴河浴场",
                        "东山浴场",
                        "西浴场",
                        "北戴河旅游区"
                    ]
                }
            ],
            "province": "河北省"
        },
        {
            "cityAndPrefecture": [
                {
                    "city": "丹东",
                    "prefecture": []
                },
                {
                    "city": "大连",
                    "prefecture": [
                        "全市",
                        "棒棰岛浴场",
                        "付家庄浴场",
                        "星海浴场",
                        "夏家河浴场",
                        "泊石湾",
                        "金石滩",
                        "仙浴湾",
                        "大黑石",
                        "塔河湾"
                    ]
                },
                {
                    "city": "盘锦",
                    "prefecture": []
                },
                {
                    "city": "营口",
                    "prefecture": []
                },
                {
                    "city": "葫芦岛",
                    "prefecture": []
                },
                {
                    "city": "锦州",
                    "prefecture": []
                }
            ],
            "province": "辽宁省"
        }
    ],
    "success": true
}

传入一个值，如果这个值是city的值 就返回 city province 的索引值 传入是prefecture的值 就返回 prefecture city province的值
[0,1] 或者 [0，2,3]这种

Answer 1

因为三层数据，是固定的，可以直接为每层写一个查找方法，把查找的结果拼接起来就可以了

function find(value, roots) {
    return findProvince(roots);

    function findProvince(provinces) {
        for (const i in provinces) {
            const province = roots[i];
            if (province.province === "value") {
                return [i];
            } else {
                const r = findCity(province.cityAndPrefecture);
                if (r) {
                    return [i, ...r];
                }
            }
        }
    }

    function findCity(cities) {
        for (const i in cities) {
            const cap = cities[i];
            if (cap.city === value) {
                return [i];
            } else {
                const r = findPrefecture(cap.prefecture);
                if (r) {
                    return [i, ...r];
                }
            }
        }
    }

    function findPrefecture(prefectures) {
        const r = prefectures.indexOf(value);
        if (r >= 0) {
            return [r];
        }
    }
}

但实际上，每一层的查找方法是可以抽象出共性的，只是取值的 name 和取子列表的 children 名称不同而已。此外，还有最后一层是直接在字符串数组中查找，抽象出来之后可以这样写

function find2(value, roots) {
    const levels = [
        { name: "province", children: "cityAndPrefecture" },
        { name: "city", children: "prefecture" },
        {}
    ];

    return findPath(roots);

    function findPath(nodes, level = 0) {
        const { name, children } = levels[level];
        if (!name) {
            const idx = nodes.indexOf(value);
            return idx >= 0 ? [idx] : undefined;
        }

        for (let i = 0; i < nodes.length; i++) {
            const node = nodes[i];
            if (node[name] === value) {
                return [i];
            } else {
                const idx = findPath(node[children], level + 1);
                if (idx) {
                    return [i, ...idx];
                }
            }
        }
    }
}

调用方式差不多

console.log( find("锦州", data.result));

console.log(find2("锦州", data.result));
console.log(find2("天津滨海旅游区", data.result));

Answer 2

function getIndexChain(value, list) {
    let result = []

    list.some((item, index) => {
        if(item.province === value){
            result.push(index)
            return true
        }else{
            return item.cityAndPrefecture.some((citem, cindex) => {
                if(citem.city === value){
                    result.push(cindex, index)
                    return true
                }else{
                    let i = citem.prefecture.indexOf(value)
                    if(i >= 0){
                        result.push(i, cindex, index)
                        return true
                    }
                }
            })
        }
    })
    
    return result
}

getIndexChain('日照桃花岛', list) // [1, 2, 1]
getIndexChain('东营', list) // [0, 1]

Answer 3

  function getValueByType (type) {
    if (type === "city") {
      return [0, 1]; 
    } else if (type === "prefecture") {
      const values = [];
      for (const item of data.result) {
        for (const cp of item.cityAndPrefecture) {
          values.push(...cp.prefecture); 
        }
      }
      values.unshift("全市"); 
      return values; 
    } else {
      return []; 
    }
  }

  console.log(getValueByType("city")); 

Answer 4

const getIndexArr = (str) => {
  const { result } = a;
  // 考虑到可能会传'全市'等 产生多个index集合
  const arr = [];
  for (const index in result) {
    const { cityAndPrefecture, province } = result[index];
    if (province === str) arr.push([index]);
    for (const index2 in cityAndPrefecture) {
      const { city, prefecture } = cityAndPrefecture[index2];
      if (city === str) arr.push([index, index2]);
      for (const index3 in prefecture) {
        if (prefecture[index3] === str) arr.push([index, index2, index3]);
      }
    }
  }
  return arr;
};

console.log(getIndexArr("全市"));
console.log(getIndexArr("塔河湾"));

Answer 5

js 代码（支持任意层级）

// 找到首次匹配目标时的树状索引数组
function find_indexes(data, target, indexes = []) {
    
    // 如果找到目标字符串，则返回累积的索引数组。否则返回假值
    if (typeof(data) === 'string')
        return data === target && indexes;

    // 递归搜索对象。如果该对象是数组，则累积当前索引
    for (let [key, val] of Object.entries(data)) {
        const ret = find_indexes(val, target, indexes.concat(Array.isArray(data) ? [+key] : []));
        if (ret) return ret;
    }
}

使用

find_indexes(data.result, '日照桃花岛') // [1, 2, 1]
find_indexes(data.result, '全市')       // [0, 0, 0]
find_indexes(data.result, '其他')       // undefined