top | item 9739297

(no title)

towelguy | 10 years ago

They are a compact way to write anonymous functions in Javascript, so instead of

    var square = function (a) { return a * a;}
You can write:

    var square = a => a * a;

discuss

order

eueueu|10 years ago

So basically, a useless hipster fashion lead fluffy syntax change, which mainly makes code harder to read, and makes typos more common.

  // foo takes a function, and a boolean.
  // foo(a=>7, a>=2);
Really? That's easy to read is it? Eugh count me out.

phs2501|10 years ago

Verbosity is not clarity.

    list.map(function(x) { return x * 2; });
verses

    list.map(x => x * 2);
The actual functionality of the first is swallowed in visual noise (function, return). Yes, it's something new to learn for Javascript programmers, but it's useful and makes the meaning of code clearer.

That's not even touching on the this-binding element, which is also incredibly useful in common Javascript code.

photokandy|10 years ago

I've been doing ES6 for several months now. Not once have I mistook `=>` for `>=`. Not once have I made a typo when I wanted an arrow function.

Of course any syntax can be abused in such a way to create ugly code. But if I compare

    [1, 2, 3].map( a => a * a );  // [1, 4, 9]
to

    [1, 2, 3].map(function(a) { return a * a; });
I prefer the former. It's more concise, and strips off a lot of visual noise, and I think it's more readable (the intent isn't wrapped in lots of boilerplate).

That doesn't mean one can't write horrible code with the arrow form. Of course you can. Furthermore, it's not necessarily something you should use all the time, because it's not completely analogous to a normal `function` because it binds `this` lexically. Which means `function` isn't going away any time soon, especially if you need to bind them dynamically.

In short: use the best (syntactic) tool for the job. There are use cases where the arrow makes sense semantically, and there are cases where it doesn't. Use as appropriate, as one should always do.

jahewson|10 years ago

Actually that code example is hard to read because your variables are called 'foo' and 'a' and you've chosen not to include white space around your operators.

The lambda function is a foundational construct in computer science (1936), and it is often written using an arrow. Hipster fluff it is not.

gfodor|10 years ago

You are trolling, but arrow functions (unlike those defined with the function keyword) also bind this to that of the enclosing scope. The results in more intuitive behavior in most cases and less explicit bindings.

spion|10 years ago

Here are some fun counter-examples

  let sqr = x => Math.pow(x, 2)

  let property = name => obj => obj[name]

  let distance = p1 => p2 => Math.sqrt(sqr(p2.x - p1.x) + sqr(p2.y - p1.y))

  let byComparing = f => (x, y) => {
    let fx = f(x), fy = f(y)
    fx < fy ? -1 : fx > fy ? 1 : 0
  }
  
  let points = [{x: 1, y: 2}, ...]
  
  let byX = points.slice().sort(byComparing(property('x'))
  
  let byStartDistance = points.slice().sort(byComparing(distance({x: 0, y: 0}))

ajanuary|10 years ago

The syntax isn't new, and people haven't had issues with it in other languages.

jonesetc|10 years ago

Your parent post skimmed over an important detail, it's not just a new syntax, it's new type of anonymous function with a new type of scope. It's more like:

function(arg) {statement;}.bind(this)

towelguy|10 years ago

Yeah like the others said it binds this to the scope where it was defined. So something like this works as one would expect:

    setTimeout(() => this.someMethod(), 1000);