no-return-assign / no-unused-expressions

Question

I have the following line of code working on my code, but eslint is getting me an error back.

this.data.forEach(el => el.value === newValue? el[column] = newValue[column]: el)

This gives me the following error: no-return-assign: Arrow function should not return assignment.

In this question it states I would solve the problem by simply surrounding everything after => in curly braces like this:

this.data.forEach(el => { el.value === newValue? el[column] = newValue[column]: el })

However, this is now causing the following error: no-unused-expression: Expected an assignment or function call and instead saw an expression.

Any clues on how to solve this?

Answer 1

The reason you're getting these kinds of warnings is because it's confusing to put imperative code inside an expression. Your code is equivalent to something like this, which is much more readable:

this.data.forEach(el => {
    if (el.value === newValue) {
        el[column] = newValue[column];
        return newValue[column];
    else {
        return el;
    }
});

It's worth noting that the return value of a callback in forEach is ignored, so your code actually probably does something different to what you intended. If the assignment statement is all you wanted, you can do this:

this.data
    .filter(el => el.value === newValue)
    .forEach(el => {
        el[column] = newValue[column];
    });