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

AngularJS ng-onclick method sending value to Thymeleaf

Once invoked by an ajax request, the $().ready function is executed

Upon being provided with a route param, the response will be

Error in Leaflet: Uncaught TypeError: layer.addEventParent is not a function in the promise

Looking for a way to add interactivity to this canvas rectangle?

Developing and integrating views within a node-webkit desktop application

Developing a Cloud Function for Stripe that is taking forever to finalize writing data to Firestore

Expanding div width with jQuery as a percentage

Graph is not showing up when navigating through page

Show or hide a fixed position div using jQuery when clicked

Receiving time slots on a bootstrap schedule

Using ng-bind-html within a ng-repeat loop

Is there a way to transpile a dependency within the node_modules directory when using Nuxt 2?

Changing the CSS class of the Bootstrap datetime picker when selecting the year

Encountering a problem involving the apostrophe character "'" when trying to save content into a MySQL database

What is the proper sequence for binding jQuery to elements?

Achieving Optimal Performance with Node.js Cluster in High-Traffic Production Settings

Having trouble identifying the issue with the dependent select drop down in my Active Admin setup (Rails 3.2, Active Admin 1.0)

Prevent users from tabbing to the next input field in a web form

What is the process for implementing THREE.EdgesGeometry on a model imported using THREE.OBJLoader?