updated defining-models.md | ES6 syntax

[hellorahulsingh]

I believe, we all should start using ES6 syntax in upcoming documents

[jenweber]

Hi @rahhulsingh-js, unfortunately arrow functions should not be used for computed properties. This code will not work.

However, your PRs raised three important things - we need an addition to our JS primer about arrow functions, a disclaimer on the computed docs/guides so others don’t make this mistake, and some coordinated work on updating non-CP snippets.

We should get the first 2 done before changing more code blocks. Would you like to help?

Either way, thank you for bringing these up!

Here’s some more info on CPs and arrow functions. This was news to me too! https://karolgalanciak.com/blog/2016/12/11/ember-tips-computed-properties-and-arrow-functions-not-a-good-idea/

[jenweber]

Accidentally hit submit & close before I was done typing. See my edited comment above.

Thanks!

[hellorahulsingh]

Thank for letting me know. But it seems to me a real concern that why an anonymous function wouldn't work using arrow syntax operation!

On Tue, May 8, 2018, 7:24 PM Jen Weber notifications@github.com wrote:

Accidentally hit submit & close before I was done typing. See my edited comment above.

Thanks!

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/emberjs/guides/pull/2330#issuecomment-387410455, or mute the thread https://github.com/notifications/unsubscribe-auth/ARY59FXH0-_dLdRhCZ7bQvck-OEEg5dnks5twaOrgaJpZM4Tzemj .

[locks]

@rahulsingh-js arrow functions are not merely a short-hand, they also maintain this bound to the scope of the outer function.

When you do:

 import DS from 'ember-data';
 import { computed } from '@ember/object';

 export default DS.Model.extend({
   fullName: computed('firstName', 'lastName', () => {
     return `${this.get('firstName')} ${this.get('lastName')}`;
   })
 });

You are saying that the this inside the callback is the same as the surrounding scope. In JavaScript, this is bound to the function definition, and since DS.Model.extend({}) is a function call to which an object is passed, the surrounding scope is the scope of the module. By specification, this inside a module is undefined, meaning that the above code will turn into something like:

 import DS from 'ember-data';
 import { computed } from '@ember/object';

// `this` scope: module.
// `this` value: undefined.

 export default DS.Model.extend({
    // `this` scope: module.
    // `this` value: undefined.

   fullName: computed('firstName', 'lastName', () => {
     // `this` scope: module.
     // `this` value: undefined.

     return `${this.get('firstName')} ${this.get('lastName')}`;
   })
 });

[hellorahulsingh]

Thanks

On Tue, May 8, 2018, 8:11 PM Ricardo Mendes notifications@github.com wrote:

@rahulsingh-js https://github.com/rahulsingh-js arrow functions are not merely a short-hand, they also maintain this bound to outer scope of the function.

When you do:

import DS from 'ember-data';import { computed } from '@ember/object'; export default DS.Model.extend({ fullName: computed('firstName', 'lastName', () => { return ${this.get('firstName')} ${this.get('lastName')}; }) });

You are saying that the this inside the callback is the same as the surrounding scope. In JavaScript, this is bound to the function definition, and since DS.Model.extend({}) is a function call to which an object is passed, the surrounding scope is the scope of the module. By specification, this inside a module is undefined, meaning that the above code will turn into something like:

import DS from 'ember-data';import { computed } from '@ember/object'; // this scope: module.// this value: undefined. export default DS.Model.extend({ // this scope: module. // this value: undefined.

fullName: computed('firstName', 'lastName', () => { // this scope: module. // this value: undefined.

return `${this.get('firstName')} ${this.get('lastName')}`;

}) });

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/emberjs/guides/pull/2330#issuecomment-387426191, or mute the thread https://github.com/notifications/unsubscribe-auth/ARY59DQVjUyialacXCffVCxs3LJymAbCks5twa6tgaJpZM4Tzemj .

[hellorahulsingh]

I would be happy to help

On Tue, May 8, 2018, 7:21 PM Jen Weber notifications@github.com wrote:

Hi @rahhulsingh-js, arrow functions should not be used for computed properties. This code will not work.

That said, your PRs raised three important th

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/emberjs/guides/pull/2330#issuecomment-387409158, or mute the thread https://github.com/notifications/unsubscribe-auth/ARY59Ox1Dov7iRYh9Yf8xrUKDNqIV3SPks5twaLLgaJpZM4Tzemj .