Last updated on

Updated for new 2017 course!

It’s about time but I finally got around to completing the exercises for the new course and make a list of all of the Codecademy JavaScript answers.

In the same way I did this for the previous course, I recommend you don’t just simply copy and paste these answers to complete the challenges – what are you going to learn by doing that?

These answers are just in case you get stuck, you can refer to these to see how I solved the challenge (there’s usually more than one way).

Just as a quick note; Codecademy have really shortened the new JavaScript course and it’s definitely more snappy and to the point. They have also tried to put more ‘real world’ examples in the exercises (like ordering a pizza!) which hopefully demonstrates what you would actually be doing with JavaScript!

## Introduction to JavaScript

### Introduction to JavaScript

#### Types

```var myString = 'string';
var myNumber = 123;
var myBoolean = true;

// Do not edit the code under this line
console.log("Name: " + myString);
console.log("Lucky Number: " + myNumber);
console.log("Good joke? " + myBoolean);
```

#### console

```console.log('Pepperoni', 'Bacon');
```

#### Math Operators

```console.log(35+3.5);
console.log(2017-1969);
console.log(65/240);
console.log((65/240) * 100);
```

#### Math Operators II

```console.log(365/27);
console.log(365 % 27)
```

#### Random

```console.log(Math.floor(Math.random() * 100));
```

```// Opening line
console.log('It was love at first sight.');
/*
console.log('The first time Yossarian saw the chaplain he fell madly in love with him.');
console.log('Yossarian was in the hospital with a pain in his liver that fell just short of being jaundice.');
console.log('The doctors were puzzled by the fact that it wasn\'t quite jaundice.');
console.log('If it became jaundice they could treat it.');
console.log('If it didn\'t become jaundice and went away they could discharge him.');
console.log('But this just being short of jaundice all the time confused them.');
*/
```

### Introduction to JavaScript Quiz

Q. Which modulus expression will evaluate to 2?
A. 10 % 4

Q. Which expression will equal 5?
A. (5 * 5) – 20

Q. What is string interpolation?
A. When you insert a variable into a string.

Q. Which of the following is the correct way to log a string to the console?
A. console.log(‘Hello world’);

Q. What two values are considered Boolean types?
A. true false

Q. What is the correct way to declare a variable?
A. var myName = ‘Jon’;

Q. What best describes the variables in JavaScript?
A. To allow the user to store or hold data.

Q. What is the correct way to generate a random number?
A. Math.random()

### Variables

#### Create a variable

```var strength = '50,000 pounds';
console.log('How much stuff can a variable hold? ', strength);
```

#### Create a Variable II

```var strength = '50,000 pounds';
console.log('How much stuff can a variable hold? ', strength);
var age = 35;
console.log(age);
var hasPet = true;
```

#### Changing a Variable’s Value

```var morningAlarm = '6:30AM';
morningAlarm = '9:30AM';
console.log('Morning alarm is set to:', morningAlarm);
```

#### String interpolation

```var favoriteAnimal = 'Cat';
console.log('My favorite animal: ' + favoriteAnimal);
```

## Control Flow

### Control Flow

#### if/else Statements

```var harryPotterFan = true;
if(harryPotterFan){
console.log('Mischief managed.')
} else {
}
```

#### Comparison Operators

```var hungerLevel = 5; // Change to 10 for second part
if(hungerLevel > 7){
console.log('Time to eat!');
} else{
console.log('Let\'s eat later.');
}
```

#### Comparisons Operators II

```var moonPhase = 'full';
if(moonPhase === 'full'){
console.log('Howwwwlll!');
} else{
console.log('I swear I am not a werewolf...');
}
```

#### else if Statements

```var moonPhase = 'full'; // Change this for the next steps
if(moonPhase === 'full'){
console.log('Howwwwlll!');
} else if(moonPhase === 'mostly full'){
console.log('Arms and legs are getting hairier');
} else if(moonPhase === 'mostly new'){
console.log('Back on two feet');
} else {
console.log('Invalid moon phase');
}
```

#### Logical Operators

Part 1

```var moonPhase = 'full'; // Change this for the next steps
var foggyNight = false;
if(moonPhase === 'full' && foggyNight === true){
console.log('Howwwwlll!');
} else if(moonPhase === 'mostly full'){
console.log('Arms and legs are getting hairier');
} else if(moonPhase === 'mostly new'){
console.log('Back on two feet');
} else {
console.log('Invalid moon phase');
}
```

