jQuery .each() function with ES6 arrow functions [duplicate]

Answer 1

That is because the mean of this is not the same in arrow functions.

this

Arrow functions capture the this value of the enclosing context,

The each() function passes the element as the second argument to the callback.

But a more appropriate solution for you will be to also use .map() instead of each()

let mediaBoxes = $(".now-thumbnail");
let titles = mediaBoxes.map((i, el) => {
  return {
    index: i,
    title: $(el).find(".now-thumbnail-bottomtext").text().trim()
  };
}).get();

Answer 2

My solution is to not use this at all, but use the variables that are passed to the callback function. The first one is the index and the second one gives you the DOM element itself.

 let mediaBoxes = $(".now-thumbnail");
 let titles = [];
 mediaBoxes.each((index, element) => {
                let obj = {
                    index: index,
                    title: $(element).find(".now-thumbnail-bottomtext").text().trim()
                };
                titles.push(obj);
 });