Why this matters
Functional components do not have a 'this' context. Using 'this' leads to runtime errors. Instead, use props and destructuring for data access.
Ensure that 'this' is not used in functional components. Functional components do not have a 'this' context. Use props and destructuring for data access instead.
Functional components do not have a 'this' context. Using 'this' leads to runtime errors. Instead, use props and destructuring for data access.
Side-by-side examples engineers can pattern-match during review.
function MyComponent(props){
const foo = this.props.bar; // Noncompliant: remove 'this'
return (
<div>{foo}</div>
);
}function MyComponent({bar}){
const foo = bar;
return (
<div>{foo}</div>
);
}function MyComponent(props){
const foo = this.props.bar; // Noncompliant: remove 'this'
return (
<div>{foo}</div>
);
}function MyComponent({bar}){
const foo = bar;
return (
<div>{foo}</div>
);
}From the same buckets as this rule.
Check if loops use equality operators (== or !=) in termination conditions. These can lead to infinite loops if the condition is never met exactly. Instead, use relational operators like < or > for safer loop termination.