The Web Dev

To filter array of objects with another array of objects with JavaScript, we use the filter method.

For instance, we write

const myArray = [
  { userid: "100", projectid: "10", rowid: "0" },
  { userid: "101", projectid: "11", rowid: "1" },
  { userid: "102", projectid: "12", rowid: "2" },
  { userid: "103", projectid: "13", rowid: "3" },
  { userid: "101", projectid: "10", rowid: "4" },
];
const myFilter = [
  { userid: "101", projectid: "11" },
  { userid: "102", projectid: "12" },
  { userid: "103", projectid: "11" },
];

const myArrayFiltered = myArray.filter((el) => {
  return myFilter.some((f) => {
    return f.userid === el.userid && f.projectid === el.projectid;
  });
});

to call myArray.filter with a callback that checks if the properties of object el in myArray has the userid and projectid equal to object f in myFilter with some.

Then the items in myArray that matches any object property we check for in myFilter is returned.

To convert JSON object to CSV format in JavaScript, we use some object and array methods.

For instance, we write

const convertToCSV = (arr) => {
  const array = [Object.keys(arr[0])].concat(arr);

  return array
    .map((it) => {
      return Object.values(it).toString();
    })
    .join("\n");
};

console.log(
  convertToCSV([
    {
      id: 1,
      name: "Foo",
      timestamp: new Date(),
    },
    {
      id: 2,
      name: "Bar",
      timestamp: new Date(),
    },
    {
      id: 3,
      name: "Baz",
      timestamp: new Date(),
    },
  ])
);

to define the convertToCSV function.

In it, we create an array from the property names of the first object in arr we get from Object.keys.

We then add the entries off arr to the end of it with concat.

Next, we call map with a callback to get the values of each object with Object.values and call toString to convert the array to a comma separated string.

Then we call join to join each row with a new line.

To push to an array with JavaScript, we use the push method.

For instance, we write

const json = [{ cool: "34.33" }, { alsocool: "45454" }];
json.push({ coolness: "34.33" });

to call json.push with an object to append it as the last item of the json array.

To create ul and fill it based on a passed array with JavaScript, we use the createElement and createTextNode methods.

For instance, we write

const options = ["Option 1", "Option 2"];

const makeUl = (array) => {
  const list = document.createElement("ul");

  for (const a of array) {
    const item = document.createElement("li");
    item.appendChild(document.createTextNode(a));
    list.appendChild(item);
  }
  return list;
};

document.getElementById("foo").appendChild(makeUl(options));

to define the makeUl function.

In it, we create the ul element with createElement.

Then we loop through the array with a for-of loop.

In the loop, we create a li element with createElement.

Then we create a text node with the a content as the text with createTextNode.

Then we call item.appendChild to append the text node to the li as its last child.

And we call list.appendChild to append the li to the ul as its last child.

We then return the list.

Finally, we call makeUl with options and call appendChild to append that as the last child of the element with ID foo.