Javascript For Of Loop

5 Key excerpts on "Javascript For Of Loop"

• 

  eBook - ePub

  JavaScript

  The New Toys

  • T. J. Crowder(Author)
  • 2020(Publication Date)
  • Wrox

    (Publisher)

  6 Iterables, Iterators, for-of, Iterable Spread, Generators

  WHAT'S IN THIS CHAPTER?

  • Iterators and Iterables
  • for-of loops
  • Iterable spread syntax
  • Generators and generator functions

  CODE DOWNLOADS FOR THIS CHAPTER

  You can download the code for this chapter at https://thenewtoys.dev/bookcode or https://www.wiley.com/go/javascript-newtoys .

  JavaScript got a new feature in ES2015: generalized iteration, the classic “for each” idiom popular in many languages. In this chapter you'll learn about the new feature's iterators and iterables and how you create and use them. You'll also learn about JavaScript's powerful new generators that make creating iterators easy, and also take the concept further, making communication two-way.

  ITERATORS, ITERABLES, THE FOR-OF LOOP, AND ITERABLE SPREAD SYNTAX

  In this section, you'll learn about JavaScript's new iterators and iterables, the for-of loop that makes using iterators easy, and the handy spread syntax ( … ) for iterables.

  Iterators and Iterables

  Many languages have some kind of “for each” construct for looping through the entries of an array or list or other collection object. For years, JavaScript only had the for-in loop, which isn't a general-purpose tool (it's just for looping through the properties of an object). The new Iterator and Iterable “interfaces” (see note) and new language constructs that use them change that.

  NOTE Starting with ES2015, the specification mentions “interfaces” (in the sense of code interfaces) for the first time. Since JavaScript isn't strongly typed, an “interface” is purely a convention. The specification's description is that an interface “… is a set of property keys whose associated values match a specific specification. Any object that provides all the properties as described by an interface's specification conforms to that interface. An interface is not represented by a distinct object. There may be many separately implemented objects that conform to any interface. An individual object may conform to multiple interfaces.”

  Sign up to read

  Learn more about book
• 

  eBook - ePub

  JavaScript from Beginner to Professional

  Learn JavaScript quickly by building fun, interactive, and dynamic web apps, games, and pages

  • Laurence Lars Svekis, Maaike van Putten, Rob Percival, Laurence Svekis, Codestars By Rob Percival(Authors)
  • 2021(Publication Date)
  • Packt Publishing

    (Publisher)

  5

  Loops

  We are starting to get a good basic grasp of JavaScript. This chapter will focus on a very important control flow concept: loops. Loops execute a code block a certain number of times. We can use loops to do many things, such as repeating operations a number of times and iterating over data sets, arrays, and objects. Whenever you feel the need to copy a little piece of code and place it right underneath where you copied it from, you should probably be using a loop instead.

  We will first discuss the basics of loops, then continue to discuss nesting loops, which is basically using loops inside loops. Also, we will explain looping over two complex constructs we have seen, arrays and objects. And finally, we will introduce two keywords related to loops, break and continue , to control the flow of the loop even more.

  There is one topic that is closely related to loops that is not in this chapter. This is the built-in foreach method. We can use this method to loop over arrays, when we can use an arrow function. Since we won't discuss these until the next chapter, foreach is not included here.

  These are the different loops we will be discussing in this chapter:

  • while loop
  • do while loop
  • for loop
  • for in
  • for of loop

  Note: exercise, project, and self-check quiz answers can be found in the Appendix .

  while loops

  The first loop we will discuss is the while loop . A while loop executes a certain block of code as long as an expression evaluates to true . The snippet below demonstrates the syntax of the while

  Sign up to read

  Learn more about book
• 

  eBook - PDF

  Coding All-in-One For Dummies

  • Chris Minnick(Author)
  • 2022(Publication Date)
  • For Dummies

    (Publisher)

  » Condition: A Boolean expression to be evaluated with each iteration of the loop. » Final expression: An expression to be evaluated after each loop iteration. Although it’s not required to use all three expressions in a for loop, all three of them are nearly always included. The for loop is usually used to run code a pre- determined number of times. The following is an example of a simple for loop: for (let x = 1; x < 10; x++){ console.log(x); } Broken down, this is how the preceding for loop example works: 1. A new variable, in this case x, is initiated with the value of 1. 2. A test is performed to determine whether x is less than 10. If it is, the statements inside the loop are executed (in this case, a console.log statement). If not, the value of x is incremented using the increment operator (++). Getting into the Flow with Loops and Branches CHAPTER 6 Getting into the Flow with Loops and Branches 247 3. The test is done again to determine whether x is less than 10. If so, the statements inside the loop are executed. 4. The test repeats, until the condition expression no longer evaluates to true. Figure 6-2 shows the result of running this for statement in the Chrome devel- oper tools. Looping through an array You can use for loops to list the contents of an array by testing the value of the counter against the value of the length property of the array. Be sure to remember that JavaScript arrays are zero-indexed, so the value of any array.length will be one more than the highest index numbered element in the array. That is why we subtract 1 in Listing 6-2. LISTING 6-2: Listing the Contents of an Array with for Loop

  Sign up to read

  Learn more about book
• 

  eBook - PDF

  Beginning HTML and CSS

  • Rob Larsen(Author)
  • 2013(Publication Date)
  • Wrox

    (Publisher)

  for The for statement executes a block of code a specified number of times. You use it when you want to specify how many times you want the code to be executed (rather than running while a particu- lar condition is true/false). It is worth noting here that the number of times that the for loop runs could be specified by some other part of the code. First, here is the syntax (which always takes three arguments): for ( a; b; c ){ //code to be executed } 362 ❘ CHAPTER 10 LEARNING JAVASCRIPT Now you need to look at what a, b, and c represent: ‰ ‰ a is evaluated before the loop is run and is only evaluated once. It is ideal for assigning a value to a variable; for example, you might use it to set a counter to 0 using i=0. ‰ ‰ b should be a condition that indicates whether the loop should be run again; if it returns true the loop runs again. For example, you might use this to check whether the counter is less than 11. ‰ ‰ c is evaluated after the loop has run and can contain multiple expressions separated by a comma (for example, i++, j++;). For example, you might use it to increment the counter. So if you come back to the 3 times table example again, it would be written something like this ( ch10_eg09.js): for ( var i=0; i<11; i++ ) { document.getElementById( "numbers" ).innerHTML += "
• " + i + " x 3 = " + (i * 3) +"
"; } Now look at the for statement in small chunks: ‰ ‰ var i=0 The counter is assigned to have a value of 0. ‰ ‰ i<11 The loop should run if the value of the counter is less than 11. ‰ ‰ i++ The counter is incremented by 1 every time the loop runs. The assignment of the counter variable, the condition, and the incrementing of the counter all appear in the parentheses after the keyword for. You can also assign several variables at once in the part corresponding to the letter a if you separate them with a comma, for example, var i = 0, j = 5;. It is also worth noting that you can count downward, as well as upward, with loops.