16.4: for…of loop – Topics of JavaScript/ES6




In this video, I explore the new JavaScript ES6 loop: “for…of”. This style loop is useful when iterating over the elements of an array.

Video on ES6 let: https://youtu.be/q8SHaDQdul0

Support this channel on Patreon: https://patreon.com/codingtrain
To buy Coding Train merchandise: https://www.designbyhumans.com/shop/codingtrain/
To Support the Processing Foundation: https://processingfoundation.org/support

Send me your questions and coding challenges!: https://github.com/CodingTrain/Rainbow-Topics

Contact:
Twitter: https://twitter.com/shiffman
The Coding Train website: http://thecodingtrain.com/

Links discussed in this video:
for…of reference: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for…of

Source Code for the all Video Lessons: https://github.com/CodingTrain/Rainbow-Code

p5.js: https://p5js.org/
Processing: https://processing.org

For an Intro to Programming using p5.js: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA
For Coding Challenges: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH

Help us caption & translate this video!

https://amara.org/v/dXkh/

📄 Code of Conduct: https://github.com/CodingTrain/Code-of-Conduct

Original source


31 responses to “16.4: for…of loop – Topics of JavaScript/ES6”

  1. let r;
    let bubbles=[];

    function setup() {
    createCanvas(600, 400);

    }

    function draw() {
    background(0);
    for(let i=0;i<bubbles.length;i++){
    bubbles[i].move();
    bubbles[i].show();

    }

    }

    function mouseDragged(){
    r=random(10,50);
    let b= new Bubble(mouseX, mouseY, r);
    bubbles.push(b);

    }

    class Bubble{
    constructor(x,y,r){
    this.x=x;
    this.y=y;
    this.r=r;
    }
    move(){
    this.x=this.x+ random(-10,10);
    this.y=this.y+ random(-10,10);
    }

    show(){
    stroke(255);
    strokeWeight(4);
    fill(r,random(100),random(r));

    ellipse(this.x,this.y, this.r*2);
    }
    }

  2. With all the comments about forEach, I was amused to find that "each" is not a reserved word in JavaScript.
    So you could write:

    for (let each of bubbles) {
    each.move();
    each.show():
    }

  3. But you are in the future, I don't even know who you are, watching this video. But you are there, someday, watching this video. I'm probably not standing here anymore, I'm somewhere else. This video has ended.

    I don't know how to feel about this sentence

  4. It's funny that Homer (yes, the Illiad and Odyssey one), had very similar objections as you have at the and of the video. He was afraid of ruining the poem by putting it in written form, and not having control over the time/audiance issue.

  5. Why don’t you just use map() filter() and/or reduce(), in addition to forEach and for…of, when you need to manipulate an array instead of the traditional counting method?

Leave a Reply