Week 03 Notes - rybotron/wnm498genart_f14 GitHub Wiki

• Intro to Object-Oriented JS
• Markdown Syntax
• Singleton Design Pattern

HTML:

<div id="c"></div>

JavaScript:

var myCanvas = createCanvas(500,500);
myCanvas.parent(“container”);

• JavaScript has one type of number.

• It can be an integer or have a fractional value. i.e. 7 or 7.235 ( integer or float / double )

• It can also use exponential notation:

  var x = 123e5; // 12300000

  var y = 123e-5; // 0.00123

• Strings are useful for holding data that can be represented in text form.

• Strings are special because of built-in JS String methods

• Checking string length() is the most common.

• Build and concatenate them with operators + and += return

  var myString = "this is " + "my concatenated string!"; var one = "one"; var two = "two"; var three = one + " " + two;

• Check out the MDN for more String functions

• p5 extends the built in JS string methods

• A true or false value primarily used in conditional statements
• mouseIsPressed is a p5.js variable that is false by default but returns true if a mouse button is pressed

• The value null is a JavaScript literal representing null or an "empty" value, i.e. no object value is present.

• A variable that has not been assigned a value is of type undefined.

• Generates random numbers without a “pattern” random(high) or random(low, high)

• Procedural Randomness
• Perlin noise is a random sequence generator producing a more natural, harmonic succession of numbers than that of the standard random() function
• 1D, 2D, and 3D noise - noise(x), noise(x, y), noise(x, y, z)

• +, -, *, /, %, ++, --

• for - loops through a block of code a number of times
• while - will loop a number of times until the condition is met

If the condition is true, execute the specified statement. If the condition is not true then another statement can be executed: else or else if.

if (condition1){
    statement1
}else if (condition2){
    statement2
}else if (condition3){
    statement3
}else{
    statementN
}

switch ( floor ){

case 1:
    print(“Welcome to floor ” + floor);
    break;
case 2:
    print(“Welcome to floor ” + floor);
    break;
case 3:
    print(“Welcome to floor ” + floor);
    break;
case 4:
    print(“Welcome to floor ” + floor);
    break;
default:
    print(“Push a button to go to a floor.”);
    break;
}

IF

• There is no need to provide an else, just use an if
• if(mouseIsPressed) show something
• A series of IF statements are always checked even if a match has been found

Switch

• You have a default option that is run if nothing is matched
• If a match is found, the code is ran, then the break statement stops the rest of the switch statement from running.
• provides better performance than multiple IF

condition ? expr1 : expr2

• Name / Value Pairs
• Associative Array, they are unordered unlike arrays.
• Objects are data or variables
• They have properties (primitives, arrays, other objects) and methods (functions)
• Properties are the values associated with an object.

• Provide access to an object's properties by using the dot notation or the bracket notation.
• Object literal notation
• Singleton Design Pattern

A container which allows developers to bundle all functionality under a unique, object-specific name.

var Transforms = { }
Transforms.x = width / 2;
Transforms.y = height / 2
Transforms.getX = function (){
    this.x;
}