JSFiddle - React, Tailwind, and code Playground

by Jagi

JavaScript

var obj = {
  pages: [{
      url: "a",
      clicks: [{
        tag: "A"
      }, {
        tag: "DIV"
      }]
    },
    {
      url: "b",
      clicks: [{
        tag: "P"
      }, {
        tag: "H1"
      }]
    },
    {
      url: "c"
    }
  ],
  test: { of: {
      nested: {
        fields: "PASSED!"
      }
    }
  }
};

function resolveFieldValue(fieldName) {
	console.log("---------- RESOLVING " + fieldName + " ----------");
  if (fieldName.includes(".")) {
    chunkNames = fieldName.split(".");
    try {
      return chunkNames.reduce(function(result, chunkName) {
        console.log(result, chunkName);
        if (result === null) {
          return obj[chunkName];
        } else if (Array.isArray(result)) {
        	if (/^-?\d+$/.test(chunkName)) {
          	const index = parseInt(chunkName);
            console.log("INDEX!", result, index);
          	return result[index];
          }
          return result.map(element => element[chunkName]);
        } else if (typeof result === "object") {
          return result[chunkName];
        } else {}
      }, null);
    } catch (err) {
      console.log(err);
    }
  } else {
    // here we're dealing with simple value lookup
    return obj[fieldName];
  }
}

console.log(resolveFieldValue("test.of.nested.fields"));
console.log(resolveFieldValue("pages.url"));
console.log(resolveFieldValue("pages.0.url"));
console.log(resolveFieldValue("pages.clicks.tag"));