no-array-prototype-extensions.md

no-array-prototype-extensions

✅ The extends: 'recommended' property in a configuration file enables this rule.

🔧 The --fix option on the command line can automatically fix some of the problems reported by this rule.

Do not use array prototype extension properties like {{list.firstObject.name}}, {{list.lastObject}}.

The prototype extensions for the Array object were deprecated in RFC #848.

This rule recommends the use of Ember's get helper as an alternative for accessing array values.

Examples

firstObject

This rule forbids the following:

<Foo @bar={{@list.firstObject.name}} />

This rule allows the following:

<Foo @bar={{get @list '0.name'}} />

lastObject

This rule forbids the following:

<Foo @bar={{@list.lastObject}} />

This rule allows the following:

Use JS approach

import Component from '@glimmer/component';

export default class SampleComponent extends Component {
  abc = ['x', 'y', 'z', 'x'];

  get lastObj() {
    return abc[abc.length - 1];
  }
}

Then in your template

<Foo @bar={{this.lastObj}} />

Or if you have ember-math-helpers addon included:

<!-- ember-math-helpers included -->
<Foo @bar={{get @list (sub @list.length 1)}} />

References

• ember-math-helpers
• Ember get helper documentation
• EmberArray
• Ember MutableArray
• Ember prototype extensions documentation
• Ember Array prototype extensions deprecation RFC

Related rules

• ember/no-array-prototype-extensions from eslint-plugin-ember