Javascript: Objects & Arrays

var student1 = ['Brett', 29, 'San Diego', 'Web Dev'];

var studentAge = student1[1];

Storing info in an array

var studentName = 'Brett';
var studentAge = 29;
var studentLocation = 'San Diego';
var studentCohort = 'DM9';

var student2Name = 'Jeff';
var studentAge = 26;
var studentLocation = 'San Francisco';
var studentCohort = 'DM5';

Storing information

in Variables

Store them in objects

var student1 = {
    name: 'Brett',
    age: 29,
    location: 'San Diego',
    cohort: 'DM9'
};

var student2 = {
    name: 'Brian',
    age: 30,
    location: 'Provo',
    cohort: 'DM9'
};

var student3 = {
    name: 'Michael',
    age: 24,
    location: 'Sandy',
    cohort: 'DM13'
};


console.log(student1.name);

new Object();

var dog = new Object();

dog.name = 'Fido';
dog.breed = 'Chihuahua';
dog.color = 'black';

console.log(dog.name) // 'Fido';

Object Literal

var newObj = {
    time: '12:01pm',
    message: 'All clear',
    status: 'OK'
};

var inlineObj = { time: '1:00pm', message: 'En Route', status: 'Driving' };

Change/Get Values from Objects

var dog = {
  name: 'Princess',
  breed: 'Bulldog',
  color: 'brown/black'
};

console.log(dog.name) // 'Princess';
dog.name = 'Eleanor';

console.log(dog.name) // 'Eleanor';

dog.numLegs = 4;

console.log(dog.numLegs) // 4;

Bracket Notation

var dog = {
  name: 'Sid',
  breed: 'Doberman Pincher',
  color: 'black/brown'
};

dog['breed'] = 'Poodle';

console.log(dog.breed) // 'Poodle'

Delete

Methods

var cat = {
  name: 'Whiskers',
  mood: 'Feisty',
  makeNoise: function() {
    console.log('MEOW!!!');
  }
}

Methods and 'This'

var cat = {
  name: 'Whiskers',
  mood: 'Feisty',
  makeNoise: function() {
    console.log('MEOW!!!');
  },
  sayName: function() {
    console.log(cat.name) // cat is undefined in this scope.
    console.log(this.name) // this keyword is used to refer to the object.
  }
}

Looping through objects

var toDoList = {
  "make bed": "pending",
  "Do laundry": "pending",
  "Brush Teeth": "pending",
  "walk dog": "pending"
}

// Loop through toDoList and change each value to completed.

for (var prop in toDoList) {
  toDoList[prop] = 'complete';
}

Arrays

var obj = {
  name: 'foo',
  number: 5
}

var arr = [1, 'foo', 'cat'];

arr.push(10);

obj.push(11); // obj.push is not a function.

When to use Arrays?

var directions = {
  first: 'turn left',
  second: 'turn right',
  third: 'go underneath the overpass',
  fourth: 'get onto the highway'  
}

Use arrays when order matters

Use arrays to keep things organized

var directions = ['left', 'right', 'straight under overpass', 'get on highway'];

for (var i = 0; i < directions.length; i++) {
  console.log(directions[i]);
}

Array.length

var obj = {
  0: 'January',
  1: 'February'
}

console.log(obj.length) // undefined

var array = ['January', 'February']

console.log(array.length) // 2

Array.push

var months = ['January', 'February'];

months[2] = 'March';

months[months.length-1] = 'March';

console.log(months) // ['January', 'February', 'March']

months.push('March');

Array.Pop

var months = ['January', 'February', 'March'];

months[2] = undefined;

console.log(months) // ['January', 'February', undefined];

months.pop();

console.log(months); // ['January', 'February'];

Array.shift && Array.unshift

var months = ['Foo', 'February', 'March'];

months[0] = undefined; // Months will be [undefined, 'February', 'March'];

var removedMonth = months.shift()

// removedMonth === 'Foo'
// months === ['February', 'March'];

months.unshift('January');

// months === ['January', 'February', 'March'];

String.split && Array.join

var months = 'January,February,March';

var monthsArray = months.split(',');

// monthsArray === ['January', 'February', 'March'];

var sentenceArray = [ 'j', 'o', 'i', 'n', ' ', 't', 'h', 'i', 's', ' ', 'a', 'r', 'r', 'a', 'y' ];

var sentence = sentenceArray.join('');

More Methods

• Splice, Slice
• Reverse
• IndexOf

Splice and Slice

var months = 'January,February,March';

var monthsArray = months.split(',');

// monthsArray === ['January', 'February', 'March'];

var sentenceArray = [ 'j', 'o', 'i', 'n', ' ', 't', 'h', 'i', 's', ' ', 'a', 'r', 'r', 'a', 'y' ];

var sentence = sentenceArray.join('');

Reverse

var months = 'January,February,March';

var monthsArray = months.split(',');

// monthsArray === ['January', 'February', 'March'];

var sentenceArray = [ 'j', 'o', 'i', 'n', ' ', 't', 'h', 'i', 's', ' ', 'a', 'r', 'r', 'a', 'y' ];

var sentence = sentenceArray.join('');

Index Of

var months = 'January,February,March';

var monthsArray = months.split(',');

// monthsArray === ['January', 'February', 'March'];

var sentenceArray = [ 'j', 'o', 'i', 'n', ' ', 't', 'h', 'i', 's', ' ', 'a', 'r', 'r', 'a', 'y' ];

var sentence = sentenceArray.join('');