ES6 for Humans.pdf - ES6 for Humans The Latest Standard of...

This preview shows page 1 out of 148 pages.

Unformatted text preview: ES6 for Humans The Latest Standard of JavaScript: ES2015 and Beyond — Deepak Grover Hanu Prateek Kunduru ES6 for Humans The Latest Standard of JavaScript: ES2015 and Beyond Deepak Grover Hanu Prateek Kunduru ES6 for Humans Deepak Grover Delhi, India Hanu Prateek Kunduru Seattle, Washington, USA ISBN-13 (pbk): 978-1-4842-2622-3 DOI 10.1007/978-1-4842-2623-0 ISBN-13 (electronic): 978-1-4842-2623-0 Library of Congress Control Number: 2017944929 Copyright © 2017 by Deepak Grover and Hanu Kunduru This work is subject to copyright. All rights are reserved by the Publisher, whether the whole or part of the material is concerned, specifically the rights of translation, reprinting, reuse of illustrations, recitation, broadcasting, reproduction on microfilms or in any other physical way, and transmission or information storage and retrieval, electronic adaptation, computer software, or by similar or dissimilar methodology now known or hereafter developed. Trademarked names, logos, and images may appear in this book. Rather than use a trademark symbol with every occurrence of a trademarked name, logo, or image we use the names, logos, and images only in an editorial fashion and to the benefit of the trademark owner, with no intention of infringement of the trademark. The use in this publication of trade names, trademarks, service marks, and similar terms, even if they are not identified as such, is not to be taken as an expression of opinion as to whether or not they are subject to proprietary rights. While the advice and information in this book are believed to be true and accurate at the date of publication, neither the authors nor the editors nor the publisher can accept any legal responsibility for any errors or omissions that may be made. The publisher makes no warranty, express or implied, with respect to the material contained herein. Cover image by Freepik ( ) Managing Director: Welmoed Spahr Editorial Director: Todd Green Acquisitions Editor: Louise Corrigan Development Editor: James Markham Technical Reviewer: Phil Nash Coordinating Editor: Nancy Chen Copy Editor: Karen Jameson Artist: SPi Global Distributed to the book trade worldwide by Springer Science+Business Media New York, 233 Spring Street, 6th Floor, New York, NY 10013. Phone 1-800-SPRINGER, fax (201) 348-4505, e-mail [email protected], or visit . Apress Media, LLC is a California LLC and the sole member (owner) is Springer Science + Business Media Finance Inc (SSBM Finance Inc). SSBM Finance Inc is a Delaware corporation. For information on translations, please e-mail [email protected], or visit . Apress titles may be purchased in bulk for academic, corporate, or promotional use. eBook versions and licenses are also available for most titles. For more information, reference our Print and eBook Bulk Sales web page at . Any source code or other supplementary material referenced by the author in this book is available to readers on GitHub via the book’s product page, located at . For more detailed information, please visit . Printed on acid-free paper Dedicated to our parents. Without them, we wouldn’t be where we are today. Contents at a Glance About the Authors��������������������������������������������������������������������������� xiii About the Technical Reviewer��������������������������������������������������������� xv Acknowledgments������������������������������������������������������������������������ xvii ■Chapter ■ 1: Getting Started with ES6����������������������������������������������� 1 ■Chapter ■ 2: New Syntax in ES6������������������������������������������������������ 11 ■Chapter ■ 3: Destructuring�������������������������������������������������������������� 37 ■Chapter ■ 4: Classes in ES6������������������������������������������������������������� 49 ■Chapter ■ 5: Modules���������������������������������������������������������������������� 65 ■Chapter ■ 6: Symbols in ES6����������������������������������������������������������� 75 ■Chapter ■ 7: Arrays and Collections������������������������������������������������ 81 ■Chapter ■ 8: Iterators and Generators��������������������������������������������� 97 ■Chapter ■ 9: Promises in ES6�������������������������������������������������������� 109 ■Chapter ■ 10: Meta Programming������������������������������������������������� 117 ■Chapter ■ 11: Beyond ES6������������������������������������������������������������� 129 Index���������������������������������������������������������������������������������������������� 135 v Contents About the Authors��������������������������������������������������������������������������� xiii About the Technical Reviewer��������������������������������������������������������� xv Acknowledgments������������������������������������������������������������������������� xvii ■Chapter ■ 1: Getting Started with ES6����������������������������������������������� 1 ES6 The Specification������������������������������������������������������������������������������ 1 History of ECMA, ECMAScript, and JavaScript���������������������������������������� 2 One JavaScript��������������������������������������������������������������������������������������� 3 Using ES6������������������������������������������������������������������������������������������������ 4 Setting Up ES6 Using Babel and webpack���������������������������������������������� 5 Transpiling with Babel���������������������������������������������������������������������������������������������� 5 Setting Up an ES6 Boilerplate����������������������������������������������������������������������������������� 5 Adding Your Generated bundle.js script to your index.html�������������������������������������� 8 Summary����������������������������������������������������������������������������������������������� 10 ■Chapter ■ 2: New Syntax in ES6������������������������������������������������������ 11 Variable Declarations: let, const, and Block Scoping���������������������������� 11 Block Scoping with let and const��������������������������������������������������������������������������� 12 More on Temporal Dead Zones������������������������������������������������������������������������������� 14 Variables Declarations in loops������������������������������������������������������������������������������ 15 Variable Declarations with Function Parameters and Global Scope����������������������� 16 vii ■ Contents Arrow Functions������������������������������������������������������������������������������������ 17 Using Arrow Functions to Create IIFEs�������������������������������������������������������������������� 18 A Tale about this����������������������������������������������������������������������������������������������������� 19 Using Arrow Functions�������������������������������������������������������������������������������������������� 24 Default Function Parameters����������������������������������������������������������������� 25 Rest and Spread Operators������������������������������������������������������������������� 27 The Spread Operator���������������������������������������������������������������������������������������������� 29 Object Literal Extensions����������������������������������������������������������������������� 30 Template Literals and Delimiters���������������������������������������������������������������������������� 32 Tagged Template Literals���������������������������������������������������������������������������������������� 32 Summary����������������������������������������������������������������������������������������������� 35 ■Chapter ■ 3: Destructuring�������������������������������������������������������������� 37 Destructuring of Objects and Arrays����������������������������������������������������� 37 Object Destructuring Syntax����������������������������������������������������������������������������������� 38 Assignment Using Destructuring���������������������������������������������������������������������������� 40 Default Values��������������������������������������������������������������������������������������� 41 Nested Destructuring���������������������������������������������������������������������������� 42 Destructuring Using the rest Syntax����������������������������������������������������� 44 Destructured Parameters���������������������������������������������������������������������� 45 Summary���������������������������������������������������������������������������������������������� 47 ■Chapter ■ 4: Classes in ES6������������������������������������������������������������� 49 Classes in ES6��������������������������������������������������������������������������������������� 49 Defining Classes in ES6������������������������������������������������������������������������� 51 Class Declarations�������������������������������������������������������������������������������������������������� 51 Class Expressions��������������������������������������������������������������������������������������������������� 52 Class Methods and Accessor Properties����������������������������������������������� 53 Computed Method Names��������������������������������������������������������������������� 56 viii ■ Contents Class Properties and Privacy����������������������������������������������������������������� 56 Using Constructor Environments����������������������������������������������������������� 57 Using WeakMaps���������������������������������������������������������������������������������������������������� 57 Static Methods and Properties�������������������������������������������������������������� 58 Class Inheritance and the Super Keyword�������������������������������������������� 59 Inheriting Static Properties������������������������������������������������������������������� 61 Method Overriding��������������������������������������������������������������������������������� 62 Inheritable Built-Ins������������������������������������������������������������������������������� 63 Summary���������������������������������������������������������������������������������������������� 64 ■Chapter ■ 5: Modules���������������������������������������������������������������������� 65 Module Systems and a Little History����������������������������������������������������� 65 The Module Pattern in Traditional JavaScript���������������������������������������� 66 Modules in ES6�������������������������������������������������������������������������������������� 66 Exporting����������������������������������������������������������������������������������������������� 67 Default Exports������������������������������������������������������������������������������������������������������� 67 Importing����������������������������������������������������������������������������������������������� 68 Importing Default Values���������������������������������������������������������������������������������������� 69 Exporting an Imported Binding������������������������������������������������������������������������������� 70 Renaming Identifiers���������������������������������������������������������������������������������������������� 70 Loading Modules����������������������������������������������������������������������������������� 71 Modules in Web Browsers��������������������������������������������������������������������� 71 Loading Modules with <script>����������������������������������������������������������������������������� 71 Loading Modules Asynchronously in Browsers������������������������������������������������������ 72 Common Pitfalls������������������������������������������������������������������������������������ 72 Syntax��������������������������������������������������������������������������������������������������������������������� 72 Read-Only Bindings������������������������������������������������������������������������������������������������ 73 Destructing an Import Statement and Using Variables������������������������������������������� 73 ix ■ Contents Using eval( )������������������������������������������������������������������������������������������������������������ 74 Module Specifier����������������������������������������������������������������������������������������������������� 74 Summary����������������������������������������������������������������������������������������������� 74 ■Chapter ■ 6: Symbols in ES6����������������������������������������������������������� 75 Symbols������������������������������������������������������������������������������������������������� 75 Applications of Symbols����������������������������������������������������������������������������������������� 76 Symbols and Registry��������������������������������������������������������������������������� 79 Symbol.for(key)������������������������������������������������������������������������������������� 79 Symbol.keyFor(symbol)������������������������������������������������������������������������� 80 Built-In Symbols������������������������������������������������������������������������������������ 80 Summary����������������������������������������������������������������������������������������������� 80 ■Chapter ■ 7: Arrays and Collections������������������������������������������������ 81 Arrays and New Methods��������������������������������������������������������������������� 81 Array.from()������������������������������������������������������������������������������������������������������������� 81 Array.of()����������������������������������������������������������������������������������������������������������������� 83 New Array.Prototype Methods�������������������������������������������������������������������������������� 84 Typed Arrays������������������������������������������������������������������������������������������ 89 Basics of Using Typed Arrays���������������������������������������������������������������������������������� 89 Typed Arrays and Normal Arrays���������������������������������������������������������������������������� 90 Map and WeakMap�������������������������������������������������������������������������������� 91 Map������������������������������������������������������������������������������������������������������������������������� 91 WeakMap���������������������������������������������������������������������������������������������������������������� 93 Set and WeakSet����������������������������������������������������������������������������������� 94 Set�������������������������������������������������������������������������������������������������������������������������� 94 WeakSet����������������������������������������������������������������������������������������������������������������� 95 Summary���������������������������������������������������������������������������������������������� 96 x ■ Contents ■Chapter ■ 8: Iterators and Generators��������������������������������������������� 97 Iterables and Iterators��������������������������������������������������������������������������� 97 Iteration Protocols������������������������������������������������������������������������������� 100 Iterable Protocol��������������������������������������������������������������������������������������������������� 100 Iterator Protocol���������������������������������������������������������������������������������������������������� 100 Iterator as an Iterable������������������������������������������������������������������������������������������� 101 return( ) and throw( ) in Iterators��������������������������������������������������������� 102 Generators������������������������������������������������������������������������������������������� 102 Generator Function������������������������������������������������������������������������������ 103 Communicating with Generators��������������������������������������������������������� 104 Completing Early��������������������������������������������������������������������������������� 106 Summary��������������������������������������������������������������������������������������������� 108 ■Chapter ■ 9: Promises in ES6�������������������������������������������������������� 109 Promises Overview����������������������������������������������������������������������������� 109 Creating a Promise����������������������������������������������������������������������������� 110 Consuming a Promise with then( ) and catch( )����������������������������������������������������� 111 Chaining of Promises�������������������������������������������������������������������������������������������� 113 Error Handling������������������������������������������������������������������������������������������������������� 114 Combining Promises with Promises.all����������������������������������������������� 115 Summary��������������������������������������������������������������������������������������������� 116 ■Chapter ■ 10: Meta Programming������������������������������������������������� 117 Meta Programming in ES5 and ES6 Overview������������������������������������ 117 Proxies in ES6������������������������������������������������������������������������������������� 118 Traps in Proxy Handler������������������������������������������������������������������������ 119 has������������������������������������������������������������������������������������������������������������������������ 121 ownKeys��������������������������������������������������������������������������������������������������������������� 122 apply��������������������������������������������������������������������������������������������������������������������� 122 xi ■ Contents Revocable Proxy���������������������������������������������������������������������������������� 123 Reflect������������������������������������������������������������������������������������������������������������������ 125 Summary�������������������������������������������������������������������������������������������� 127 ■Chapter ■ 11: Beyond ES6������������������������������������������������������������� 129 ES2016������������������������������������������������������������������������������������������������ 129 The includes method on Arrays���������������������������������������������������������������������������� 129 The Exponentiation Operator **���������������������������������������������������������������������������� 130 ES2017����������������������������������������������������������������������������������������������������������������� 130 Asynchronous Functions�������������������������������������������������������������������������������������� 131 Atomics and Shared Memory������������������������������������������������������������������������������� 132 Object.entries() and Object.values( )��������������������������������������������������������������������� 132 padStart and padEnd�������������������������������������������������������������������������������������������� 132 Object.getOwnPropertyDescriptors( )�������������������������������������������������������������������� 133 Trailing Commas in Function Parameter lists & calls������������������������������������������� 134 Summary��������������������������������������������������������������������������������������������� 134 Index���������������������������������������������������������������������������������������������� 135 xii About the Authors Deepak Grover is a software architect from India, who has been helping several startups grow and build scalable products. He holds a Master’s degree in Software Engineering and has been programming for the past...
View Full Document

  • Left Quote Icon

    Student Picture

  • Left Quote Icon

    Student Picture

  • Left Quote Icon

    Student Picture