Category: JavaScript

To filter an array or object by checking multiple values with JavaScript, we use the filter method.

For instance, we write

const find = myArray.filter((result) => {
  return result.param1 === "string1" && result.param2 === "string2";
});

to call myArray.filter with a function that checks if the result object in myArray that’s being looped through has the params1 property equal to 'string1' and params2 equals to 'string2'.

An array with the objects that meets the condition is returned.

To store JavaScript functions in arrays, we reference the function in an array.

For instance, we write

const yourFunction = () => {
  console.log("I am your function");
};

const group = [0, "abc", false, yourFunction];

group[3]();

to put yourFunction in the group array.

Then we call yourFunction with group[3]().

To get the previous and next elements of an array loop in JavaScript, we use the modulo operator.

For instance, we write

const len = array.length;

const current = array[i];
const previous = array[(i + len - 1) % len];
const next = array[(i + 1) % len];

to get the current array item with index i.

We get the previous item’s index with (i + len - 1) % len.

And we get the next item with index (i + 1) % len.

To fix push to Vuex store array not working in Vue, we commit a mutation.

For instance, we write

const store = new Vuex.Store({
  state: {
    customers: [{ id: "1", name: "user 1" }],
  },
  mutations: {
    addCustomer: (state, customer) => {
      state.customers.push(customer);
    },
  },
})

to define our Vuex store with the addCustomer mutation.

In it, we call state.customers.push to append customer as the last item of the customers state.

Then we write

store.commit("addCustomer", { id: "2", name: "User 2" });

to call store.commit with the name of the mutation to commit and the object we want to append to the state.

To update if exists or add new element to array of objects with JavaScript, we can check if the index of the item that matches our condition exists.

For instance, we write

const upsert = (array, element) => {
  const i = array.findIndex((_element) => _element.id === element.id);
  if (i > -1) {
    array[i] = element;
  } else {
    array.push(element);
  }
};

const array = [
  { id: 0, name: "Apple", description: "fruit" },
  { id: 1, name: "Banana", description: "fruit" },
  { id: 2, name: "Tomato", description: "vegetable" },
];

upsert(array, { id: 2, name: "Tomato", description: "fruit" });

to define the upsert function.

In it, we call array.findIndex to find the element in array that matches the id value.

If it exists, then i is bigger than -1 and we assign the element to that index.

Otherwise, we call push to append element as the last item.