[英]Find JSON index based on child key value using Javascript
I have the below JSON which controls the flow of the pages in my application. 我有下面的JSON,它控制应用程序中页面的流动。 To navigate between screens manually I use the index of a page.
要手动在屏幕之间导航,我使用页面的索引。 If I were to link to Page 1 I would use the index '0'.
如果要链接到Page 1,我将使用索引“ 0”。 I would like to be able to navigate using the
id
instead. 我希望能够使用
id
进行导航。 So I could use S010_010
to navigate. 因此我可以使用
S010_010
进行导航。 Unfortunately the navigation function of the app is used by multiple elements and cannot be changed completely so I am looking for a method that can take the id and return the index from flows
. 不幸的是,该应用程序的导航功能被多个元素使用,并且无法完全更改,因此我正在寻找一种可以获取id并从
flows
返回索引的方法。
var flows = {
"default": [{
theme: "theme1",
events: "touchstart",
easingSlideIn: "transition.fadeIn",
easingSlideOut: "transition.fadeOut",
easingRef: "transition.perspectiveRightIn",
easingPop: "transition.flipYIn"
},
{
id: "S010_010", //0
description: "",
chapter: "01",
ref: ""
},
{
id: "S020_010", //1
description: "",
chapter: "01",
ref: ""
},
{
id: "S030_010", //2
description: "",
chapter: "01",
ref: ""
},
]
};
This is an example of how I currently retrieve the id
using the index: 这是当前如何使用索引检索
id
的示例:
this.options.flow[screen +1].id
There is no specific method, but you can create your own inverted index 没有特定的方法,但是您可以创建自己的倒排索引
var invertedIndex = {};
flows.default.forEach((elem, index) => {
if(elem.id != null) {
invertedIndex[elem.id] = index - 1;
}
})
//then you can use the id for the lookup as
invertedIndex['S030_010']
You can use for-in to iterate and return the index if id matches with that of method's. 如果id与方法的匹配,则可以使用for-in进行迭代并返回索引。 It is also recommended to use
for-of
but you end up descructing something like this for(const [index, value] of flows.default.entries())
to fetch index hence used for-in 还建议使用
for-of
但是最终会用类似for(const [index, value] of flows.default.entries())
来获取要用于in-in的索引
let flows = { "default": [{ theme: "theme1", events: "touchstart", easingSlideIn: "transition.fadeIn", easingSlideOut: "transition.fadeOut", easingRef: "transition.perspectiveRightIn", easingPop: "transition.flipYIn" }, { id: "S010_010", //0 description: "", chapter: "01", ref: "" }, { id: "S020_010", //1 description: "", chapter: "01", ref: "" }, { id: "S030_010", //2 description: "", chapter: "01", ref: "" }, ] }; let getFlowByID = (id) => { for(let eachFlowIndex in flows.default){ if(flows.default[eachFlowIndex].id == id){ return eachFlowIndex; } } } console.log(getFlowByID("S030_010")); // gets S030_010 index
We use for in
cycle to iterate through our array of objects and return the index if id was found. 我们使用
for in
循环遍历对象数组,如果找到id,则返回索引。
ES5 solution ES5解决方案
var flows = { "default": [ { theme: "theme1", events: "touchstart", easingSlideIn: "transition.fadeIn", easingSlideOut: "transition.fadeOut", easingRef: "transition.perspectiveRightIn", easingPop: "transition.flipYIn" }, { id: "S010_010", //0 description: "", chapter: "01", ref: "" }, { id: "S020_010", //1 description: "", chapter: "01", ref: "" }, { id: "S030_010", //2 description: "", chapter: "01", ref: "" } ] }; function getIndex(id) { var i = 0, objs = flows.default; for (i in objs) if (objs[i].id == id) return +i - 1 } console.log(getIndex('S010_010')); //0
ES6 solution ES6解决方案
We use Array.find
function to iterate through our array, save the index if id was found and than return it. 我们使用
Array.find
函数来遍历数组,如果找到id则保存索引,然后返回它。 In the case if it is not found it returns -1. 如果找不到,它将返回-1。 But unfortunatelly this solution isn't shorter than my ES5 solution.
但是不幸的是,该解决方案并不比我的ES5解决方案短。
var flows = { "default": [ { theme: "theme1", events: "touchstart", easingSlideIn: "transition.fadeIn", easingSlideOut: "transition.fadeOut", easingRef: "transition.perspectiveRightIn", easingPop: "transition.flipYIn" }, { id: "S010_010", //0 description: "", chapter: "01", ref: "" }, { id: "S020_010", //1 description: "", chapter: "01", ref: "" }, { id: "S030_010", //2 description: "", chapter: "01", ref: "" } ] }; let getIndex = (id) => { let ret = -1; flows.default.find((elem, index) => { if(elem.id == id) ret = index - 1 }); return ret }; console.log(getIndex('S010_010')); //0
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.