educative.io

JavaScript In Practice: ES6 And Beyond (Zsolt Nagy)


Function Scope, Block Scope, Constants - Constants introduction to Javascript constants; potential errors, such as the temporal dead zone Function Scope, Block Scope, Constants - let, const, and var the use case of let, const and var; avoiding errors, such as the temporal dead zone, and using a linter Arrow Functions - Fat Arrow Syntax introduction to fat arrow syntax and its advantages Symbols - Symbols as Semi-Private Property Keys advantages of making object properties private, its drawbacks and use cases Sets, Maps, and their Weak Versions - Iterating Sets set traversal using the forEach method and for…of loop Classes - Creating Abstract Classes introduction to an abstract class and its implementation using a stock trading example Classes - Shadowing Redefining methods of the parent class in a child class. The for-of loop - Introducing the for-of loop Javascript syntax for the for-of loop Iterators and Generators in Depth - Iterables and Iterators introduction to Iterables and Iterators and their behavior in Javascript Default Arguments - The ES6 way default values and using a variable number of arguments in functions Objects in ES6 - Exercise on Objects in ES6 Now, we’ll create a “Basket” object using all the concepts we have learned in this section. Symbols - Symbol symbol - a new ES6 primitive type and its use cases Classes - Prototypal Inheritance prototype-based inheritance and the introduction to classes in ES6 Tail Call Optimization and Other Function Features in ES6 - new.target using new.target inside constructors Classes - Super introduction to the super keyword and its importance in classes that inherit from a parent class Objects in ES6 - Equality equality in JavaScript ES5 using ‘==’ and ‘===’; and introduction to the Object.is() method in ES6, which is very similar to ‘===’ Destructuring - Object Property - Shorthand Notation introduction to destructuring in ES5 and its equivalent notation in ES6 Destructuring - Exercise on Destructuring Let’s try writing a few destructuring assignments and see how they simplify our code. Good luck! Sets, Maps, and their Weak Versions - ES6 Sets set functions and their usage Objects in ES6 - Computed Object Keys using string keys to access their corresponding objects, and behavior of the toString method in Javascript Destructuring - Deeper Destructuring, destructuring functions, and pitfalls using default values and assigning undefined in destructuring The for-of loop - Destructuring and the DOM in the for-of loop the syntax of destructuring in the for-of loop using examples Iterators and Generators in Depth - Generators comparison between generators and regular functions, use case of a generator String and Template Literals - Introduction the importance of learning strings and template literals Symbols - Creating enum Types a brief introduction to enum types and their syntax Classes - Prototypal Inheritance in ES5 introduction to prototypal inheritance using an example (rectangle “is a” shape) String and Template Literals - Template Literals introduction to template literals and its usage The Reflect API - Reflection introduction to reflection and using the method <code>Reflect.apply</code> Symbols - Well-known Symbols name clashes occurring in objects and how to avoid them using Symbols Sets, Maps, and their Weak Versions - Weak Maps weak maps and their behavior in Javascript Classes - Getters and Setters introduction to getters and setters, and their advantages Iterators and Generators in Depth - Passing Parameters to Iterables using yield* expression to delegate to another iterable object Sets, Maps, and their Weak Versions - Iterating Maps the various ways to traverse a Map Configuring ES6 with Webpack - Step 3: Account Module Have questions about Step 3: Account Module? Go for it! The for-of loop - Exercise on the for-of loop We will use the for-of loop to search through data and obtain our desired values. Configuring ES6 with Webpack - The Task Write a simple ES6 module, and run the code using Webpack. Spread Operator and Rest Parameters - Destructuring with the Spread Operator destructuring in Javascript using spread operator, and it’s comparison with destructuring using the rest parameter Default Arguments - Exercise on Default Arguments It’s time to play with function arguments. These exercises build further upon what we learned in the previous lesson. Sets, Maps, and their Weak Versions - Exercise on Sets, Maps, and their Weak Versions We will use Sets and Maps to perform various operations on arrays, shapes and sets. String and Template Literals - Tagged Templates the ins and outs of tagged templates using a literalFragments array, and the tag &amp; format functions Iterators and Generators in Depth - The Role of the Iterable Interface understand iterators and their data flow, create independent iterators and connect the dots using ES6 Configuring ES6 with Webpack - Step 1: index.html Have questions about Step 1: index.html? Go for it! ES6 Promises - Creating Promises in ES6 creating promises and resolving/rejecting them using the ‘resolve’ and ‘reject’ keywords Arrow Functions - Exercise on Arrow Functions You will be writing and modifying function declarations using the arrow syntax. Iterators and Generators in Depth - Exercise on Iterators and Generators We will play around with Iterators and Generators to get a deeper understanding of how they work. String and Template Literals - New String Methods built-in Javascript methods to parse strings and analyze them, along with examples Sets, Maps, and their Weak Versions - Data Structures 101 introduction to sets and maps in Javascript Classes - Static Methods introduction to static methods in Javascript ES6 Promises - Handling Multiple Promises using the promise.all( ) function to handle multiple promises The Reflect API - Creating Objects Reflect.construct and its behavior Tail Call Optimization and Other Function Features in ES6 - Stacks introduction to stacks and stack size limits in Javascript Destructuring - Destructuring Examples destructuring, associativity and ES6 notation Symbols - Exercise on Symbols The exercises below will give you a deeper understanding of symbol along with the pros and cons of using them. Sets, Maps, and their Weak Versions - Weak Sets introduction to weak sets, their usage and comparison with regular sets Objects in ES6 - Shorthand for Defining Operations in Objects ‘Concise method syntax’ - a new feature of ES6 Classes - Inheritance - The ES6 way inheritance in ES6, accessing constructors and other class methods at various places in the code, introduction to concise method syntax and Javascript code conventions Default Arguments - Hacks in ES5 optional function arguments and their replacement, limitations of ES5 shortcuts The for-of loop - UTF-32 support Unicode character support of ES6 and comparison between the for-of and for-in loops Iterators and Generators in Depth - Consuming Iterables iterating an iterable object and an introduction to data consumers Classes - Exercise on Classes We’ll apply our knowledge of classes to a video game model in which we there are two types of characters. Tail Call Optimization and Other Function Features in ES6 - Name Property name property in ES5 and its limitations String and Template Literals - Better Unicode Support handling Unicode strings in ES5 and its alternative in ES6: using the for-of loop and spread operator to process characters Symbols - Global Symbol Registry relationship between symbol values and their string keys Sets, Maps, and their Weak Versions - ES6 Maps introduction to maps and their methods Objects in ES6 - Shorthand for Creating and Destructuring Objects objects using pre-defined variables during initialization String and Template Literals - Exercise on String and Template Literals Practice your string and template literals by printing an array in a tabular format, manipulating strings, printing emojis, and playing with if-else clauses. Spread Operator and Rest Parameters - Rest Parameters introduction to rest parameters, calling functions with a variable number of arguments and its potential errors Spread Operator and Rest Parameters - Spread Operator an introduction to spread operator, limitations of rest parameter and their solution using the spread parameter Your Final Exam: ES6 Job Interview Questions - Ten JavaScript Theory Questions These are popular conceptual questions asked in JavaScript interviews. Iterators and Generators in Depth - Practical Applications infinite sequences, code that is evaluated lazily and asynchronous programming Configuring ES6 with Webpack - Step 5: Compile and Run the Application Have questions about Step 5: Compile and Run the Application? Go for it! Your Final Exam: ES6 Job Interview Questions - Writing an Array Extension Write a function that creates a palindrome of any array. ES2017 - New Object Extensions Object.entries, Object.values, Object.getOwnPropertyDescriptors Your Final Exam: ES6 Job Interview Questions - Pomodoro App Markup and Styling Refactoring You will now improve the appearance and functionality of the app created in the last lesson. ES2017 - New String Extensions padding in strings for alignment The Reflect API - Property Access and Modification access, modify (update and delete) properties of Objects Your Final Exam: ES6 Job Interview Questions - Countdown Timer Integration in the Pomodoro App The final step of the Pomodoro App: Add a timer to the selected task. Iterators and Generators in Depth - Built-in Iterables built-in iterables explained using examples Proxies in Practice - Defining Proxies solve fundamental operations (like property lookup, assignment, enumeration, function invocation, etc.) using proxies Iterators and Generators in Depth - Generators and Iterators generators returning Iterators that are also Iterables Your Final Exam: ES6 Job Interview Questions - Video Player Create a web video player in which you can alter playback speed and skip forward/backward. ES6 Promises - Exercise on ES6 Promises In the following exercises, we will practice promises by handling success and failure in data retrieval. ES2016 - Array `includes` using the includes method to process elements in an array Your Final Exam: ES6 Job Interview Questions - Introduction This bonus section is a collection of helpful job interview questions related to ES6. Be sure to take a look. Configuring ES6 with Webpack - Step 4: Create the Entry Point Have questions about Step 4: Create the Entry Point? Go for it! ES6 Promises - Promise States pending, fulfilled and rejected states of Promises Your Final Exam: ES6 Job Interview Questions - Pomodoro APP to Kanban Board Using Kanban to categorize the tasks in our app according to days of the week. Your Final Exam: ES6 Job Interview Questions - Insert the Timer Module in the Pomodoro App In order to integrate the timer into our application, we’ll need to import it. Proxies in Practice - Use Cases automated testing, building fake servers for development, making memorization proxies, establishing a logging layer, controlling client-side validation and handling access rights Iterators and Generators in Depth - Combining Generators using the yield method to combine multiple sequences in one iterable The Reflect API - Manipulating Prototypes getting and setting prototypes of objects using the Reflect API Iterators and Generators in Depth - Iterators and Destructuring destructuring using iterators and their behavior ES6 Promises - Handling the Fulfilled or Rejected States ‘then’, ‘onFulfilled’ and ‘onRejected’ methods Your Final Exam: ES6 Job Interview Questions - Dragging and Dropping Cards Shift cards around by dragging and dropping. Iterators and Generators in Depth - Iterables with Sets and Maps using the entries, keys and values methods to play with iterables of keys or values Your Final Exam: ES6 Job Interview Questions - Memoization A theoretical question about the pros and cons of memoization. Your Final Exam: ES6 Job Interview Questions - Stopwatch A countdown timer with ‘start’, ‘pause’ and ‘reset’ functionality. Proxies in Practice - Exercise on Proxies Using your knowledge of proxies object, you must use them to:<br> i) log the number of times a function is accessed<br> ii) create a revocable discount object Your Final Exam: ES6 Job Interview Questions - Adding Tasks to Columns Hope you’ve been following everything up till now. Next, we’ll add the functionality of creating new tasks! Bonus chapter: Your learning plan - Summary Get in touch with the author and get updates on Javascript topics. Bonus chapter: Your learning plan - Present your Deliverables Plan your deliverables for an audience and always be ready for criticism. Your Final Exam: ES6 Job Interview Questions - Persistence with Local Storage We will keep track of the state in our Pomodoro app by storing it locally. Your Final Exam: ES6 Job Interview Questions - JavaScript Theory Quiz Take the quiz and find out how much you know about JavaScript! ES2017 - Object.getOwnPropertyDescriptors the behavior of value, writable, get, set, configurable and enumerable The Reflect API - Exercise on the Reflect API In this exercise, we will use various methods of the Reflect API to create and alter objects. Math and Number Extensions - Number Extensions in-built methods in ES6 to play with numbers Bonus chapter: Your learning plan - Get Feedback and Iterate Walk through your plan multiple times and plan and re-plan things wherever necessary. ES2017 - Async-Await asynchronous functions and controlling the execution of functions using the await operator Your Final Exam: ES6 Job Interview Questions - Painting on an HTML5 Canvas The title explains it all. Let’s create a paint canvas with a color palette and line thickness options! Proxies in Practice - Introduction introduction to proxy and some traps while handling the access of the target Proxies in Practice - Revocable Proxies Proxy.revocable and its behavior Your Final Exam: ES6 Job Interview Questions - Selecting Cards Add the functionality of selecting a particular task in your app. ES2017 - Object.entries and Object.values check the entries and values of a Map using ES2017 Your Final Exam: ES6 Job Interview Questions - SQL and Map-Reduce-Filter We’ll see how the map, reduce and filter methods prove useful in SQL queries. Your Final Exam: ES6 Job Interview Questions - Connect-4 Solver Implement the famous game in JavaScript Your Final Exam: ES6 Job Interview Questions - Binary Gap Exercise in Codility Find a specific binary sequence. Objects in ES6 - Mixins introduction to inheritance and the importance of mixins in JS; and cloning objects in ES6 Objects in ES6 - Object Prototype Extensions and Super Calls get and set the prototype of an object, using the ‘super’ keyword to make code more concise Bonus chapter: Your learning plan - Introduction Learn how to double your career speed with soft skills. Math and Number Extensions - Math Extensions in-built mathematical functions in ES6 Bonus chapter: Your learning plan - Set your Goals and Milestones Achieve the bigger goals by setting small milestones and deliverables for yourself. ES2016 - The Exponential Operator introduction to ES2016 features and using the exponential operator - the syntactic sugar of ES2016 Your Final Exam: ES6 Job Interview Questions - Event Delegation in a Pomodoro App This is your first extensive exam task. The concepts in the following lessons will come in handy during interviews. It’s a long exercise, but trust me, it’s worth the hassle. Bonus chapter: Your learning plan - Sync your Learning Plan with your Career Plan Define your career goals and learn to work with a perspective. Bonus chapter: Your learning plan - The Big Picture See the bigger picture by tracking your progress with the help of modules and pre-requisites. Function Scope, Block Scope, Constants - var vs let introduction to the <code>let</code> keyword for declaring block-scoped variables; and the dangers of scoping, such as the temporal dead zone Function Scope, Block Scope, Constants - Introduction A basic overview of what to expect in this course Function Scope, Block Scope, Constants - Exercise on Function Scope, Block Scope, Constants This exercise will test your knowledge on the scope and sequence of function execution. You will have to keep track of the function’s path using console.log(). Arrow Functions - Context Binding introduction to context binding, animation of a ball using the setInterval method Tail Call Optimization and Other Function Features in ES6 - Tail call optimization tail call optimization for writing elegant recursive solutions without the performance tax of ES5 Spread Operator and Rest Parameters - Exercise on Spread Operator and Rest Parameters Get a hang of the spread operator and rest parameters by trying out these exercises. Remember, the point is to think differently and move away from ES5 conventions. Tail Call Optimization and Other Function Features in ES6 - Exercise on Tail Call Optimization and other Function Features in ES6 In the following exercises, you will use tail call optimization, create a stack, and examine how new.target behaves in ES5. Configuring ES6 with Webpack - Step 2: Initialize your Application and Configure Webpack Have questions about Step 2: Initialize your Application and Configure Webpack? Go for it! Your Final Exam: ES6 Job Interview Questions - Binary Trees, Recursion and Tail Call Optimization in Javascript Use recursion to determine the height of a binary tree. You must figure out how to implement the binary tree in JavaScript.
About the JavaScript In Practice: ES6 And Beyond (Zsolt Nagy) category [JavaScript In Practice: ES6 And Beyond (Zsolt Nagy)] (1)
Promises Library [ES6 Promises - Creating Promises in ES6] (2)