Part 2

```var moonPhase = 'full'; // Change this for the next steps
var foggyNight = false;
if(moonPhase === 'full' || foggyNight === true){
console.log('Howwwwlll!');
} else if(moonPhase === 'mostly full'){
console.log('Arms and legs are getting hairier');
} else if(moonPhase === 'mostly new'){
console.log('Back on two feet');
} else {
console.log('Invalid moon phase');
}
```

#### switch Statements

```var moonPhase = 'full';
switch(moonPhase){
case 'full':  console.log('Howwwwlll!!');
break;
case 'mostly full':  console.log('Arms and legs are getting hairier');
break;
case 'mostly new':  console.log('Back on two feet');
break;
default:
console.log('Invalid moon phase');
break;
}
```

## Functions and Scope

### Functions

#### Functions

```function takeOrder(){
console.log('Order: pizza');
}
takeOrder();
```

#### Parameters

```function takeOrder(topping){
console.log('Order: pizza topped with ' + topping);
}
takeOrder('bacon');
```

#### Parameters II

```function takeOrder(topping, crustType){
console.log('Order: ' + crustType + ' crust pizza topped with ' + topping);
}
takeOrder('thin', 'bacon');
takeOrder('thin', 'olives');
takeOrder('thick', 'pepperoni');
```

#### Return

```var orderCount = 0;
function takeOrder(topping, crustType){
orderCount++;
console.log('Order: ' + crustType + ' crust pizza topped with ' + topping);
}
function getSubTotal(itemCount){
return itemCount * 7.5;
}
takeOrder('thin', 'bacon');
takeOrder('thin', 'olives');
takeOrder('thick', 'pepperoni');
console.log(getSubTotal(orderCount));
```

#### return II

```var orderCount = 0;
function takeOrder(topping, crustType){
orderCount++;
console.log('Order: ' + crustType + ' crust pizza topped with ' + topping);
}
function getSubTotal(itemCount){
return itemCount * 7.5;
}
function getTax(){
return getSubTotal(orderCount) * 0.06;
}
function getTotal(){
return getSubTotal(orderCount) + getTax();
}
takeOrder('thin', 'bacon');
takeOrder('thin', 'olives');
takeOrder('thick', 'pepperoni');
console.log(getSubTotal(orderCount));
console.log(getTotal());
```

### Scope

#### Global Scope

```var laundryRoom = 'Basement';
var mailRoom = 'Room 1A';
console.log('Laundry: ' + laundryRoom + ', Mail: ' + mailRoom);
```

#### Functional Scope

```var laundryRoom = 'Basement';
var mailRoom = 'Room 1A';
function myApartment(){
var mailBoxNumber = 'Box 3';
laundryRoom = 'In-unit';
console.log('Mail box: ' + mailBoxNumber + ', Laundry: ' + laundryRoom);
}
console.log('Laundry: ' + laundryRoom + ', Mail: ' + mailRoom);
// console.log(mailBoxNumber); This causes an error
myApartment();
```

#### Scoping

```var buildingLaundryCode = 4927;
var buildingPhone = '(481) 516-2342';
var buildingAddress = '150 E 14th St, New York, NY';

function myApartment() {
var myCoffeeMaker = 'Aeropress';
var myCloset = 'Extra coats in the back';
var myRefridgerator = 'Filled with veggies and dark chocolate.';
var myDog = 'Nikko';
}

// Do not edit the code after this line
console.log("**Apartment Building Information**");
console.log("Laundry code: " + buildingLaundryCode + "\nPhone: " + buildingPhone + "\nMailing address: " + buildingAddress);
```

## Arrays and Loops

### Arrays

#### Create an Arrays

```var bucketList = ['Sky dive', 'Go to Nepal', 'Write a book'];
console.log(bucketList);
```

#### Property Access

```var bucketList = ['Sky dive', 'Go to Nepal', 'Write a book'];
console.log(bucketList);
var listItem = bucketList[0];
console.log(listItem);
listItem = bucketList[2];
listItem = bucketList[3]; // Got to add this or the challenge won't complete !?
console.log(bucketList[3]);
```

