The for loop in React showing ESLint error

Question

The for loop inside the objToQueryString function showing me the error

ESLint: The body of a for-in should be wrapped in an if statement to filter unwanted properties from the prototype.(guard-for-in)

const objToQueryString = obj => {
  const keyValuePairs = [];
  for (const key in obj) {
    keyValuePairs.push(
      `${encodeURIComponent(key)}${encodeURIComponent(
        `: "`
      )}${encodeURIComponent(obj[key])}`
    );
  }
  return `${encodeURIComponent(`{`)}${keyValuePairs.join(
    encodeURIComponent(`", `)
  )}${encodeURIComponent(`" }`)}`;
};

And adding this: // eslint-disable-next-line guard-for-in is not working

Answer 1

Wrap your push statement with

const objToQueryString = (obj) => {
  const keyValuePairs = [];
  for (const key in obj) {
    if (Object.prototype.hasOwnProperty.call(obj, key)) {
      keyValuePairs.push(
        `${encodeURIComponent(key)}${encodeURIComponent(
          ': "',
        )}${encodeURIComponent(obj[key])}`,
      );
    }
  }
  return `${encodeURIComponent('{')}${keyValuePairs.join(
    encodeURIComponent('", '),
  )}${encodeURIComponent('" }')}`;
};

More on the rule details and explanation here