JavaScript code that transforms a comma-separated string of words into key-value pairs within an array

I am looking to transform a list of email addresses into a key-value object within an array. Starting with

"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="40252d21292c002d21292c6e232f2d">[email protected]</a>,<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="fd90949698bd98859c908d9198d39e9290">[email protected]</a>,<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="89e3e6e1e7c9eee4e8e0e5a7eae6e4">[email protected]</a>"
and aiming to achieve

[
   {"to": "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="89ece4e8e0e5c9e4e8e0e5a7eae6e4">[email protected]</a>"},
   {"to": "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="bbd6d2d0defbdec3dad6cbd7de95d8d4d6">[email protected]</a>"},
   {"to": "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="b0dadfd8def0d7ddd1d9dc9ed3dfdd">[email protected]</a>"}
]

This is the approach I took:

var req = {
  query: {
    personalize:
      "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="51343c30383d113c30383d7f323e3c">[email protected]</a>,<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="5d303436381d38253c302d3138733e3230">[email protected]</a>,<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="4c262324220c2b212d2520622f2321">[email protected]</a>"
  }
};
var emailList = req.query.personalize;
var emailArr = emailList.split(",");
var emailObj = Object.assign({}, emailArr);
console.log(emailObj);

Here's the outcome of my efforts:

"0": "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="d8bdb5b9b1b498b5b9b1b4f6bbb7b5">[email protected]</a>"
"1": "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="6a0703010f2a0f120b071a060f44090507">[email protected]</a>"
"2": "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="ef85808781af88828e8683c18c8082">[email protected]</a>"

Following that, I attempted this variation:

var req = {
  query: {
    personalize:
      "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="f89d95999194b895999194d69b9795">[email protected]</a>,<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="9cf1f5f7f9dcf9e4fdf1ecf0f9b2fff3f1">[email protected]</a>,<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="b2d8dddadcf2d5dfd3dbde9cd1dddf">[email protected]</a>"
  }
};
var emailList = req.query.personalize;
var arr = emailList.split(",");
const res = arr.reduce((acc,curr)=> (acc[curr]='to',acc),{});
console.log(res)

Although it was close, the result ended up in reverse of what I expected, displaying like so:

"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="1e7b737f77725e737f7772307d7173">[email protected]</a>": "to"
...

Answer №1

After some insightful comments from Ivar and Amir, it became clear that this method is effective.

function performMockTest() {
var request = {
  query: {
    personalize:
 "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="7a1f171b13163a171b131654191517">[email protected]</a>,<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="5e343136301e39333f3732703d3133">[email protected]</a>,<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="3b565e7b5e435a564b575e15585456">[email protected]</a>"
  }
};
var emailList = request.query.personalize;
console.log(generateRecipientList(emailList))
}

performMockTest();