#### length Property

```var bucketList = ['Sky dive', 'Go to Nepal', 'Write a book'];
console.log(bucketList.length);
```

#### push Method

```var bucketList = ['Sky dive', 'Go to Nepal', 'Write a book'];
bucketList.push('Go to Japan');
bucketList.push('See the northern lights');
console.log(bucketList);
```

#### pop Method

```var bucketList = ['Sky dive', 'Go to Nepal', 'Write a book'];
bucketList.push('Go to Japan');
bucketList.push('See the northern lights');
console.log(bucketList);
bucketList.pop();
console.log(bucketList);
```

### Loops

#### Looping by hand

```var vacationSpots = ['Japan', 'Australia', 'Switzerland'];
console.log(vacationSpots[0]);
console.log(vacationSpots[1]);
console.log(vacationSpots[2]);
```

#### for Loops

```var vacationSpots = ['Japan', 'Australia', 'Switzerland'];

for(var i=0; i<vacationSpots.length; i++){
console.log('I would love to visit ' + vacationSpots[i]);
}
```

#### for loop backwards

```var vacationSpots = ['Japan', 'Australia', 'Switzerland'];

for(var i=vacationSpots.length - 1; i>=0; i--){
console.log('I would love to visit ' + vacationSpots[i]);
}
```

#### for loops inside of for loops

```var myPlaces = ['New York', 'Philadelphia', 'Chicago'];
var friendPlaces = ['LA', 'Seattle', 'New York'];
for(var i=0; i<myPlaces.length; i++){
console.log(myPlaces[i]);
for(var j=0; j<friendPlaces.length; j++){
if(myPlaces[i] === friendPlaces[j]){
console.log(friendPlaces[j]);
}
}
}
```

#### while loops

```var cards = ['Diamond', 'Spade', 'Heart', 'Club'];
var currentCard = 'Heart';
console.log(currentCard);
var randomNumber = Math.floor(Math.random() * 3);
currentCard = cards[randomNumber];
}
```

## JavaScript and jQuery

### JavaScript and the DOM

Add this to the bottom of the index.html page after adding the alert function to the main.js file.

```<script src="js/main.js"></script>
```

#### Document Object Model

```var skillset = document.getElementsByClassName('skillset');

```

#### jQuery

After you have added the jQuery reference in index.html, in your main.js file

```function main(){

}

```

#### jQuery Selectors

```function main(){
var \$skillset = \$('.skillset');
}

```

#### hide

```function main(){
\$('.skillset').hide();
}

```

```function main(){
\$('.skillset').hide();
}

```

#### click

```function main(){
\$('.skillset').hide();
\$('.projects').hide();
\$('.projects-button').on('click', function(){

});
}

```

#### show

```function main(){
\$('.skillset').hide();
\$('.projects').hide();
\$('.projects-button').on('click', function(){
\$('.projects').show();
});
}

```

#### toggle

```function main(){
\$('.skillset').hide();
\$('.projects').hide();
\$('.projects-button').on('click', function(){
\$('.projects').toggle();
});
}

```

#### toggleClass

```function main(){
\$('.skillset').hide();
\$('.projects').hide();
\$('.projects-button').on('click', function(){
\$('.projects').toggle();
\$('.projects-button').toggleClass('active');
});
}

```

#### this

```function main(){
\$('.skillset').hide();
\$('.projects').hide();
\$('.projects-button').on('click', function(){
\$('.projects').toggle();
\$(this).toggleClass('active');
});
}

```

#### next

```function main(){
\$('.skillset').hide();
\$('.projects').hide();
\$('.projects-button').on('click', function(){
\$(this).next().toggle();
\$(this).toggleClass('active');
});
}

```

#### text

```function main(){
\$('.skillset').hide();
\$('.projects').hide();
\$('.projects-button').on('click', function(){
\$(this).next().toggle();
\$(this).toggleClass('active');
\$(this).text('Projects Viewed');
});
}

```

#### slideToggle

```function main(){
\$('.skillset').hide();
\$('.projects').hide();
\$('.projects-button').on('click', function(){
//\$(this).next().toggle();
\$(this).next().slideToggle(400);
\$(this).toggleClass('active');
\$(this).text('Projects Viewed');
});
}