What is the best way to transform an array of string values into an array of objects?

Question

What is the best way to transform an array of string values into an array of objects?

I currently have an array of strings with date and price information:

    const array = [
       "date: 1679534340367, price: 27348.6178237571831766",
       "date: 1679534340367, price: 27348.6178237571831766",
       "date: 1679534340367, price: 27348.6178237571831766",
       "date: 1679534340367, price: 27348.6178237571831766",
       "date: 1679534340367, price: 27348.6178237571831766"
    ]

My goal is to transform this array into a new array of objects structured like this:

   const array = [
      {"date": 1679534340367, "price": 27348.6178237571831766},
      {"date": 1679534340367, "price": 27348.6178237571831766},
      {"date": 1679534340367, "price": 27348.6178237571831766},
      {"date": 1679534340367, "price": 27348.6178237571831766},
      {"date": 1679534340367, "price": 27348.6178237571831766},
   ]

javascript

Answer 1

Answer №1

To escape object keys, you can utilize the .replace function with regular expressions. Next, encase the keys in curly braces by wrapping the string with {}, and finally convert it to an object using JSON.parse()

array.map((i) => {
    let item = i;

    // escape "date" key
    item = item.replace(/date:/, '"date":');

    // escape "price" key
    item = item.replace(/price:/, '"price":');

    // wrap string with curly braces
    item = `{${item}}`;

    // call JSON.parse func
    return JSON.parse(item );
})

Alternatively, you can achieve the same result without intermediate steps:

array.map((item) =>
  JSON.parse(
    `{${item.replace(/date:/, '"date":').replace(/price:/, '"price":'}}`,
  ),
);

Answer 2

To escape object keys, you can utilize the .replace function with regular expressions. Next, encase the keys in curly braces by wrapping the string with {}, and finally convert it to an object using JSON.parse()

array.map((i) => {
    let item = i;

    // escape "date" key
    item = item.replace(/date:/, '"date":');

    // escape "price" key
    item = item.replace(/price:/, '"price":');

    // wrap string with curly braces
    item = `{${item}}`;

    // call JSON.parse func
    return JSON.parse(item );
})

Alternatively, you can achieve the same result without intermediate steps:

array.map((item) =>
  JSON.parse(
    `{${item.replace(/date:/, '"date":').replace(/price:/, '"price":'}}`,
  ),
);

Answer 3

Answer №2

One effective approach, in my humble opinion, is utilizing regular expressions:

const array = [
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766"
];

const newArray = array.map(str => {
  const matches = str.match(/date: ([\d.]+), price: ([\d.]+)/);
  return { date: Number(matches[1]), price: Number(matches[2]) };
});

console.log(newArray);

Furthermore, another viable option would be to employ a map and split strategy:

const array = [
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766"
];

const newArray = array.map(str => {
  const parts = str.split(", ");
  const date = parts[0].split(": ")[1];
  const price = parts[1].split(": ")[1];
  return { date: Number(date), price: Number(price) };
});

console.log(newArray);

Answer 4

One effective approach, in my humble opinion, is utilizing regular expressions:

const array = [
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766"
];

const newArray = array.map(str => {
  const matches = str.match(/date: ([\d.]+), price: ([\d.]+)/);
  return { date: Number(matches[1]), price: Number(matches[2]) };
});

console.log(newArray);

Furthermore, another viable option would be to employ a map and split strategy:

const array = [
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766",
   "date: 1679534340367, price: 27348.6178237571831766"
];

const newArray = array.map(str => {
  const parts = str.split(", ");
  const date = parts[0].split(": ")[1];
  const price = parts[1].split(": ")[1];
  return { date: Number(date), price: Number(price) };
});

console.log(newArray);

What is the best way to transform an array of string values into an array of objects?

Answer №1

Answer №2

Similar questions

Updating the content of a list item on the fly using React

Struggling with JavaScript's getElementById function

Leveraging global variables within Vuex state management strategy

Having trouble uploading Node.js and Mongoose to Heroku due to error codes H12 and H15? Need help troubleshooting and resolving this issue?

Encountering a Uncaught TypeError when attempting to split an undefined property, but issue is limited to certain pages

Dealing with error handling in NUXT using asyncData and Vue actions

Guide to locating the recursive function in Node.js runtime

Prevent the onclick function of a span element from being triggered when the user clicks on a dropdown menu contained within

Issue encountered where Moment locale functionality is working in local development environment, but not functioning properly in the

Is it possible to extract information from a form's POST request without relying on the traditional "action" attribute within form elements?

Having trouble retrieving information from the server using ajax, javascript, jquery, and php

graphic map and paintbrush

Utilizing TypeDoc to Directly Reference External Library Documentation

Attach a Material-UI Popper component to a customized edge label in a React Flow

Creating URL query parameters for a nested REST API: A step-by-step guide

Issue with BCRYPTJS library: generating identical hashes for distinct passwords

Bringing in functions - NodeJS - non-HTML

Locate a specific element within an array and retrieve its corresponding index

Getting Started with NPM Package Initialization in Vue

The callback function for the `input` component in React Native must be a function and should not be undefined. Always remember to start component names with the proper syntax