从JSON响应中的键名中删除句点

Question

所以，我不确定这里发生了什么，以及为什么要在JSON密钥名称中添加句点。

我想要做的概述是将json响应通过ejs变量传递到页面模板中，并从单个字段中获取数据。

json响应如下：

来自prismic.io。 （打开对象括号在那里被截断，数据是主要对象的子节点。）

当我通过EJS注射时

<%= product.data.product.imgone2.value.main.url %>

我收到如下错误：

 Cannot read property 'imgone2' of undefined

其中，为什么抗震这样做？

有没有办法用EJS修复内联？

如果没有，我如何使用javascript函数解析JSON响应以删除它？

如果您需要我的路线：

router.get('/product/:slug', function(req, res) {
//route params
  var slug = req.params.slug;
  var productResp; //scope up api response to pass to render()
  console.log(slug);
//api call
  Prismic.api("https://prismic.io/api").then(function(api) {
    return api.getByUID('product' , slug);
  }).then(function(response) {

    res.render('product-template', {
      product: response,
    })

  }, function(err) {
    console.log("Something went wrong: ", err);
  });
});

谢谢！

Answer 1

  

您是否尝试过product.data [＆＃34; product.imgone2＆＃34;]。value.main.url？

来自官方文档

访问:order_item

等媒体资源

  

属性必须是有效的JavaScript标识符，即一系列字母数字字符，还包括下划线（＆＃34; _＆＃34;）和美元符号（＆＃34; $＆## 34;），不能以数字开头。例如，object。$ 1有效，而object.1不是。

如果属性不是有效的JavaScript标识符，则必须使用括号表示法。

https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Operators/Property_Accessors

Answer 2

正如已经提到的那样，使用括号表示法：

product.data["product.imgone2"].value.main.url

如果由于某种原因无法做到这一点，您可以通过以下函数运行您的对象来“修复”结构：

//this will transform structures like these:
var a = {
  "data": {
    "product.imgone2": {
      "value": {
        "main.url": "yourMainUrl"
      },
      "another.value": "to show how this is handled"
    }
  }
}

//into these:
var b = nestKeysWithDots(a);
console.log(JSON.stringify(b, null, 2));

//wich now can be resolved by your paths, without worrying
console.log(
  "b.data.product.imgone2.value.main.url", 
  b.data.product.imgone2.value.main.url
);


//and the implementation:
function isObject(value){
  return typeof value === "object" && value !== null;
}

function nestKeysWithDots(source){
  return !isObject(source)? source:
    Array.isArray(source)? source.map(nestKeysWithDots):
    Object.keys(source).reduce((target, path) => {
      var value = nestKeysWithDots(source[path]);
      path.split(".").reduce((obj, key, index, array) => {
        if(index+1 === array.length){
          //last key
          obj[key] = value;
          return;
        }
        return key in obj && isObject(obj[key])?
          obj[key]:
          (obj[key] = {});
      }, target);
      return target;
    }, {});
}