Skip to content
This repository has been archived by the owner on May 26, 2019. It is now read-only.

Use es5 getters #2305

Closed
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 1 addition & 2 deletions source/applications/dependency-injection.md
Original file line number Diff line number Diff line change
Expand Up @@ -250,8 +250,7 @@ export default Component.extend({
}),

click() {
let player = this.get('audioService');
player.play(this.get('song.file'));
this.audioService.play(this.get('song.file'));
}
});
```
2 changes: 1 addition & 1 deletion source/applications/run-loop.md
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ let User = EmberObject.extend({
lastName: null,

fullName: computed('firstName', 'lastName', function() {
return `${this.get('firstName')} ${this.get('lastName')}`;
return `${this.firstName} ${this.lastName}`;
})
});
```
Expand Down
4 changes: 2 additions & 2 deletions source/configuring-ember/disabling-prototype-extensions.md
Original file line number Diff line number Diff line change
Expand Up @@ -120,13 +120,13 @@ import { computed } from '@ember/object';

// This won't work:
fullName: function() {
return `${this.get('firstName')} ${this.get('lastName')}`;
return `${this.firstName} ${this.lastName}`;
}.property('firstName', 'lastName')


// Instead, do this:
fullName: computed('firstName', 'lastName', function() {
return `${this.get('firstName')} ${this.get('lastName')}`;
return `${this.firstName} ${this.lastName}`;
})
```

Expand Down
2 changes: 1 addition & 1 deletion source/models/defining-models.md
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ export default DS.Model.extend({
lastName: DS.attr(),

fullName: computed('firstName', 'lastName', function() {
return `${this.get('firstName')} ${this.get('lastName')}`;
return `${this.firstName} ${this.lastName}`;
})
});
```
Expand Down
2 changes: 1 addition & 1 deletion source/models/relationships.md
Original file line number Diff line number Diff line change
Expand Up @@ -174,7 +174,7 @@ import PaymentMethod from './payment-method';

