• Office Hours:
  • Adriana:
    • Mondays from 3:15pm to 4:45pm and Tuesdays from 10:30am to 12:00pm in GS 829
  • Tanner:
    • Wednesdays from 9-11am in GS 931. The first hour (9-10) will be in person and then the second hour (10-11) on zoom
• Questions?
• JavaScript Basics

Use the var when declaring a new variable (you can create a new variable without declaring it, but you shouldn’t). Variables in JavaScript are dynamically typed.

var my_number = 3; // primitive variable
var my_array = [3, 6, 3, 1]; // array
var my_object = {firstName: "Adriana", age: 41}; // object

You can retrieve properties using a period:

my_number.constructor.name;
my_array.length;
my_object.age;

Assign new key and value to object.

my_object.height = 172;

You can create an array of objects, whose values include arrays.

var anscombe = [
  {x: [10, 8, 13, 9, 11, 14, 6, 4, 12, 7, 5], 
   y: [8.04, 6.95, 7.58, 8.81, 8.33, 9.96, 7.24, 4.26, 10.84, 4.82, 5.68]},
  {x: [10, 8, 13, 9, 11, 14, 6, 4, 12, 7, 5], 
   y: [9.14, 8.14, 8.74, 8.77, 9.26, 8.10, 6.13, 3.10, 9.13, 7.26, 4.14]},
  {x: [10, 8, 13, 9, 11, 14, 6, 4, 12, 7, 5],
   y: [7.46, 6.77, 12.74, 7.11, 7.81, 8.84, 6.08, 5.39, 8.15, 6.42, 5.73]},
  {x: [8, 8, 8, 8, 8, 8, 8, 19, 8, 8, 8],
   y: [6.58, 5.76, 7.71, 8.84, 8.47, 7.04, 5.25, 12.50, 5.56, 7.91, 6.89]}
];

The same as other languages (e.g., ==, !=, >), but JavaScript will try to type convert the values in the comparison. Try these in the console:

3 == 3 // regular comparison
3 == '3' // regular comparison (automatically converts type)
3 === 3 // strict comparison
3 === '3' // strict comparison (with no type conversion)

var my_number = 5;
if (my_number > 0) {
  console.log("The number " + my_number + " is larger than zero.")
} else {
  console.log("The number " + my_number + " is negative.")
}

For loops need an initialization (e.g., var i = 0), a test for when to stop (e.g., i < 100), and an update (e.g., i++):

for (var i = 0; i < 100; i++) {
    console.log(i);
}

You can iterate over each key in an object.

for (var key in anscombe) {
  console.log(key);
};

What’s the difference?

for (var obj of anscombe) {
  console.log(obj);
};

Here’s a more complex example:

for (var key in anscombe) {
  for (var subkey in anscombe[key]) {
    for (var value in anscombe[key][subkey]) {
      console.log(value);
    };
  };
};

function addNumbers(my_array) {
  var total = 0;
  for (var i = 0; i < my_array.length; i++) {
    total += my_array[i];
  }
  return total;
}

Write a function buildObject(); that takes a list of lists, and returns an object

buildObject([["name", "banana"], ["color", "yellow"]])

{ "name": "banana", "color": "yellow" }

You can bundle functions together (enclosed) with references to its surrounding state (the lexical environment). A closure gives you access to an outer function’s scope from an inner function.

function makeAdder(x) {
  return function (y) {
    return x + y;
  };
}

var add1 = makeAdder(1);
var add10 = makeAdder(10);

console.log(add1(2));
console.log(add10(2));

Create a counter function (counter();) that initializes a n variable with zero and returns a function that adds 1 to n and returns n. Create a variable called my_count that is initialized with counter(); so when my_count(); is called, 1 is added to it.

Here’s a person object with a function as one of its properties.

var person = {
  firstName: "Adriana",
  age: 41,
  birthday: function() {
    this.age++;
  }
}

person.age; //return 41
person.birthday(); //increments age
person.lastname = "Picoral";

function makePerson(n, a) {
  let result = {
    firstName: n,
    age: a,
    birthday: function() {
      this.age++;
    }
  };
  return result;
};

var person1 = makePerson("Adriana", 41);
var person2 = makePerson("Paula", 35);

Write a procedure makeObject that respects the transcript below:

makeObject(10).printValue().increment().increment().printValue();