Upgrade to Pro — share decks privately, control downloads, hide ads and more …

How ECMAScript6 can change your life

How ECMAScript6 can change your life

This presentation contains some content of "How ECMAScript6 can change your life"

Surbhi Agarwal

August 22, 2016
Tweet

Other Decks in Programming

Transcript

  1. HOW ECMASCRIPT6 CAN CHANGE YOUR LIFE…

    View Slide

  2. What is ECMAScript 6?
    ECMAScript 6, also known as ECMAScript 2015, is the
    latest version of the ECMAScript standard

    View Slide

  3. History
     1995 – JavaScript
     1997 – ECMAScript 1
     2009 – ECMAScript 5
     2015 – ECMAScript 6
    ECMA - European Computer Manufacturers Association

    View Slide

  4. What you should already know?
     JavaScript
     HTML
     CSS
     Object Oriented Programming for Classes

    View Slide

  5. ES6 Browser Support
     Currently ES6 is not supported completely
     Most of the features of ES5 are supported by all browsers
     Conversion from ES6 to ES5 required
     Babel
    Babel is a essentially an ECMAScript 6 to ECMAScript 5 compiler. It allows you to use ES6 features in
    your projects and then compiles ES5 for you to use in production.

    View Slide

  6. Features in ECMA Script 6
     New keywords for declaring variables
     let
     const
     Spread Operator
     For functions:
     Default parameters
     Arrow functions
     Classes

    View Slide

  7.  ‘let’ allows you to declare variables
     limits the scope to block, statement, or expression on which
    it is used
    ‘let’ keyword

    View Slide

  8.  ‘const’ creates a read-only reference to a value
     variable identifier cannot be reassigned
     Does NOT mean the value it holds is immutable
    ‘const’ keyword

    View Slide

  9. ‘let’ & ‘const’ Keywords

    View Slide

  10.  allows an expression to be expanded
     works with:
     multiple arguments (for function calls)
     multiple elements (for array literals)
     multiple variables (for de structuring assignment)
    ‘Spread’ operator (…)

    View Slide

  11. ‘Spread’ Operator(…)

    View Slide

  12.  allow formal parameters to be initialized with default values if
    no value or undefined is passed
    Default Function Parameters

    View Slide

  13. Default Function Parameters

    View Slide

  14.  also known has “Fat Arrow Functions” and are always
    anonymous
     has a shorter syntax compared to function expressions
     make the JS code more readable
    Arrow Functions (=>)

    View Slide

  15. Arrow Functions (=>)

    View Slide

  16.  introduced in ECMAScript 6
     provide a much simpler and clearer syntax to create objects and
    deal with inheritance
     NOT introducing a new object-oriented inheritance model to JS
    Classes

    View Slide

  17. Classes

    View Slide

  18. Road Ahead

    View Slide

  19. Queries?

    View Slide

  20. Thank you! See you Again Soon 
    “Success is that height of fame, where everyone in this
    world knows you by name”
    -Surbhi Agarwal
    https://in.linkedin.com/in/agarwalsurbhi
    @surbhiagarwal13

    View Slide