ES6 Arrow Functions

node v4.9.1
version: 2.0.0
endpointsharetweet
Arrow functions (also known as fat arrow functions) have a shorter syntax compared to traditional function expressions and lexically bind the this value. Arrow functions are also always anonymous. Here we are using the shortest form, where the body is a simple expression and we can drop the parenthesis around the parameter since there is only one:
var numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; // Same as function(number) { return number * 2 } var doubled = numbers.map(number => number * 2);
If we want multiple parameters, we can add the parenthesis and curly braces back:
// Same as function(runningTotal, number) { return runningTotal + number } var sum = numbers.reduce((runningTotal, number) => runningTotal + number, 0);
Finally, more complex multistatement arrow functions can use curly braces:
// Here all we're really saving is the function() heading. numbers.map(number => { if (number % 3 == 0 && number % 5 === 0) return "Fizz Buzz"; if (number % 3 === 0) return "Fizz"; if (number % 5 === 0) return "Buzz"; return number; }).join("<br/>")
Arrow functions can also make your code less complex since they'll use the "this" of the surrounding scope, instead of introducing their own. This means you can avoid having to bind in many cases:
var cart = { items: [], addItem: function(anItem) { console.log("Added " + anItem + "!"); this.items.push(anItem); }, addAll: function(newItems) { // Before we'd have to do (function(anItem) { this.addItem(anItem) }).bind(this) newItems.forEach(anItem => this.addItem(anItem)); } } cart.addAll(["pickels", "tomatoes", "cheese"])
To learn more about arrow functions, check out https://hacks.mozilla.org/2015/06/es6-in-depth-arrow-functions/ Some of these examples and explanations originally taken and modified from: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions https://github.com/lukehoban/es6features#arrows https://en.wikipedia.org/wiki/Fizz_buzz
Loading…

23 comments

  • posted 2 years ago by araid-en10
    What tool root #q
  • posted 2 years ago by kevitalin39
    Tool root #q
  • posted 2 years ago by adrieljaredtubong
    Good
  • posted 2 years ago by jackpot1136
    I have to say thank you for your help.
  • posted a year ago by comyoussef
    Goood
  • posted a year ago by sherrielee
    Please can you help i dont understand this its not working
  • posted a year ago by doge344
    Doge1223
  • posted a year ago by shenk0786
    Please help on this
  • posted a year ago by stsl
    чудово
  • posted a year ago by tamu18115
    automobileservices.org
  • posted a year ago by chatjan0922
    KASITHBK
  • posted a year ago by nelson1576
    Please help me out
  • posted a year ago by 5b899289de269400127763f4
    Ayuda por fabor
  • posted 10 months ago by cashcashn
    I can't figure out guys umm umm
  • posted 10 months ago by sohelshaikh5465
    Sohel shaikh 5465
  • posted 9 months ago by viloka
    I need some helping hands here
  • posted 7 months ago by anspage
    @anspage
  • posted 7 months ago by dgb
    MU
  • posted 6 months ago by murdy
    Murdy
  • posted 5 months ago by malayanhac
    good morning to all SIFU And MahaGuru, i dont know what the mission today, malaysia amex huntersWas RIP.
  • posted 3 months ago by because67
    How do I delete this account
  • posted a month ago by wow
    https://github.com/password_reset/AJHZT4HTEQ44HWJUPPFXN7K47TMYTA5FMVWWC2LMWNTW6ZDZM5XW63DFIBTW2YLJNQXGG33NUVTG64TDMXBLG5DXN5PWMYLDORXXEX3WMVZGSZTJMVSME
  • posted 23 days ago by ultraprecisekamal
    ()=>`Thank you runkit team`

sign in to comment