export default PaymentMethod.extend({
last4: DS.attr(),

obfuscatedIdentifier: computed('last4', function () {
return `**** **** **** ${this.get('last4')}`;
})
Expand Down
20 changes: 10 additions & 10 deletions source/object-model/classes-and-instances.md
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ import EmberObject from '@ember/object';

const Person = EmberObject.extend({
say(thing) {
alert(`${this.get('name')} says: ${thing}`);
alert(`${this.name} says: ${thing}`);
}
});

Expand Down Expand Up @@ -100,7 +100,7 @@ import EmberObject from '@ember/object';

const Person = EmberObject.extend({
say(thing) {
alert(`${this.get('name')} says: ${thing}`);
alert(`${this.name} says: ${thing}`);
}
});

Expand All @@ -117,7 +117,7 @@ import EmberObject from '@ember/object';

const Person = EmberObject.extend({
helloWorld() {
alert(`Hi, my name is ${this.get('name')}`);
alert(`Hi, my name is ${this.name}`);
}
});

Expand Down Expand Up @@ -152,7 +152,7 @@ import EmberObject from '@ember/object';

const Person = EmberObject.extend({
init() {
alert(`${this.get('name')}, reporting for duty!`);
alert(`${this.name}, reporting for duty!`);
}
});

Expand Down Expand Up @@ -180,14 +180,14 @@ const Person = EmberObject.extend({
Person.create({
name: 'Stefan Penner',
addItem() {
this.get('shoppingList').pushObject('bacon');
this.shoppingList.pushObject('bacon');
}
});

Person.create({
name: 'Robert Jackson',
addItem() {
this.get('shoppingList').pushObject('sausage');
this.shoppingList.pushObject('sausage');
}
});

Expand All @@ -209,14 +209,14 @@ const Person = EmberObject.extend({
Person.create({
name: 'Stefan Penner',
addItem() {
this.get('shoppingList').pushObject('bacon');
this.shoppingList.pushObject('bacon');
}
});

Person.create({
name: 'Robert Jackson',
addItem() {
this.get('shoppingList').pushObject('sausage');
this.shoppingList.pushObject('sausage');
}
});

Expand All @@ -241,9 +241,9 @@ const Person = EmberObject.extend({

let person = Person.create();

person.get('name'); // 'Robert Jackson'
person.name; // 'Robert Jackson'
person.set('name', 'Tobias Fünke');
person.get('name'); // 'Tobias Fünke'
person.name; // 'Tobias Fünke'
```

Make sure to use these accessor methods; otherwise, computed properties won't
Expand Down
13 changes: 6 additions & 7 deletions source/object-model/computed-properties-and-aggregate-data.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,8 +25,7 @@ export default Component.extend({
},

titles: computed('todos.[]', function() {
let todos = this.get('todos');
return todos.mapBy('title');
return this.todos.mapBy('title');
})
});
```
Expand Down Expand Up @@ -66,7 +65,7 @@ export default Component.extend({
},

incomplete: computed('todos.@each.isDone', function() {
let todos = this.get('todos');
let todos = this.todos;
return todos.filterBy('isDone', false);
})
});
Expand Down Expand Up @@ -204,7 +203,7 @@ import EmberObject, { computed } from '@ember/object';

const Hamster = EmberObject.extend({
excitingChores: computed('chores.[]', function() {
return this.get('chores').map(function(chore, index) {
return this.chores.map(function(chore, index) {
return `CHORE ${index}: ${chore.toUpperCase()}!`;
});
})
Expand All @@ -214,9 +213,9 @@ const hamster = Hamster.create({
chores: ['clean', 'write more unit tests']
});

hamster.get('excitingChores'); // ['CHORE 1: CLEAN!', 'CHORE 2: WRITE MORE UNIT TESTS!']
hamster.get('chores').pushObject('review code');
hamster.get('excitingChores'); // ['CHORE 1: CLEAN!', 'CHORE 2: WRITE MORE UNIT TESTS!', 'CHORE 3: REVIEW CODE!']
hamster.excitingChores; // ['CHORE 1: CLEAN!', 'CHORE 2: WRITE MORE UNIT TESTS!']
hamster.chores.pushObject('review code');
hamster.excitingChores; // ['CHORE 1: CLEAN!', 'CHORE 2: WRITE MORE UNIT TESTS!', 'CHORE 3: REVIEW CODE!']
```

By comparison, using the computed macro abstracts some of this away:
Expand Down
34 changes: 17 additions & 17 deletions source/object-model/computed-properties.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,8 +20,8 @@ Person = EmberObject.extend({
lastName: null,

fullName: computed('firstName', 'lastName', function() {
let firstName = this.get('firstName');
let lastName = this.get('lastName');
let firstName = this.firstName;
let lastName = this.lastName;

return `${firstName} ${lastName}`;
})
Expand All @@ -32,7 +32,7 @@ let ironMan = Person.create({
lastName: 'Stark'
});

ironMan.get('fullName'); // "Tony Stark"
ironMan.fullName; // "Tony Stark"
```

This declares `fullName` to be a computed property, with `firstName` and `lastName` as the properties it depends on.
Expand All @@ -44,7 +44,7 @@ Changing any of the dependent properties causes the cache to invalidate, so that

A computed property will only recompute its value when it is _consumed._ Properties are consumed in two ways:

1. By a `get`, for example `ironMan.get('fullName')`
1. By a `get`, for example `ironMan.fullName`
2. By being referenced in a handlebars template that is currently being rendered, for example `{{ironMan.fullName}}`

Outside of those two circumstances the code in the property will not run, even if one of the property's dependencies are changed.
Expand All @@ -57,8 +57,8 @@ import Ember from 'ember':
fullName: computed('firstName', 'lastName', function() {
console.log('compute fullName'); // track when the property recomputes
let firstName = this.get('firstName');
let lastName = this.get('lastName');
let firstName = this.firstName;
let lastName = this.lastName;

return `${firstName} ${lastName}`;
})
Expand All @@ -74,11 +74,11 @@ let ironMan = Person.create({
lastName: 'Stark'
});

ironMan.get('fullName'); // 'compute fullName'
ironMan.fullName; // 'compute fullName'
ironMan.set('firstName', 'Bruce') // no console output

ironMan.get('fullName'); // 'compute fullName'
ironMan.get('fullName'); // no console output since dependencies have not changed
ironMan.fullName; // 'compute fullName'
ironMan.fullName; // no console output since dependencies have not changed
```


Expand Down Expand Up @@ -131,11 +131,11 @@ Person = EmberObject.extend({
country: null,

fullName: computed('firstName', 'lastName', function() {
return `${this.get('firstName')} ${this.get('lastName')}`;
return `${this.firstName} ${this.lastName}`;
}),

description: computed('fullName', 'age', 'country', function() {
return `${this.get('fullName')}; Age: ${this.get('age')}; Country: ${this.get('country')}`;
return `${this.fullName}; Age: ${this.age}; Country: ${this.country}`;
})
});

Expand All @@ -146,7 +146,7 @@ let captainAmerica = Person.create({
country: 'USA'
});

captainAmerica.get('description'); // "Steve Rogers; Age: 80; Country: USA"
captainAmerica.description; // "Steve Rogers; Age: 80; Country: USA"
```

### Dynamic updating
Expand All @@ -157,7 +157,7 @@ Let's use computed properties to dynamically update.
```javascript
captainAmerica.set('firstName', 'William');

captainAmerica.get('description'); // "William Rogers; Age: 80; Country: USA"
captainAmerica.description; // "William Rogers; Age: 80; Country: USA"
```

So this change to `firstName` was observed by `fullName` computed property, which was itself observed by the `description` property.
Expand All @@ -179,7 +179,7 @@ Person = EmberObject.extend({

fullName: computed('firstName', 'lastName', {
get(key) {
return `${this.get('firstName')} ${this.get('lastName')}`;
return `${this.firstName} ${this.lastName}`;
},
set(key, value) {
let [firstName, lastName] = value.split(/\s+/);
Expand All @@ -193,8 +193,8 @@ Person = EmberObject.extend({

let captainAmerica = Person.create();
captainAmerica.set('fullName', 'William Burnside');
captainAmerica.get('firstName'); // William
captainAmerica.get('lastName'); // Burnside
captainAmerica.firstName; // William
captainAmerica.lastName; // Burnside
```

### Computed property macros
Expand All @@ -212,7 +212,7 @@ Person = EmberObject.extend({
fullName: 'Tony Stark',

isIronManLongWay: computed('fullName', function() {
return this.get('fullName') === 'Tony Stark';
return this.fullName === 'Tony Stark';
}),

isIronManShortWay: equal('fullName', 'Tony Stark')
Expand Down
4 changes: 2 additions & 2 deletions source/object-model/enumerables.md
Original file line number Diff line number Diff line change
Expand Up @@ -185,7 +185,7 @@ let people = [
Person.create({ name: 'Majd', isHappy: false })
];

people.every((person, index, self) => person.get('isHappy'));
people.every((person, index, self) => person.isHappy);

//=> false
```
Expand All @@ -195,7 +195,7 @@ you can use the [`any()`](https://emberjs.com/api/ember/release/classes/MutableA


```javascript
people.any((person, index, self) => person.get('isHappy'));
people.any((person, index, self) => person.isHappy);

//=> true
```
Expand Down
10 changes: 5 additions & 5 deletions source/object-model/observers.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,12 +22,12 @@ Person = EmberObject.extend({
lastName: null,

fullName: computed('firstName', 'lastName', function() {
return `${this.get('firstName')} ${this.get('lastName')}`;
return `${this.firstName} ${this.lastName}`;
}),

fullNameChanged: observer('fullName', function() {
// deal with the change
console.log(`fullName changed to: ${this.get('fullName')}`);
console.log(`fullName changed to: ${this.fullName}`);
})
});

Expand All @@ -37,7 +37,7 @@ let person = Person.create({
});

// observer won't fire until `fullName` is consumed first
person.get('fullName'); // "Yehuda Katz"
person.fullName; // "Yehuda Katz"
person.set('firstName', 'Brohuda'); // fullName changed to: Brohuda Katz
```

Expand All @@ -58,7 +58,7 @@ Person.reopen({
// The observer depends on lastName and so does fullName. Because observers
// are synchronous, when this function is called the value of fullName is
// not updated yet so this will log the old value of fullName
console.log(this.get('fullName'));
console.log(this.fullName);
})
});
```
Expand Down Expand Up @@ -96,7 +96,7 @@ Person.reopen({
processFullName() {
// This will only fire once if you set two properties at the same time, and
// will also happen in the next run loop once all properties are synchronized
console.log(this.get('fullName'));
console.log(this.fullName);
}
});

Expand Down
2 changes: 1 addition & 1 deletion source/routing/preventing-and-retrying-transitions.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ import Route from '@ember/routing/route';
export default Route.extend({
actions: {
willTransition(transition) {
if (this.controller.get('userHasEnteredData') &&
if (this.controller.userHasEnteredData &&
!confirm('Are you sure you want to abandon progress?')) {
transition.abort();
} else {
Expand Down
8 changes: 4 additions & 4 deletions source/testing/testing-controllers.md
Original file line number Diff line number Diff line change
Expand Up @@ -65,17 +65,17 @@ module('Unit | Controller | posts', function(hooks) {
let controller = this.owner.lookup('controller:posts');

// check the properties before the action is triggered
assert.equal(controller.get('propA'), 'You need to write tests', 'propA initialized');
assert.equal(controller.get('propB'), 'And write one for me too', 'propB initialized');
assert.equal(controller.propA, 'You need to write tests', 'propA initialized');
assert.equal(controller.propB, 'And write one for me too', 'propB initialized');

// trigger the action on the controller by using the `send` method,
// passing in any params that our action may be expecting
controller.send('setProps', 'Testing Rocks!');

// finally we assert that our values have been updated
// by triggering our action.
assert.equal(controller.get('propA'), 'Testing is cool', 'propA updated');
assert.equal(controller.get('propB'), 'Testing Rocks!', 'propB updated');
assert.equal(controller.propA, 'Testing is cool', 'propA updated');
assert.equal(controller.propB, 'Testing Rocks!', 'propB updated');
});
});
```
Expand Down
2 changes: 1 addition & 1 deletion source/testing/unit-testing-basics.md
Original file line number Diff line number Diff line change
Expand Up @@ -109,7 +109,7 @@ export default EmberObject.extend({

calc() {
this.incrementProperty('count');
let count = this.get('count');
let count = this.count;

return `count: ${count}`;
}
Expand Down
Loading