我需要创建一个返回纯JavaScript字符串的函数,该字符串由'name'索引,并包含所有'props'

时间:2019-09-22 06:03:57

标签: javascript arrays json

我的代码似乎是正确的,但是在Json结果的某些位置,它没有返回':',而是返回','。请在代码注释中查看所需的结果。

我也不喜欢编码为从Json表达式中删除数组括号的“替换”,并且我不应该修改JSON字符串。有更优雅的方法吗?

    // JSON Object  
    var items  = [
      {
        name: "item 1",
        id: 2,
        props: {
          a: "a prop1",
          b: "b prop1",
        },
        values: [1, 2, 3],
      },
      {
        name: "item 2",
        id: 3,
        props: {
          a: "a prop2",
          b: "b prop2",
        },
        values: [6, 1, 2, 3, 4],
      },
      {
        name: "item 3",
        id: 4,
        props: {
          a: "a prop3",
          c: "c prop3",
        },
        values: [10, 1, 2, 3, 4, 5],
      },
    ];

    export function getObject(items) {
    
    var arr = [];
    
      for(var i in items){
        arr.push(items[i].name);
        arr.push(items[i].props);
      }
    
      var myJSON = JSON.stringify(arr).toString();
      
      var test = myJSON.replace("[","{").replace("]","}"); // I couldn't find another way to extract the array data from the array brackets.
      
      var test2 = JSON.stringify(test);
    
    // test2 is returning: "{\"item 1\",{\"a\":\"a prop1\",\"b\":\"b prop1\"},\"item 2\",{\"a\":\"a prop2\",\"b\":\"b prop2\"},\"item 3\",{\"a\":\"a prop3\",\"c\":\"c prop3\"}}"  
    // but it's expected:  "{\"item 1\":{\"a\":\"a prop1\",\"b\":\"b prop1\"},\"item 2\":{\"a\":\"a prop2\",\"b\":\"b prop2\"},\"item 3\":{\"a\":\"a prop3\",\"c\":\"c prop3\"}}"
          
       return test2;
    }

1 个答案:

答案 0 :(得分:0)

使用<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js"> <div class="Pipeline_count"> <div id="myCarousel" class="carousel slide" data-ride="false" style="background: black"> <div class="video_background"> <video preload="auto" autoplay loop muted id="myvideo"> <source src="./source/gradent_pink.mp4" type="video/mp4"> </video> </div> <div class="row"> <div class="desc_ col-sm-5"> <span class="process">process</span> <span class="dottedline"></span> <span class="ellips1"> <img src="./source/Ellipse_24.svg"> <span class="ellips1_txt">Use recommendation Engines to plan flights and Ground Control Points</span> </span> <span class="ellips2"> <img src="./source/Ellipse_23.svg"> <span class="ellips2_txt">Robust Pipeline to process and efficiently merge large areas together</span> </span> <span class="ellips3"> <img src="./source/Ellipse_22.svg"><span class="ellips3_txt">Deep learning analytics suite for urban / rural (identification of plots, roads etc) and precision agriculture (plant count and plant health)</span> </span> </div> <div class="col-sm-1"></div> <div class="desc col-sm-5"> <div class="embed-responsive embed-responsive-16by9"> <iframe width="640" height="480" src="https://sketchfab.com/models/93760d8297264eb184e5c3df52142d00/embed?autospin=0.2&amp;autostart=1&amp;preload=1&amp;transparent=1&amp;ui_controls=0&amp;ui_infos=0" frameborder="0" allow="autoplay; fullscreen; vr" mozallowfullscreen="true" webkitallowfullscreen="true"> </iframe> </div> <p class="cti">Click to Interact</p> </div> </div> </div> </div>将每个项目转换为一个对象,该对象具有一个属性,其键为.map,值为item.name对象:

item.props

如果您实际上需要JSON字符串而不是对象,请在其周围放const getObject = items => items.map(item => ({ [item.name]: item.props })); // JSON Object var items = [{ name: "item 1", id: 2, props: { a: "a prop1", b: "b prop1", }, values: [1, 2, 3], }, { name: "item 2", id: 3, props: { a: "a prop2", b: "b prop2", }, values: [6, 1, 2, 3, 4], }, { name: "item 3", id: 4, props: { a: "a prop3", c: "c prop3", }, values: [10, 1, 2, 3, 4, 5], }, ]; console.log(getObject(items));。 (请记住:There's no such thing as a "JSON Object"。)

JSON.stringify