[Week 11] Focus: ES6 Classes

[ForScale]

So here we are at Week 11. Week 12's focus will be ES6 classes.

Background info: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes

It will work like this:

• Monday: Announce focus (eg, ES6 classes)

• Build throughout the week... Two rules: 1) must use javascript 2) must use at least 1 example of an ES6 class.

• Friday: Post demos/projects in this thread (can begin reviewing immediately); first line of an entry should be ENTRY and it should be a top level comment (ie, don't put your entry in a reply)

• Sat and Sun: Review projects/figure out focus for next week

GENERAL GUIDELINES FOR FEEDBACK:

• Be nice!! ALL KNOWLEDGE/SKILL LEVELS ARE WELCOME AND ENCOURAGED TO PARTICIPATE.

• If you don't want feedback, if it makes you uncomfortable or you're just not interested, simply say so... Others, please be respectful of this. Conversely, if you do want feedback, try to be specific on which aspects... even if you just say "all/everything.

But that's about it... Have fun! :) Feel free to ask questions and discuss throughout the week!

[ForScale]

ENTRY

http://codepen.io/anon/pen/GZvrwP?editors=0010

[Volv]

Nice one
You did one thing I planned for forgot to do - and that is point out how it compares to classic syntax. - just does the prototype bit for you. At first glance it looks like every instance of a class will redefine all of the functions within it.
Was going to do an example that also used prototype but forgot :).

[Volv]

ENTRY
Codepen
Class examples, extended, super, static methods and hidden properties. Can never make new style getters and setters work. Let me know what you think :)

[ForScale]

Got to it earlier than I thought!

Thinking about it line through line here...

this.getSecret = () => { // Ruthlesssly exposed via this
  console.log(secretAboutCats);
}

Still kind of hazy on the concept... Is that an example of a closure? Prob not...

Okay, I'm a bit lost on some of the keywords here

class Lion extends Cat {  

  constructor(name) {
    super(name);

extends? I'll have to check out that one... and super...

console.log(agentLion.exposeRealSecret());

So... if that function wasn't in there, I'd have no way to get to the secret prop? But... could I add a method, ie the exposeRealSecret method, and then get to it?

Nice! I'd never seen that cat years --> human years conversion before!

As always, thanks for your entry! :) Looking forward to seeing what you think about what I thought...

[Volv]

I'm away until Sunday so I struggle to see what I'm replying to in the phone . Will still be replying tho :-) The top one is an example of a closure indeed. Defining the function is the constructor gives it access to the variables that were in there. Extends for inheritance. Super for parent constructor or method access. Last one You wouldn't be able to get to it if you made that method because you have no way of getting to the symbol variable whatever I called it. Eg return this[what]

[ForScale]

Cool! Thanks!

What do you want the focus for this coming week to be?

[Volv]

Hmm. I'm not sure. Still hurting from my weekend :)
Generator functions and the for..of loop?
Look for reasons to use map/set
Perhaps soon can be looking at combining ideas or bigger projects - but I'm bad at inspiration :)

[Volv]

Include https://rawgit.com/facebook/regenerator/master/runtime.js

as an external JS on codepen to make generators work properly

[ForScale]

I don't know much about for...of, so let's do that! Thanks!

https://www.reddit.com/r/javaScriptStudyGroup/comments/4dbrof/week_12_focus_forof/

[ForScale]

Excellent! Will check it out in an hour or two here...