function generateRecipientList(emailString) {
  return emailString.split(",").map(to => ({to}));
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Having trouble finding the element within the form tag even after attempting to use .switchTo().defaultContent()

My HTML is structured like this: <section> <div> <form> <div>Username field</div> <div>Password field</div> <div> <div>.. <div>.. <iframe& ...

Sending the value from a for loop through AJAX and populating it into a form field

Currently, I have implemented a piece of JavaScript code that captures user input, sends a request to an endpoint using AJAX, and appends a specific field from the returned results as an option within a datalist. This functionality is working perfectly fin ...

Can a "fragile export" be generated in TypeScript?

Testing modular code can be challenging when you have to export things just for the purpose of testing, which can clutter your code and diminish the effectiveness of features like "unused variable" flags on compilers or linters. Even if you remove a usage ...

What are some ways to incorporate inline TypeScript Annotations into standard JavaScript code?

If you're using VSCode, there's a new feature that allows you to implement type checking for traditional JavaScript files. There are instances where I wish to specify the type of a variable or parameters in a method or function to enhance auto-co ...

Tips for properly including my Dialog Flow access token in the environment file within the Angular CLI

I am currently in the process of creating a bot using angular cli and integrating dialog flow's API. The issue I am facing is that when I perform debugging in Chrome, I encounter the following error logs: ApiAiClientConfigurationError columnNumber: ...

Ever since updating my jQuery version to 3.2.1, my ajax code seems to have stopped functioning properly

My program's ajax functionality was running smoothly with jquery version 1.7, but when I updated to version 3.3.1, the ajax part stopped working. I made sure to attach the ajax portion of my code after updating the jQuery version. In the PHP file, I s ...

Generating an array of custom class objects with varying sizes, without a default constructor

Struggling in my CS tutoring lab this morning, I'm reaching out for assistance as I must utilize this class. The tutors have been no help so far, so I'm hoping someone can guide me in the right direction. #ifndef WORD_H #define WORD_D #include & ...

Implement a validation function in the "jQuery validation library."

Hello, I am currently using the jQuery validation plugin to validate my form. I am trying to add an additional rule to the validation, but I am struggling to get it to work. The input value should be less than or equal to the previous element's value. ...

Two conflicting jQuery plugins are causing issues

In my journey to learn jQuery, I encountered an issue while working on a website that utilizes a scroll function for navigating between pages. The scripts used in this functionality are as follows: <script type="text/javascript" src="js/jquery-1.3.1.mi ...

Share a URL and display small previews from it - php

Have you ever noticed that on certain websites, such as Facebook, when you post a link it automatically displays thumbnails from the linked website? Like in the image below: Ever wondered how to achieve that effect? ...

Execute index.js code from index.html using NodeJS and Express

Currently, I am diving into the world of NodeJS and Express using Replit.com for a small project. The main objective is to develop a basic input field that, upon submission, will post to different channels such as Discord and Twitter. The piece of code be ...

Preventing scrolling in jQuery UI Draggable when using flexbox

In my project, I am looking to organize a container using jQuery UI draggable/droppable feature. Since the elements in my list are arranged in a straight horizontal line, I have utilized display: flex. This arrangement works well when adding new items to ...

Unable to adjust the width of a table column within a horizontally scrollable container

I am struggling to resize the columns of a large table with 20 headers. Despite trying to place the table inside a div with overflow:auto, I still cannot achieve horizontal scrolling or make the div expand when resizing the columns. A sample code snippet ...

Set $scope.model childs to an empty string or a null value

While working on a form, I am using a $http request to send the information through Angular in the following manner: $http({ method:"POST", url: "controllers/servicerequest.php", data: { servicerequest: $scope. ...

Alert: It is invalid for an <a> element to be nested inside another <a> element according to validateDOMNesting

I've been experimenting with using react-router in conjunction with reactstrap and create-react-app. While setting up the routing within my application, I encountered a need to utilize state for the reactstrap components. To achieve this, I converted ...

What is the method for extracting the href attribute from an <a class using Python Selenium?

I am attempting to extract a href from a webpage using selenium. When I utilize the browser console with this javascript command, I successfully get the desired href: document.getElementsByClassName('item-panel__title')[0].getAttribute('href ...

An error was encountered in the index.js file within the app directory when running the webpack

Recently, I was told to learn react.js even though my knowledge of javascript is limited. Nevertheless, I decided to dive in and start with a simple "Hello World" project. Initially, when I used the index.js file below and ran webpack -p, everything worke ...

Sharing JSON data with public/javascripts/X.js in Node/Express: A beginner's guide

Currently facing a challenge with my Express project. Take a look at https://github.com/MoreeZ/help1 and examine ./public/javascripts/budget.js. My goal is to swap the incomeData object to read data from ./incomedata.json I attempted passing it through th ...

Loading jQuery via JavaScript in the head section of the HTML document

I'm currently developing an application using jQuery and jQuery Mobile. I have a script in the head section that dynamically loads both libraries. However, my body contains a script that relies on jQuery ($) and is unable to access it because it loads ...

Using ng serve to upload multipart files in Angular 2

I am currently working on the front end of a file uploading service and have encountered a strange issue. When I restart the server using ng serve, it throws an error related to generated components within the app component. The error message can be seen h ...