JavaScript Hands-On Exercises

JavaScriptJavaScriptBeginner
Practice Now

This tutorial is from open-source community. Access the source code

Introduction

In this lab, we will explore JavaScript programming concepts and techniques through a series of hands-on exercises. The lab is designed to help you gain a deeper understanding of JavaScript and improve your programming skills by practicing with real-world scenarios. You will work on tasks such as creating functions, working with arrays and objects, and manipulating the DOM to create dynamic web pages. By the end of this lab, you will have a solid foundation in JavaScript programming and be able to apply your knowledge to build more complex applications.


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("`JavaScript`")) -.-> javascript/BasicConceptsGroup(["`Basic Concepts`"]) javascript/BasicConceptsGroup -.-> javascript/variables("`Variables`") javascript/BasicConceptsGroup -.-> javascript/data_types("`Data Types`") javascript/BasicConceptsGroup -.-> javascript/arith_ops("`Arithmetic Operators`") javascript/BasicConceptsGroup -.-> javascript/comp_ops("`Comparison Operators`") javascript/BasicConceptsGroup -.-> javascript/cond_stmts("`Conditional Statements`") javascript/BasicConceptsGroup -.-> javascript/loops("`Loops`") subgraph Lab Skills javascript/variables -.-> lab-28593{{"`JavaScript Hands-On Exercises`"}} javascript/data_types -.-> lab-28593{{"`JavaScript Hands-On Exercises`"}} javascript/arith_ops -.-> lab-28593{{"`JavaScript Hands-On Exercises`"}} javascript/comp_ops -.-> lab-28593{{"`JavaScript Hands-On Exercises`"}} javascript/cond_stmts -.-> lab-28593{{"`JavaScript Hands-On Exercises`"}} javascript/loops -.-> lab-28593{{"`JavaScript Hands-On Exercises`"}} end

Code Practice with Repeat Generator

To practice coding, open the Terminal/SSH and type node to create a generator that repeats the given value indefinitely. Use a non-terminating while loop that will yield a value every time Generator.prototype.next() is called. Then, use the return value of the yield statement to update the returned value if the passed value is not undefined.

const repeatGenerator = function* (val) {
  let v = val;
  while (true) {
    let newV = yield v;
    if (newV !== undefined) v = newV;
  }
};

To test the generator, create an instance of it using the value 5 and call repeater.next() to get the next value in the sequence. The output will be { value: 5, done: false }. Calling repeater.next() again will return the same value. To change the value, call repeater.next(4), which will return { value: 4, done: false }. Finally, calling repeater.next() will return the updated value, { value: 4, done: false }.

Summary

Congratulations! You have completed the Repeat Generator lab. You can practice more labs in LabEx to improve your skills.

Other JavaScript Tutorials you may like