Book Image

Advanced JavaScript

By : Zachary Shute
3 (1)
Book Image

Advanced JavaScript

3 (1)
By: Zachary Shute

Overview of this book

If you are looking for a programming language to develop flexible and efficient applications, JavaScript is an obvious choice. Advanced JavaScript is a hands-on guide that takes you through JavaScript and its many features, one step at a time. You'll begin by learning how to use the new JavaScript syntax in ES6, and then work through the many other features that modern JavaScript has to offer. As you progress through the chapters, you’ll use asynchronous programming with callbacks and promises, handle browser events, and perform Document Object Model (DOM) manipulation. You'll also explore various methods of testing JavaScript projects. In the concluding chapters, you'll discover functional programming and learn to use it to build your apps. With this book as your guide, you'll also be able to develop APIs using Node.js and Express, create front-ends using React/Redux, and build mobile apps using React/Expo. By the end of Advanced JavaScript, you will have explored the features and benefits of JavaScript to build small applications.
Table of Contents (9 chapters)

Chapter 1: Introducing ECMAScript 6


Activity 1 – Implementing Generators

You have been tasked with building a simple app that generates numbers in the Fibonacci sequence upon request. The app generates the next number in the sequence for each request and resets the sequence it is given an input. Use a generator to generate the Fibonacci sequence. If a value is passed into the generator, reset the sequence. You may start the Fibonacci sequence at n=1 for simplicity.

To highlight how the generators can be used to build iterative datasets, follow these steps:

  1. Look up the Fibonacci sequence and understand how the next value is calculated.

  2. Create a generator for the Fibonacci sequence.

  3. Inside the generator, set up the default values for current and next (0, 1) using variables n2 and n1.

  4. Create an infinite while loop.

  5. Inside the while loop, use the yield keyword to provide the current value in the sequence and save the return value of the yield statement into a variable called input.

  6. If input contains a value, reset the variables n2 and n1 to their starting values.

  7. Inside the while loop, calculate the new next value from current + next and save it into the variable next.

  8. Otherwise update n2 to contain the value from n1 (the next value) and set n1 to the next value that we calculated at the top of the while loop.

Code:

index.js
function* fibonacci () {
 let n2 = 0;x
 let n1 = 1;

 while ( true ) {
   let input = yield n2;
   if ( input ) {
     n1 = 1;
     n2 = 0;
   } else {
     let next = n1 + n2;
     [ n1, n2 ] = [ next, n1 ];
   }
 }
}
let gen = fibonacci();

Snippet 1.87: Implementing a generator

Outcome:

Figure 1.19: Fibonacci sequence with a generator

You have successfully demonstrated how generators can be used to build an iterative data set based on the Fibonacci sequence.