4 possible steps   p5.js
8 possible steps includes the ninth to stay in the same place   p5.js
Arbitrary random value between -1.0 and 1.0   p5.js

let w;

function setup() {
  createCanvas(560,390);
  background(255);
  w = new Walker(); 
  //create Walker obj by calling the constructor with the new operator
}

function draw() { //call functions on the Walker
  w.step();
  w.render();
  //during each cycle through draw(), Walker will take a step and draw a dot
}

class Walker { //defince walker class
  constructor() { //initialize obj
    this.x = width/2; 
    //x location at the center of the canvas (obj's data)
    this.y = height/2; 
    //y location at the center of the canvas (obj's data)
  }

  render() { //obj's 1st function: display itself as a dot
    stroke(0);
    point(this.x,this.y);
  }

  step() { //obj's 2nd function: direct walker obj to take a step
    
    //4 possible steps
    let choice = floor(random(4)); 
    //random() returns a floating point between 0 (inclusive) and 4 (exclusive)
    //floor() rounds a number downward to its nearest integer
    //results will be 0, 1, 2, or 3
    if (choice === 0) {
      this.x++; //to right
    } else if (choice == 1) {
      this.x--; //to left
    } else if (choice == 2) {
      this.y++; //go down
    } else {
      this.y--; //go up
    }
    
    /* 8 possible steps includes the ninth to stay
    let stepx = floor(random(3))-1; //pick from 3 possible steps along the x-axis (-1, 0, or 1) 
    let stepy = floor(random(3))-1; //pick from 3 possible steps along the y-axis (-1, 0, or 1) 
    this.x += stepx;
    this.y += stepy;
    */
    
    /* Arbitrary random value between -1.0 and 1.0
    let stepx = random(-1, 1); //yields any floating point number between -1.0 and 1.0
    let stepy = random(-1, 1); //yields any floating point number between -1.0 and 1.0
    this.x += stepx;
    this.y += stepy;
    */
    
    this.x = constrain(this.x,0,width-1); //canvas width-1
    this.y = constrain(this.y,0,height-1); //canvas height-1
    //constrain(value, min, max)
    //constrains a value to not exceed a max and min value
  }
} //end of Walker class
							

p5.js

let randomCount = []; //array to keep track of how often random numbers are picked
let total = 20;

function setup() {
  createCanvas(560,390);
  for (let i = 0; i < total; i++) {
    randomCount[i] = 0;
  }
}

function draw() {
  background(255);
  let randomNum = floor(random(total)); //pick a random number
  randomCount[randomNum]++; //increase count

  //set rectangle's color
  stroke(0);
  strokeWeight(2);
  fill(255);

  let w = width/randomCount.length; // 560/20 = 28
	
  //draw a rectangle at location x,y (x*w,height-randomCount[x]) 
  //with a width and height of (w-1,randomCount[x])
  for (let x = 0; x < randomCount.length; x++) {
    rect(x*w,height-randomCount[x],w-1,randomCount[x]);
  }
}
							

p5.js

let w;

function setup() {
  createCanvas(560,390);
  background(200);
  w = new Walker(); 
}

function draw() {
  w.step();
  w.render();
}

class Walker{
  constructor(){
    this.x = width/2;
    this.y = height/2;
  };

 render() {
    stroke(0);
    point(this.x,this.y);
  };

  step(){
    /*
    chance of moving right: 40%
    chance of moving left: 20%
    chance of moving down: 20%
	chance of moving up: 20%
    */
    let r = random(1); //create a random floating point value between 0 and 1
    if (r < 0.4) { //40% chance of moving to the right 
      this.x++;
    } else if (r < 0.6) { //20% chance of moving to the left
      this.x--;
    } else if (r < 0.8) { //20% chance of moving down
      this.y++;
    } else { //20% chance of moving up
      this.y--;
    }
    this.x = constrain(this.x,0,width-1);
    this.y = constrain(this.y,0,height-1);
  };
}
							

p5.js

function setup() {
  createCanvas(560,390);
  background(220);
}

function draw() {
  // randomGaussian(mean, sd)
	// If no args, returns a mean of 0 and standard deviation of 1
	// If one arg, that arg is the mean (standard deviation is 1)
	// If two args, first is mean, second is standard deviation
  let x = randomGaussian();

  const sd = 60; // standard deviation
  const mean = width/2; // mean (middle of the screen along the x-axis)
  x = ( x * sd ) + mean;  
  // scale gaussian random number by multiply standard deviation and add mean

  fill(63,63,147,10); // rgba
  noStroke(); // disables drawing the stroke (outline)
  ellipse(x, height/2, 16, 16);   
  // ellipse(x, y, w, h)
}
							

p5.js

let momentInTime = 0;
let xincrement = 0.01; //change this value to see the different result

function setup() {
  createCanvas(560,390);
  background(220);
  noStroke(); //disables drawing the stroke (outline)
}

function draw() {
	//draw rectangle
  fill(220, 10);
  rect(0,0,width,height);

  // get a noise value based on a specific moment in time
  // scale it to the window's width
  let n = noise(momentInTime);
  
	// re-maps a number from one range to another
  // using map() to customize the range of Perlin noise
  // map(value, curremtMin, currentMax, newMin, newMax)
  let x = map(n,0,1,0,width);

  // increment momentInTime in each cycle (move forward in time)
  momentInTime += xincrement;

  // draw ellipse at the value produced by perlin noise
  fill(63,63,147);
  ellipse(x,height/2, 64, 64);

  //print(n); //print() equal to console.log()
}
							

p5.js

let walker;

function setup() {
  createCanvas(560,390);
  walker = new Walker();
  background(220);
}

function draw() {
  walker.walk();
  walker.display();
}

class Walker{
  constructor(){
    //createVector(x,y,z) which provides a two or three dimensional vector
    this.position = createVector(width/2,height/2);
    this.noff = createVector(random(1000),random(1000)); //n-offset
    //this.noff = createVector(0,10000);
  }

 display() {
    strokeWeight(1);
    fill(63,63,147);
    stroke(0);
    ellipse(this.position.x, this.position.y, 48, 48);
  }

  walk() {
    //x and y location mapped from noise
    this.position.x = map(noise(this.noff.x),0,1,0,width); //this.noff.x means tx from the book
    this.position.y = map(noise(this.noff.y),0,1,0,height); //this.noff.y means ty from the book
    this.noff.add(0.01,0.01,0); //move forward through time
    //add() method appends a new element with a specified value to the end of a Set object
  }
}