JavaScript allows duplicate property names in classes and object literals, but only the last instance of a duplicated name determines the actual value that will be used for it. Therefore, changing values of other occurrences of a duplicated name will have no effect and may cause misunderstandings and bugs.

Defining a class with a duplicated constructor will generate an error.

Before ECMAScript 2015, using duplicate names will generate an error in JavaScript strict mode code.

This rule will also report on duplicate properties in JSX.

Noncompliant Code Example

let data = {
  "key": "value",
  "1": "value",
  "key": "value", // Noncompliant - duplicate of "key"
  'key': "value", // Noncompliant - duplicate of "key"
  key: "value", // Noncompliant - duplicate of "key"
  \u006bey: "value", // Noncompliant - duplicate of "key"
  "\u006bey": "value", // Noncompliant - duplicate of "key"
  "\x6bey": "value", // Noncompliant - duplicate of "key"
  1: "value" // Noncompliant - duplicate of "1"
}

function MyComponent(props) {
  return <div prop={props.prop1} prop={props.prop2}> { /* Noncompliant, 'prop' is defined twice */ }
    This is my component
  </div>;
}

Compliant Solution

let data = {
  "key": "value",
  "1": "value",
  "key2": "value",
  'key3': "value",
  key4: "value",
  \u006bey5: "value",
  "\u006bey6": "value",
  "\x6bey7": "value",
  1b: "value"
}

function MyComponent(props) {
  return <div prop1={props.prop1} prop2={props.prop2}>
    This is my component
  </div>;
}