Learn JavaScript - Full Course for Beginners

0:00 Beau: This is the Beginner’s Javascript course you are looking for.

0:03 My name is Beau Carnes.

0:06 And I’m with freeCodeCamp.org.

0:08 In this full Javascript course you will learn everything

0:12 you need to know to get started with Javascript.

0:15 This course is perfect for beginners or anyone

0:19 that just wants a refresher on basic Javascript syntax.

0:23 This course actually goes along with the freeCodeCamp.org Javascript curriculum.

0:29 So, if you want some live coding challenges

0:31 to go along with every part of this course,

0:34 you can check the link in the description to that curriculum.

0:37 But this is a completely standalone video.

0:40 So, you don’t need to go through freeCodeCamp.org, but it could be helpful.

0:45 Also, after this course, you’re going to want to complete some,

0:49 or build some Javascript projects.

0:51 So, I have a link in the description to some project tutorials.

0:55 But then after that, you’re going to want to create some projects on your own.

1:00 That’s how you really learn Javascript.

1:02 You have to create things without going through a tutorial and just use

1:05 a search engine to find the things that you don’t know or need to learn.

1:09 To go along with the freeCodeCamp curriculum,

1:11 I have all the ES6 stuff in the second part of this course.

1:16 That’s pretty much it.

1:18 Let’s learn some Javascript.

1:24 [Running Javascript] So, how exactly do you install Javascript?

1:31 Well, for the most part, you don’t.

1:33 Actually, all web browsers can run Javascript.

1:37 Which is great because a lot of devices have web browsers on them.

1:41 So, when you write something with Javascript,

1:44 it will run on all sorts of devices and operating systems.

1:48 So, you have a few options for writing Javascript.

1:51 Let me show you a few things you can do to follow along with this course.

1:56 You could download a code editor.

1:58 Here, I have Sublime Text.

2:01 You can also use Visual Studio Code or Atom or any code editor.

2:06 And I’ve created an HTML file because HTML files can be opened in web browsers.

2:12 And I have these <script> tags– these are HTML tags.

2:17 But within our <script> tags, we have our Javascript.

2:20 So, if I open up this file in a web browser, it looks like this.

2:24 Well, I can open up my Javascript console.

2:28 And in the console, you can see it

2:31 says “hello world.” That’s right from my Javascript program.

2:35 So, whenever you do console.log, it’s going to show on the console here.

2:39 You can also just use the code editor that’s included on freeCodeCamp.org.

2:45 Like I mentioned, this course follows

2:47 along with the Javascript curriculum on freeCodeCamp.org.

2:51 And there’s a built-in Javascript editor right in here.

2:55 And then it shows you the console down here.

2:58 Another option would be to use CodePen.

3:01 If you go to CodePen.io, going to go to Create Pen.

3:05 And then there’s going to be three windows.

3:09 HTML, CSS, and Javascript.

3:11 Well, we just care about the Javascript.

3:13 And in this course, we're not going to be doing anything with HTML and CSS.

3:18 We just need the Javascript and the Javascript console.

3:21 So, if I do console.log and then do (“Hello World”) then we can see right

3:29 in the console "Hello world.” The final thing you can do would be use Scrimba.

3:34 Most of the course I actually recorded using Scrimba.com.

3:38 So, if you want, you can use Scrimba.com to follow along.

3:41 Once you log in, just click the [Plus] button.

3:45 I’m going to [Javascript] [Playground] and then [Confirm].

3:48 And it’s going to open up a new Javascript window.

3:51 Now, I can increase the font size here.

3:54 And it already has console.log “Hello from Javascript.” And you

3:58 can see in the console right here “Hello from Javascript.” Also,

4:01 if you hit [Reload], it reloads everything.

4:04 And you'll see this popup “Hello from Javascript.” So,

4:08 that’s something interesting about Scrimba is that has

4:11 two ways of logging in the console.

4:14 We have the popup and then we have the console here.

4:17 You’ll see that in this course too,

4:19 the two different ways of logging to the console.

4:22 [Comment Your Javascript Code] The first thing

4:27 we'll talk about in Javascript is comments.

4:31 Comments are lines of code that Javascript will intentionally ignore.

4:35 They don’t do anything.

4:37 They’re just used to create notes for yourself

4:40 and others about what the code does.

4:42 So, if you do a// you can make an in-line comment.

4:47 An in-line comment means it’s at the end of a line of code.

4:52 For instance, I can put var number= 5.

4:57 That’s a way to declare a variable.

4:59 And we'll talk more about that later.

5:01 But right now we're just talking about comments.

5:04 You can see that this code is in color because

5:07 the code editor knows that that’s code that’s going to run.

5:11 And the comment is automatically grayed out because it’s not going to run.

5:16 We can also do an in-line comment or I mean a multi-line comment.

5:20 If we do a/* and I can put "this is a,” and then

5:25 I can put "multi-line comment.” And I'm going to end with a*/.

5:31 So, it begins with a/* and ends with a*/.

5:34 And you can put as much text as you want in between these.

5:38 And you can see this is all grayed out because it’s all a comment.

5:42 And then afterwards I can put number= 9 and you can see

5:51 it will be in color again because it’s no longer commented out.

5:55 [Data Types and Variables] Now we're going

6:00 to talk about data types and variables.

6:02 In computer science, data is anything that is meaningful to the computer.

6:07 And Javascript provides seven different data

6:09 types that you can use within Javascript.

6:12 Now, some of the more obvious and most common are strings and numbers.

6:17 A string is just any sort of text.

6:20 A number is a number.

6:22 Now let’s go from the top.

6:24 So, undefined is something that hasn’t been defined.

6:27 You may have a variable that you haven’t set to be anything yet.

6:31 Null means nothing.

6:32 So, you’ve set this to be something and that thing is nothing.

6:37 So, you can say this is null or nothing.

6:40 A boolean means true or false.

6:42 We talked about string.

6:44 A symbol is an immutable primitive value that is unique.

6:49 Now we'll tall more about those later.

6:51 A number is a number.

6:53 And an object can store a lot of different key value pairs.

6:58 Again, we'll talk more about those later.

7:01 Now, you are often going to set data into a variable.

7:06 A variable allows computers to store and manipulate data in a dynamic fashion.

7:13 It’s basically a label to point to the data.

7:17 A variable is almost like a box.

7:19 And you can fill it with anything.

7:21 You’ll fill it with the data that you want.

7:23 So, to declare a variable, one way is to use the var keyword.

7:28 Var stands for variable.

7:30 And I can say myName.

7:32 I can set this to anything.

7:35 It can be any of the datatypes above.

7:37 But it’s common to set something to a string.

7:41 So, I can set my name to be “Beau.” Now later,

7:45 you can set it to be something else.

7:48 I can say myName= 8.

7:52 And you can just set it to other data types later.

7:55 Now, there are actually three ways to declare a variable in Javascript.

8:01 So, var is one of them.

8:03 And for a while, that was the only way.

8:05 But there are other ways too.

8:07 There’s a way called "Let.” So, I can say let ourName= “freeCodeCamp”.

8:16 And then the other thing would be const.

8:21 So, I can do const Pi= 3,1004.

8:26 Now, the difference between var, let, and const,

8:30 a var is going to be able to be used throughout your whole program.

8:34 Let will only be used within the scope of where you declared that.

8:41 Now, we're going to be talking about let and const more later.

8:45 So, I’m just giving you a brief overview of what they are now.

8:47 Const is a variable that should never change.

8:52 It can never change.

8:53 So, like right up here, I declared myName, but then we changed it here.

8:59 So, it started out to be Beau and we changed it to 8.

9:02 Const, you can never change it.

9:04 If you do try to change it, you’ll get an ERROR.

9:07 Okay, that’s all for now.

9:09 But like I said.

9:10 We'll be talking more about the different types of variables later.

9:13 [Storing Values with Assignment Operator] There’s

9:18 a difference between declaring variables and assigning variables.

9:22 Here’s how you assign a variable.

9:24 var a and then a semicolon.

9:26 I didn’t mention this earlier,

9:28 but you end all lines in Javascript with a semicolon.

9:32 Well, it’s not actually required.

9:34 You can actually just skip the semicolons completely,

9:38 but most people recommend that you put a semicolon just

9:41 so it’s obvious where the end of the line is.

9:45 So, here, we are just declaring a variable to be called a.

9:51 And then here, we are assigning a variable.

9:53 We’re declaring and assigning in one line.

9:56 So, we're declaring it “var b” And then

10:00 the equals sign is the assignment operator.

10:03 It means that 2 is being assigned to b.

10:07 We're not checking if b= 2.

10:10 We're just assigning 2 to be.

10:11 So, after that, we can actually assign other things.

10:15 So, I can say a= 7.

10:20 So, now I’ve just assigned 7 to a.

10:24 I didn’t have to declare a because it was already declared.

10:27 And I can also say that b= a.

10:34 So, I’ve now assigned the contents of a to b.

10:39 And I’ll put the semicolon there.

10:41 One thing I want to tell you about is console.log.

10:45 Console.log allows you to see things in the console.

10:49 So, I’m going to console.log(a).

10:52 And if I load this here, you can see down here in the console it shows 7.

10:57 So, right now we've assigned a to be 7.

11:01 And so, when we console.log(a) it shows 7 down there.

11:05 If we put another console.log right here,

11:10 this will allow us to show what a was up here and then down there.

11:15 So, console.log.

11:17 Now, if I run that, we can see at first, a was null.

11:22 And then now it’s 7.

11:23 So, here is null.

11:24 And then it’s 7 down here.

11:26 So, you can check what variables are at various points in your program.

11:29 [Initializing Variables w/ Assignment Operator] Now

11:35 I’ll show you another example of initializing

11:37 a variable to an initial value at the same time it’s declared.

11:42 So, I’m going to say var a= 9.

11:47 So, the var a is declaring it.

11:50 And the= 9 is initializing it with the assignment operator, which is the= sign.

11:56 [Uninitialized Variables] Before we do anything to these variables,

12:03 they are uninitialized.

12:04 That means their value is undefined.

12:07 We have not set them to anything.

12:09 But it’s simple to fix that.

12:11 I’ll just set this to five.

12:13 I’ll set b to 10 and then we can set c to a string.

12:17 That’s going to be “I am a string”.

12:22 And we always have to put it in quotation marks like that.

12:24 So, you can see a+ 1 is going to equal 6.

12:30 5+ 1= 6.

12:31 b= b+ 5.

12:33 That’s going to be 15.

12:35 And then c is now going to say "I am a string”.

12:38 [Case Sensitivity in Variables] Variable names

12:44 and function names in Javascript are case sensitive.

12:48 That means that capitalization matters.

12:51 So, this declaration here is not the same as this assignment.

12:55 Even though letters are the same, the capitalization is not the same.

13:00 So, it’s not going to assign correctly.

13:02 And in here, you’ll see there’s an ERROR if we

13:06 try to run it because this has not been defined.

13:09 It has not been declared.

13:11 It’s generally common practice to use camelCase.

13:16 So, let me show you how we do that instead of StUdLyCapVar,

13:22 it’s going to be studlyCapVar.

13:24 So, the first letter is always going to be lowercase.

13:27 Any time you have a new word or a new section of a word,

13:31 you just capitalize the first letter.

13:32 And so, we can change this.

13:36 This one is correct.

13:38 So, now we just go down here.

13:39 studlyCapVar.

13:42 And then we just do properCamelCase.

13:47 And then titleCaseOver.

13:52 So, now all of these should be defined.

13:55 So, we declare them here.

13:57 We assign them right here.

13:59 And then this is not going to give us any errors.

14:02 It’s going to behave exactly how we want it to behave.

14:05 [Adding Numbers] Adding two numbers in Javascript is pretty straight forward.

14:12 You just use the plus operator.

14:14 So, this says 10+ 0 which equals 10.

14:17 We can also do, 10+ 10 which is going to equal 20,

14:22 if we do a console.log, and I can put sum here.

14:26 And then you’ll be able to see that the answer is 20 right in the console.

14:31 10+ 10 is 20.

14:33 [Subtracting Numbers] And subtraction is also what you would expect.

14:40 We have the subtraction sign here.

14:42 This says 45– 0.

14:44 We can also do 45– 33.

14:47 And then that would equal 12.

14:49 So, the difference variable equals 12 now.

14:52 [Multiplying Numbers] Multiplication in Javascript uses

14:57 this* or a star symbol here.

15:00 So, this says 8* 0 which is 0.

15:04 Or we can change it to 8* 10 which is 80.

15:08 So now the product variable equals 80.

15:11 [Dividing Numbers] You can divide in Javascript with this/ symbol.

15:18 So, this says 66/0.

15:21 We can change this to 33.

15:24 So, now 66/33 is 2.

15:27 Quotient equals 2.

15:30 [Incrementing Numbers] To increment a number means to add 1 to it.

15:36 So, here we’re incrementing myVar by 1.

15:40 So, it starts at 87.

15:42 87+ 1 is 88.

15:44 There is a quicker way to increment a number.

15:47 Instead of doing this, we can just myVar++.

15:52 myVar++.

15:54 And now we have incremented myVar from 87 to 88.

15:58 [Decrement Numbers] We learned about incrementing a number with++.

16:04 You can also decrement a number with--.

16:07 That means subtracting one.

16:09 So, right now, myVar is going to equal 10.

16:12 11-1= 10.

16:15 We can do the same thing with the— operator.

16:18 So, now, myVar still equals 10.

16:21 [Decimal Numbers] We can also create decimal numbers with Javascript.

16:28 These are sometimes referred to as floating point numbers or floats.

16:32 You can see this is one here– 5,700.

16:35 It can be anything.

16:36 I’m going to make one called myDecimal.

16:38 And then I’m going to store a 0,00009.

16:43 Anything that has a decimal point in it, is a decimal point number.

16:47 [Multiply Decimals] Multiplying decimal point or floating

16:53 point numbers is the same as multiplying integers.

16:57 So, we have 2,000 times 0,000.

16:59 If I just change this to 2,500, now the answer to product is going to be 5.

17:06 And I can console.log that so you can see.

17:10 If I just put (product).

17:13 And then if we do the browser here, you’ll see that the answer is five.

17:17 [Divide Decimals] You can also divide decimal point numbers.

17:23 So, in this case I’m going to change this to 4,400.

17:27 So, now the answer to quotient is 2,200.

17:30 Quotient equals 2,200.

17:33 [Finding a Remainder] The remainder operator looks like a%.

17:39 And it gives the remainder of the division of two numbers.

17:43 So, for instance, if I want to find out the remainder of 11 divided by 3,

17:50 I can do remainder= 11.

17:53 And then I’m going to put the percent sign%, which is the remainder operator, 3.

17:57 And 11 divided by 3 is 9.

18:01 11-9 is 2.

18:03 So, the remainder is going to be 2.

18:06 11 remainder 3 is 2.

18:08 The remainder operator is often used to determine if a number is even or odd.

18:14 If you can divide a number by 2 and the remainder is 0,

18:19 that means the number is even.

18:21 [Compound Assignment with Augmented Addition] It’s common to want

18:26 to add a number to a variable like this.

18:29 See, A= A+ 12.

18:31 Well, A starts at 3, plus 12 is 15.

18:33 So, we're just adding 12 to whatever A is.

18:36 Here we're adding 9 to whatever B is.

18:38 Here, we’re adding 7 to whatever C is.

18:41 This is such a common pattern that there’s a shortcut to do the same thing.

18:45 It’s the+= operator.

18:48 So, instead of A= A+ 12, we can do A+= 12.

18:55 So, this equals the same thing.

18:58 So, instead of B= 9+ B.

19:00 We can do B+= 9.

19:06 So, now we're adding the value to the variable

19:10 and assigning the answer to that variable.

19:14 So, again here, we can do+= 7.

19:19 So, that’s just a shortcut.

19:21 [Compound Assignment with Augmented Subtraction] Previously, we learned about+=.

19:28 Well,-= does the same thing, but subtracting.

19:31 So, this says A= A- 6.

19:35 We started at 11, minus 6 is going to be 5.

19:39 So, the new A is going to be 5.

19:42 But we can shorten that.

19:44 Instead of A= A- 6, we can do-=.

19:49 This is just a shortcut that Javascript has that means the same thing.

19:53 That means A= A- 6.

19:57 But it’s shortened.

19:59 Same here.

20:00 So, we can do-= 15.

20:02 C= C- 1.

20:05 We can do C-= 1.

20:08 So, it just subtracts the number from the original

20:13 value and then assigns that new value to the variable.

20:17 [Compound Assignment with Augmented Multiplication] Here we have A= A* 5.

20:23 Well, we can do the same thing as before.

20:26 We can shorten this to A*= 5.

20:32 So, that means the same thing.

20:34 Here, we can do A*= 3.

20:39 And then C= C* 10.

20:42 We can shorten this to C*= 10.

20:47 And that’s another shortcut for Javascript.

20:50 [Compound Assignment with Augmented Division] And there’s also a/=.

20:56 So, A= A/ 12.

20:59 We can do A /=12.

21:03 And here, we can just do /=4.

21:08 Or/= 11.

21:11 So, another way of just dividing the variable

21:14 by a new number and assigning that answer to the variable.

21:18 [Declare String Variables] We’ve already mentioned strings a little bit.

21:25 But anytime you have some characters surrounded by quotation marks,

21:28 they can either be single quotation marks, double quotation marks, or backticks.

21:34 It’s a string.

21:35 These are called "String literals.” And you

21:38 can create them just like you see above.

21:41 I’m going to do a few more.

21:43 So, var myFirstName= “Beau”.

21:48 And var myLastName= “Carnes”.

21:56 So, that’s how you create a string in Javascript.

22:00 [Escaping Literal Quotes in Strings] Sometimes

22:05 your string contains the quote symbol.

22:08 Now, normally the quotes identify the beginning and the ending of the string.

22:13 But what if you assign like this?

22:14 “I am a ‘double quoted’ string inside ‘double quotes.’” I’m

22:27 actually trying to use these quotes right inside the string,

22:34 but the Javascript doesn’t know what to do about it.

22:38 It thinks that this is the whole string.

22:41 When it sees the first quote inside the string,

22:44 it thinks we're at the end of the string.

22:47 So, there’s something called an escape character.

22:51 So, if you want to escape a quote,

22:54 that means it will no longer be considered the end of the string.

22:59 I’m going to put a\.

23:02 So, if I put a\ before each of these quotation marks,

23:06 Javascript no longer interprets as being the last character in the string.

23:13 So, now you can see this is a full string.

23:17 And then if I log this count console.log and I put (myStr),

23:24 you’ll see that it’s not going to show the quotation marks.

23:27 So, I mean it’s not going to show the/ and the\.

23:32 It shows the quotation marks without the\ because when we

23:36 put\” Javascript knows that this should just mean a quotation mark.

23:43 [Quoting Strings with Single Quotes] We talked about escaping

23:48 a quote character like this, where you put a\ before

23:52 the quote character so Javascript knows that this is

23:55 supposed to be a literal quote character inside the string.

23:59 However, you’re not going to have to escape

24:01 quote characters very often because there are

24:04 other methods of accomplishing the same thing

24:06 of having a quote character within a string.

24:09 So, a common way is to use– instead

24:12 of having your string start with double quotes,

24:15 have it start with a single quote.

24:18 So, a string can either be surrounded by ‘single quotes’ or “double quotes”.

24:24 So, this time we're just going to have ‘single quotes’.

24:30 And now I can remove all of these escape characters from inside the string here.

24:37 Okay, so now you can see that Javascript still knows that this is a string,

24:47 even though it has these double quotes inside.

24:51 An additional thing you can do is use backticks.

24:55 So, if I put backticks before– at the beginning and the end of the string,

25:02 now I actually can use single quotes and double quotes both within the string.

25:08 But right now, I’m just going to focus on showing you

25:11 the double quotes or the single quotes with the “double quotes” inside.

25:17 [Escape Sequences in Strings] We talked about escaping a double

25:24 quote character by using the\ before the double quote.

25:27 There’s actually quite a few other things you can escape out.

25:30 You can escape out a single quote character.

25:33 You can escape out a backslash.

25:36 In fact, anytime you’re going to use a\, you’re going to have to put

25:40 two backslashes so the Javascript knows

25:42 that you’re not trying to escape a character.

25:46 You can also add a new line character, or a carriage return, a tab,

25:54 a backspace, or a form feed,

25:57 all with doing a slash and the corresponding letter here.

26:01 So, let me show you an example.

26:03 I’m going to put a var myString= and we're going to make a multiline string.

26:10 So, we're going to have the “FirstLine.” And now,

26:13 I’m going to put \n to add a second line.

26:18 And then I’m going to put a tab.

26:21 So, \t for the tab.

26:23 And\\ to add a\.

26:27 Now, it’s going to say SecondLine.

26:29 Now, I’ll do a\ and then I’ll just say ThirdLine.

26:34 And if I were able to logout all of that, you would see three different lines.

26:40 And you would see the tab and then the backslash character.

26:45 [Concatenating Strings with Plus Operator] You

26:49 can concatenate strings with the+ operator.

26:52 You can see here that we have two strings.

26:55 “I come first” and “I come second”.

26:58 They’ve been added together or concatenated with this.

27:02 So, the ourStr, our string, is now one long string that says "I come first.

27:10 I come second”.

27:11 I’ll give you another example here.

27:14 So, we can say, myStr= “This is the start.”

27:20 And then I’m going to put a space before the end

27:24 quotation mark because when these get concatenated together we

27:27 want there to be a space between these two sentences.

27:30 And I’ll say "This is the end.” Now let’s just see what that looks like.

27:35 I’ll do a console.log.

27:38 And do a (myStr) and let’s see.

27:42 If I run this, we can see “This is the start.

27:45 This is the end.” Just one long string.

27:48 [Concatenating Strings with Plus Equals Operator] You

27:52 can also concatenate strings using the+= operator.

27:56 You can see here in this example we have the ourStr= “I come first”.

28:02 And then we have the ourString+= “I come second.” So, remember,

28:08 just like when you’re using numbers,+= means that you take whatever

28:13 is on the end here and add it to the variable.

28:18 So, we’ve just added "I come second.” onto the end

28:22 of “I come first.” Let’s do another example down here.

28:25 myStr= “This is the first sentence.” And then

28:31 I’ll put a space at the end because we're going to do a, myStr– and here

28:39 I’ll do the+= “This is the second sentence.” Now,

28:45 if I just do a console.log here of (myStr)

28:49 we should see that those sentences have gone together.

28:54 “This is the first sentence.

28:56 This is the second sentence.” Good.

29:00 [Constructing Strings with Variables] You

29:04 can concatenate strings together with variables.

29:07 You can see here ourName= “freeCodeCamp”;.

29:10 “Hello, our name is“ and then we add this variable,

29:14 the ourName variable which is freeCodeCamp.

29:17 “Hello, our name is freeCodeCamp.

29:19 How are you?” Well, we're going to do the same thing down here.

29:22 So, I’m going to do myName= “Beau”;.

29:26 And then myStr is going to equal “My name is“ And then

29:36 I’m going to add the variable name which is my name.

29:40 And then I’ll continue the string here.

29:43 That’s supposed to be a+ here.

29:47 and I am well!” See that I put a space here

29:53 and here because you have to make sure you put appropriate spaces in.

29:58 And let’s see what that looks like.

30:00 I’ll do a console.log.

30:02 I’ll just put (myStr) here.

30:06 If I show that "My name is Beau and I am well!” Looks good.

30:13 [Appending Variables to Strings] You can

30:18 append variables to strings with this+= operator.

30:21 You can see where this variable anAdjective which is set to the word “awesome”.

30:26 And then we have another variable "freeCodeCamp is“.

30:30 And then we have the ourStr variable+= anAdjective.

30:34 So, now our string is going to equal “freeCodeCame is awesome!”.

30:40 So, let me show you another example.

30:43 We're going to say someAdjective= “worthwhile”.

30:51 And now, I’m going to use the+=, so myStr+= and then I can put someAdjective.

31:00 So, now after we do the myStr+= someAdjective,

31:05 myStr is going to say “Learning to code is worthwhile.” [Find Length

31:12 of String] Sometimes you want to find the length of a string.

31:17 Javascript makes this easy.

31:19 So, we have the firstName is set to “Ada”.

31:21 But we just use the .length property to find the length.

31:26 So, firstName.length.

31:28 Remember, firsName is “Ada” here.

31:30 And then .length will return an integer,

31:32 a number that has the number of characters in the string.

31:36 So, that will be three.

31:37 So, let’s try this again.

31:39 Here’s another example.

31:40 lastNameLength= lastName.

31:42 We just have to type in .length.

31:45 And just to show you,

31:47 let me console.log that and you'll be able to see if I put in (lastNameLength)

31:52 and if I run that you'll see 8

31:56 because there are 8 characters in the word “Lovelace”.

32:00 [Bracket Notation to Find First Character in String] Bracket notation is

32:05 a way to get a character at a specific index within a string.

32:09 So, you can see right here, we have the firstName= “Ada”.

32:13 And right here we the have firstName.

32:16 And then here’s the bracket notation.

32:16 You can see there’s brackets with a number inside.

32:19 So, most modern programming languages like Javascript

32:23 don’t start counting at 1 like humans do.

32:27 They start at 0 which is called "Zero-based Indexing.” So, with the number 0,

32:34 that refers to first index of the string which would be the A.

32:39 So, the A would be 0.

32:41 D= 1.

32:42 And then A= 2.

32:44 So, this first letter of firstName,

32:47 if we do firstName with the bracket notation with a zero, that’s going to= A.

32:53 So, let me show you another example.

32:55 Let’s say we want to get the first letter of the last name.

33:01 Again, I’m just going to do the bracket notation and put a zero here.

33:05 If I wanted the second letter, the O, I would put a 1 here.

33:10 So, if I console.log we can see what it came up with.

33:14 So, console.log.

33:18 (firstLetterOfLastName).

33:20 And if we look in the console "L” because

33:23 the first letter of the last name is L.

33:26 [String Immutability] Strings are immutable,

33:31 meaning they cannot be altered once created.

33:35 This does not mean that they cannot be changed,

33:38 just that the individual characters of a string literal cannot be changed.

33:43 So, look at this example.

33:45 myStr and then we're going to use bracket notation to choose the first letter.

33:50 So, it currently says "Jello World”.

33:52 We want the first letter to change to an H to say “Hello World”.

33:56 But if I run that, there’s going to be

33:59 an error because of the immutability of strings.

34:02 Now, we can still change this to “Hello World”

34:05 but we can’t just change an individual letter like that.

34:08 So, we're going to have to do myStr= and I’m just going

34:13 to have to type in the whole thing which is “Hello World”.

34:17 And now, it will change to the word “Hello World.” [Bracket Notation to Find Nth

34:24 Character in String] You can use bracket notation

34:28 to get any character position in a string.

34:30 So, earlier we did the first position,

34:33 but here’s how you get the second position.

34:36 Remember, the 0 index.

34:38 So, [1] is the second position.

34:40 [0] is the first position.

34:41 We can also get the third letter of the last name using the brackets.

34:46 We’ll just put [2] in the brackets to get the third letter of the last name.

34:51 [Bracket Notation to Find Last Character in String]

34:55 You can also use bracket notation to find

34:57 the last letter in a string even if you

34:59 don’t know how many letters are in the string.

35:01 You do it based on the length.

35:04 So, if you look really here,

35:06 in the brackets we have an expression to be evaluated.

35:10 [firstName.length-1].

35:13 So, the length is 3.

35:15 3-1 is 2.

35:18 The reason why we’re doing a -1 is because remember we count starting at 0.

35:23 So .length-1 is going to be the last index of the name.

35:28 So, you can do that same thing here to get the last letter of the last name,

35:33 I can just do lastName[lastName.length- 1].

35:42 And that’s going to get the last letter

35:44 of the last name which is the E right here.

35:47 [Bracket Notation to Find Nth-to-Last Character in String] We saw how

35:52 to use bracket notation to get the last letter of a string.

35:55 You can also do the third to last letter or fourth to last letter.

36:00 So, you just subtract however much you want from the length of the string.

36:05 So, we have the bracket notation, [firstName.length- 3].

36:10 That’s going to get the third to last letter.

36:13 So, we want the second to last letter.

36:15 Into this variable here we do something similar.

36:18 We just do [lastName.length].

36:21 And then we're going to subtract 2 to get

36:25 the second to last character of the string.

36:28 [Word Blanks] We’re going to use our knowledge

36:34 of strings to build a Mad Libs style word game.

36:37 In a Mad Lib game you are provided sentences with some missing words like nouns,

36:43 verbs, adjectives, and adverbs.

36:45 And then you fill in the missing pieces with words of your choice to make

36:49 a sentence that could be funny and hopefully makes a little bit of sense.

36:53 So, let me show you how you do this.

36:56 This also uses a function.

36:59 Now, we haven’t talked about functions yet.

37:02 I’m going to explain those more later.

37:05 But for now just go with it because that’s not the point of this lesson for now.

37:10 But this function called wordBlanks,

37:12 you can call the function and you have to pass in certain types of words.

37:18 You pass in a noun, an adjective, a verb, and an adverb.

37:23 So, down here, you can see that we're calling the function called wordBlanks.

37:30 That’s the function name here.

37:31 And we're passing in a noun, an adjective, a verb, and an adverb.

37:37 So, the point is that we are going to use

37:40 all these words that are passed in to make a sentence.

37:45 So, we know that var result= an empty string at first.

37:50 And then we have to use all these words in result.

37:54 And then the result is going to be returned from this function.

37:58 And eventually, it’ll be logged out onto this screen with this console.log.

38:03 So, what I’m going to do here is do result+=.

38:10 We're going to use the+= to add something to this result using all the noun,

38:16 the adjective, the verb, and the adverb.

38:19 So, let’s see.

38:20 It’s going to say “The“ and then we'll use the adjective myAdjective.

38:30 In this case, the big.

38:33 The big and then let’s put the noun.

38:37 myNoun because adjectives are words that describe nouns.

38:43 The big dog.

38:45 And then we're going to say what this now is doing– the verb.

38:49 myVerb.

38:52 The big dog ran.

38:55 And then where does he run to?

38:58 “to the store”.

39:02 And then we're going to add– oh, we need a space here.

39:05 So, there’s a space between“ to the store“.

39:09 And then we're going to add the final adverb.

39:14 So, now, we have to add a period.

39:18 And there’s one more thing we have to add, or a few more things.

39:24 So, right now myAdjective, myNoun, myVerb.

39:27 And there’s no spaces in between those.

39:29 So, if I run that you can see what that’s going to look like in the console.

39:33 It just said, with no spaces.

39:38 So, we're going to have to add some spaces in here also.

39:41 Let’s do that.

39:50 And now, it’s going to take in the noun, adjective,

39:54 verb, and adverb and then put it into that sentence.

39:57 So, one cool thing is we can actually pass in some different words.

40:03 So, like for instance, if I copy this, I’m going to paste it.

40:08 Instead of “dog” I will put for the noun “bike”.

40:13 And an adjective I’ll put “slow”.

40:18 And then for the verb, I’ll put “flew”.

40:25 And the adverb I’ll put “slowly”.

40:32 And now if we look in the console we have two sentences.

40:37 The big dog ran to the store quickly.

40:40 The slow bike flew to the store slowly.

40:44 [Store Multiple Values with Arrays] Arrays allow you

40:49 to store several pieces of data in one place.

40:52 So, look at this example, ourArray.

40:55 Now, arrays always start with a bracket and then end

40:58 with a bracket to show the beginning and ending of the array.

41:01 And every element in the array is separated by a comma.

41:06 So, you can see here the first element is a string.

41:09 The second element is a number.

41:11 And you can have more and more elements.

41:14 You just put comma and you can keep adding elements.

41:17 And the elements can be any data type.

41:19 You can see here we have a string and a number,

41:24 but you can also use arrays or floating numbers

41:27 or really any sort of data type in your array.

41:31 So, lets see another example.

41:33 So, let’s do myArray= [“Quincy”].

41:37 And then for a number we’ll do 1 because Quincy is number 1.

41:43 [Nested Arrays] When one of the elements in an array is another array,

41:50 that’s called a nested array or a multidimensional array.

41:54 You can see here’s the beginning of the array and here’s the end of the array.

41:58 But the first element in this array is

42:00 another array with two elements of its own.

42:03 Same with here.

42:04 The second element is an array.

42:06 So, this is two arrays within another array.

42:09 So, we can do that here.

42:11 Here’s another example.

42:13 So, let’s our first element in the array will

42:16 be an array with a string and a number.

42:20 And then I’ll put a comma to put the second element

42:24 of the array which will be another array with a string and a number.

42:31 [Accesses Array Data with Indexes] Earlier we learned how to use

42:38 bracket notation to find a specific index in a string.

42:41 You can do the same thing with arrays.

42:43 So, look at this array, ourArray.

42:46 We have three elements.

42:48 [50, 60, 70].

42:49 And these have the indexes [0, 1, 2].

42:54 So, with this ourArray with the bracket notation and the [0],

42:58 that’s going to be index 1, which is going to equal 50.

43:02 So, we can do the same thing here.

43:04 myArray= [50, 60, 70].

43:07 So, let’s try to find the first element in that array.

43:10 So, var myData= myArray.

43:18 And then I’m going to do index [0].

43:21 I can do index [1], index [2].

43:23 And then if we console.log that, we can see for sure what that is.

43:27 So, if I put (myData) and we can see in the console it’s 50.

43:33 [Modify Array Data With Indexes] You can use array indexes to modify arrays.

43:41 Now, we tried to do this earlier with strings using bracket notation

43:46 and we were not able to modify a string using bracket notation.

43:50 But with arrays, you can.

43:53 So, the original array is [18, 64, 99].

43:56 And then we're going to use the array index of [1].

44:00 Now, [1] is going to be the second number.

44:03 Remember, [0, 1, 2].

44:05 And this number 64 is going to be set to 45.

44:08 So, the new array is going to be [18, 45, 99].

44:13 Let’s try it again with this, [18, 64, 99].

44:17 So, let’s do myArray and then instead of doing the second digit,

44:26 I’m going to do the first digit in then array,

44:28 the first index which would be index [0].

44:29 And I will say= 45.

44:33 So, now this array has been updated.

44:36 So, if I do a console.log and then do (myArray],

44:41 we'll see that the array is now [45, 64, 99].

44:46 [Access Multi-Dimensional Arrays With Indexes] You can also use bracket notation

44:54 to select an element in a multi-dimensional or array of arrays.

44:59 So, you can see this array here, we have our outer array.

45:02 But inside that array are more arrays.

45:05 The elements of the array are other arrays.

45:08 And the last element of the array actually has an array in this.

45:13 So, this is a three-layer deep array right here.

45:16 So, to access an array of arrays

45:19 or an element within an array that’s within an array,

45:23 you use a double bracket notation.

45:26 So, if you see this example here, myArray, the first bracket is [0].

45:31 That’s going to get the first element in the array which will be right here.

45:35 And then that element is an array.

45:38 So, the second bracket would be the index of the array within the array.

45:44 So, this zero would point to here.

45:46 So, let’s try to figure out how we can select a value equal to 8.

45:52 Well, let’s see.

45:53 I see an 8 right here.

45:55 So, let’s figure out what this first number should be.

45:57 Well, let's count.

45:59 Zero, one, two.

46:03 So, the third array would be index [2].

46:07 Now, we want to go zero,

46:09 one– now we have to do index [1] to get the second number in the third array.

46:15 So, let’s test to see if that equals 8.

46:18 So, I’ll do a console.log and then do (myData) here.

46:24 And we'll see if that equals 8.

46:27 And it does.

46:29 We did it.

46:30 [Manipulate Arrays with push()] You can have pinned data

46:35 to the end of an array with the push function.

46:38 So, see, an array has been set up here, ourArray.

46:41 [“Stimpson” "J” "cat”] And then we take ourArray right here and use the push

46:48 function to push into the next element in the array another array here.

46:53 So, now it’s going to look like this.

46:56 We can see at the end of the original array,

46:58 we’ve pushed this other array at the end.

47:01 So, let’s try it again down here.

47:03 We have myArray.

47:04 And you can see we have each element in the array is another array.

47:08 So, I am going to do myArray.push().

47:15 And then I can push something on the end

47:17 here which will be like above, another array.

47:19 So, this is going to say [“dog”, 3].

47:24 And now we've pushed this onto the array.

47:28 [Manipulate Arrays with pop()] We can remove an item

47:34 from an array with the pop() function here.

47:36 So, see this pop() here?

47:38 And then we know it’s a function because

47:40 of the parenthesis at the end of the word pop.

47:42 So, the array starts with [1,2,3].

0:00 So, now we do this— ourArray.pop() and it’s

0:00 going to remove the last element which

47:46 is the 3 and then it’s going to put it right into this variable here.

47:57 So, now as you can see down here, removedFromOurArray now equals 3.

48:02 And then ourArray is going to equal [1,2] because the 3 has been popped off.

48:08 So, we can do the same thing here.

48:09 So, removedFromMyArray= myArray.pop() and we can see what the array

48:19 is going to equal now if I just do a console.log(myArray).

48:23 And if you do this, we can see that the array only has the one item,

48:29 the one array instead of the two arrays.

48:31 [Manipulate Arrays with shift()] The shift function

48:37 is very similar to the pop function

48:39 except it removes the first element of the array instead of the final element.

48:44 So, we see the shift function on the end of the array here.

48:49 And the array is the same as before.

48:50 But now the first element “Stimpson” is being removed.

48:54 After we shift off the first element the array is going to equal “J” "cat”.

49:00 And the removedFromOurArray is going to equal “Stimpson”.

49:03 So, let’s do another example down here.

49:06 We're going to do a shift() again.

49:08 So, I’m going to do= myArray.shift().

49:11 And now myArray is just going to equal [“Dog”, 3].

49:17 And the removedFromMyArray is going to equal [“John”, 23].

49:21 [Manipulate Arrays with unshift()] The unshift() function

49:27 is similar to the push() array function.

49:30 While push() adds an element to the end of the array,

49:33 unshift() adds at element to the beginning of the array.

49:37 So, let’s look through this example code.

49:39 We have the array– [“Stimpson” "J” "cat”].

49:42 We're going to shift off the first element, remove the first element.

49:47 So ourArray is [“J” "cat”].

49:49 Now, we're going to unshift() or add an element

49:52 at the beginning which is the string “Happy”.

49:55 So, the array will now be [“Happy” "J” "cat”].

49:59 So, let’s try again.

50:01 This time the array is [[“John”, 23], [“dog”, 3]].

50:06 Because of the shift, we’ve shifted off the [“John”, 23].

50:11 And now I’m going to unshift() something.

50:15 So, I’ll do myArray.unshift().

50:20 Now we're going to add something to the beginning of the array.

50:24 We’ll do ([“Paul”, 35]).

50:29 So, now the array is just going to be [[“Paul”, 35], [“dog”, 3]].

50:35 [Shopping List] Let me give you another example of nested arrays.

50:42 This will be a shopping list.

50:45 So, inside this array we're going to have another array.

50:47 And we're going to have items.

50:50 Cereal– how many boxes?

50:52 3 boxes.

50:53 We also need some milk.

50:57 Let’s get two cartons of milk.

51:01 Let’s get some bananas.

51:05 Three bunches of three bananas.

51:12 We'll also get some juice.

51:18 Two containers of juice.

51:23 And finally, we will get some eggs.

51:28 We'll get 12 eggs.

51:34 And now we've created an array of arrays which is our shopping list.

51:40 [Write Reusable Code with functions] Functions allow

51:45 us to create reusable code in Javascript.

51:48 This is how a function is set up.

51:51 We have the word function.

51:53 Then we have the function name.

51:55 There’s always parenthesis here.

51:58 And you can pass information into the parenthesis.

52:02 We'll talk about that later.

52:04 And then we have these curly brackets.

52:06 So, this is the opening curly bracket{.

52:10 And then we have the closing curly bracket}.

52:12 And everything inside the curly bracket is

52:16 run anytime the function is called or invoked.

52:21 So, here the function is being called by just

52:26 putting the function name with parenthesis after the name.

52:30 So, every time this function is called,

52:33 just like this, the console is going to say "Heyya, World”.

52:38 So, if we load the console right now you can see it says "Heyya, World”.

52:42 And if I just copy this and paste it a few

52:46 times we'll see that it’s going to say "Heyya, World.

52:49 Heyya, World.

52:50 Heyya, World” in the console.

52:52 Since we have run the function three times,

52:55 we see the words “Heyya, World” three times.

52:58 So now I’m going to create my own function that’s going to be very similar.

53:03 So, we'll do function reusable function().

53:10 And this time it’s going to say something slightly different.

53:14 It’s going to say “Hi world” instead of “Heyya,

53:23 World.” And now I can call the function down here,

53:28 just like this– reusableFunction.

53:30 Oh, forgot to put the parenthesis.

53:34 That’s important.

53:35 Now you see "Heyya, World” and “Hi World” in the console.

53:40 [Passing Values to Functions with Arguments] Parameters

53:45 are variables that act as place holders

53:48 for the values that are to be input to a function when it is called.

53:52 So, we have defined a function right here called ourFunctionWithargs.

53:57 And inside the parenthesis we see the letters (a, b).

54:02 Now, these could be any name.

54:05 We could call these anything, not just (a,b).

54:08 They can really be any words up here.

54:10 And that means that when this function is

54:14 called we're going to pass data into the function.

54:19 Or input data into the function.

54:21 So, you can see the example here where we're calling the function.

54:26 And instead of saying, (a,b) in the parenthesis,

54:29 we're actually passing the values (10, 5).

54:32 So, when the function runs,

54:34 it can use the information that’s passed into the function.

54:38 So, in this case it says console.log(a-b).

54:42 Well, that’s going to be 10-5 because the numbers

54:46 10 and 5 have been passed into the function.

54:49 And that’s going to output 5.

54:52 So, I’m going to create a function that’s very similar to that that function.

54:56 This one is going to be called functionWithArgs.

55:02 And it’s also going to accept an (a, b), but we could call it anything we want.

55:08 And inside instead of subtracting a-b, we're going to do (a+b).

55:17 Now, I’m just going to call this function functionWithArgs and I’ll pass in (10,

55:28 5) and let’s see what that looks like in the console.

55:36 So, first it outputted 5 for this one.

55:40 And then it output 10 for this one.

55:42 [Global Scope and Functions] Scope refers to the visibility of variables.

55:50 Variables which are defined outside of a function block have global scope.

55:55 Global scope means they can be seen everywhere in your Javascript code.

56:00 For instance, I’m going to declare a variable right here called myGlobal.

56:05 I’ll set it to 10.

56:07 Now since this is set outside of a function,

56:10 we can see it anywhere in the whole code.

56:14 Even in this function right here called fun2.

56:18 We can see that we reference it here and here.

56:22 And we're going to be able to see it.

56:24 Now, this is an if statement.

56:27 Which we will talk more about later.

56:30 But we're checking if the type of myGlobal does not equal “undefined”.

56:37 So, it will not equal “undefined” if it has

56:42 been defined and the program knows about the variable.

56:46 Since this is global scope, it does not equal undefined.

56:52 It equals 10.

56:53 The program knows about the variable because this is in global scope.

56:56 So, since this function can access the myGlobal variable,

57:02 it will run what’s in this if statement

57:06 where we just add to this output variable, myGlobal.

57:11 And then we put the value of myGlobal which is 10.

57:13 Now, here’s another example where we're going

57:17 to see if the type of oopsGlobal equal “undefined”.

57:22 Well, we're going to set that here.

57:24 So, it is possible to set a variable without using the var keyword.

57:32 So, I’m going to set this to oopsGlobal= 5.

57:39 So, you can see here that there is no var keyword.

57:45 So, normally if you do use a var keyword,

57:49 since this is within a function, it will be scoped to that function.

57:55 If we have the var keyword here, this would be scoped to this function so you

58:01 would not be able to see it in this function.

58:04 However, since we forgot to put the var keyword in this example,

58:10 there’s no var keyword, it becomes global automatically.

58:15 That means you can access it anywhere else in the program including here.

58:21 So, if we put the var keyword, then oopsGlobal would equal “undefined”.

58:30 And then we would never have this line in the output.

58:34 However, since we did not put the var keyword,

58:38 oopsGlobal= 5 and this will be added

58:42 to the output– oopsGlobal and then the colon 5.

58:46 So, when we console.log the output it’s going to say myGlobal 10, oopsGlobal 5.

58:54 Now actually it’s not going to say that because this is in Scrimba.

58:59 And in Scrimba it’s more careful and just enforces

59:03 the fact that you have to use a var keyword.

59:07 But if we were in our browser it would not enforce the var keyword.

59:12 And then it would actually show myGlobal 10, oopsGlobal 5.

59:18 If this was a little complicated,

59:21 don’t worry about that because a lot of these concepts

59:25 we’ll be going over again later with additional examples.

59:29 [Local Scope and Functions] Variables which are declared within

59:36 a function as well as the function parameters have local scope.

59:41 That means they’re only visible from within the function.

59:44 Let me show you what I mean.

59:46 If I declare a variable right here, myVar= 5.

59:51 So, we've declared this variable inside a function.

59:56 So, this variable, myVar is only visible inside the function.

1:00:02 So, it says console.log(myVar).

1:00:04 It should console.log the 5.

1:00:07 So, we're going to call the function here.

1:00:10 And it’s going to console.log myVar.

1:00:12 But then the program is going to run

1:00:14 this console.log that’s outside of the function.

1:00:17 It’s still going to try to access myVar.

1:00:20 And so, let’s see what happens.

1:00:22 You can see in the console that first

1:00:26 there’s a 5 because it console.log within the function,

1:00:30 then there’s an error because it tried to access myVar outside of the function.

1:00:36 So, really, we just need to delete this where

1:00:38 we try to access the variable outside of the function.

1:00:42 And now there is no error.

1:00:45 [Global vs Local Scope in Functions] It is possible

1:00:50 to have both local and global variables with the same name.

1:00:54 When you do this, the local variable takes precedent over the global variable.

1:01:00 Let me show you an example.

1:01:02 Here we have a function called myOutfit that’s going to return outerWear.

1:01:09 That’s this variable up here.

1:01:11 This is a global variable because it is declared outside of the function.

1:01:17 So, when we console.log the output of the myOutfit function,

1:01:25 the myOutfit function is going to return outerWear which is the word “T-Shirt”.

1:01:30 So, let’s just check the console and you can see, yep "T-Shirt” is there.

1:01:35 However, let’s change this up a bit.

1:01:38 So, you have some space here because I’m going to put var outerWear= “sweater”.

1:01:48 So, now if I run this program you can see

1:01:54 in the console it’s going to say “sweater” instead of “T-Shirt”.

1:02:00 It’s because this local variable outerWear

1:02:04 took precedence over the global variable.

1:02:08 Another interesting thing about this, if I do a console.log.

1:02:13 And I console.log the outerWear variable,

1:02:18 we'll see that it’s still “T-Shirt.” So,

1:02:23 first you see in the console it says sweater and T-Shirt.

1:02:26 So, first we console.log this function which is sweater– it returns sweater.

1:02:33 And then we console.log the global variable which is T-Shirt.

1:02:39 [Return a Value from a Function with Return] You can

1:02:43 return a value from a function with this return statement.

1:02:46 So, we have this function here.

1:02:49 And we’re passing a number into it– the num.

1:02:52 And then it’s going to return whatever is after the return keyword.

1:02:58 In this case, num-7.

1:02:59 So, here we're going to console.log the function.

1:03:02 And it returns the result of -7, is this 10-7, which is 3.

1:03:10 So, it’s going to console.log the number 3.

1:03:12 If we look in the console, yep,

1:03:15 it console.log the number 3 because the function returns 3.

1:03:19 Let’s try creating another one.

1:03:22 This function is going to be called timesFive.

1:03:28 Again, we'll pass in a number.

1:03:30 And it’s just going to return something.

1:03:33 It’s going to return the num* 5.

1:03:40 And then just like before, we can test it using a console.log (timesFive)

1:03:46 and we'll pass in the number 5 here.

1:03:49 And if I run this, we'll see that it retuns the number 25.

1:03:55 [Understanding Undefined Value Returned from a Function]

1:03:59 Functions can have return statements, but they don’t have to.

1:04:03 In this case, this function adds 3 to the sum variable

1:04:07 which is a global variable because it’s defined before the function.

1:04:12 It does not return anything.

1:04:14 So, if you don’t specify a return value, the return value is just undefined.

1:04:20 Now I’m going to create another function that is similar.

1:04:23 This is going to be called addFive().

1:04:27 And this time we'll just do sum= sum+5.

1:04:36 Or we can shorten this to use the+=.

1:04:42 So now that’s going to add five to the sum also,

1:04:45 but it’s not going to return anything.

1:04:47 So, if we log this out, it would be undefined.

1:04:51 [Assignment with a Returned Value] It’s simple

1:04:56 to assign a returned value to a variable.

1:04:59 See right here we have the function change.

1:05:03 And you pass in a number and it’s

1:05:06 going to return the result of this mathematical expression.

1:05:09 So, when we call the function change and pass in the 10,

1:05:13 the value that is returned from this function

1:05:16 is going to be stored in this variable here.

1:05:19 We can do the same thing down here.

1:05:22 First we initialize the variable processed and processedArg.

1:05:26 It’s going to return the result of this mathematical expression.

1:05:31 So, I can set processed to equal what this function returns.

1:05:39 So, I can say processedArg.

1:05:42 And then I’ll just pass in the number 7 here.

1:05:46 And now processed equals the result of this mathematical expression.

1:05:51 [Stand in Line] In computer science a cue is

1:05:57 an abstract data structure where items are kept in order.

1:06:01 New items can be added to the back of the cue

1:06:04 and old items are taken off from the front of the cue.

1:06:07 We're going to simulate that right now,

1:06:10 some of the functionality of a cue using this nextInLine function.

1:06:15 So, the purpose of this is to show that in this nextInLine

1:06:20 function you can add an item to the array that’s passed in.

1:06:24 And then it’s going to return the first item on the list.

1:06:29 For instance, if we have this array right here,

1:06:33 if we add an item to this array it should come after at the end.

1:06:39 So, it should come after 5.

1:06:41 And then it should return the first item on the list.

1:06:44 In this case, it’s 1.

1:06:47 So, you see, we had some console.log set up.

1:06:50 So, it should show what the list looks like, the array looks like beforehand.

1:06:55 And then show what it looks like afterwards.

1:06:57 This JSON.stringify is just a way to change an array

1:07:02 into a string that can easily be printed out to the screen.

1:07:08 So, to do this, we're just going to have

1:07:11 to do two things that we've learned about already.

1:07:14 So, the first thing is to add the item onto the list.

1:07:19 So, we see right here, nextInLine passed in the testArr and 6.

1:07:25 So, we're calling this function nextInLine.

1:07:27 We're passing in this testArr here.

1:07:31 And the number 6.

1:07:33 We want the number 6 to be added to the end of the array.

1:07:36 So, we'll just do arr.push().

1:07:39 And then I’ll put in (num).

1:07:43 Just like that.

1:07:45 Oh, actually, it’s (item).

1:07:47 So, what we did, we took this array that was

1:07:51 passed in here which is in this case, testArr.

1:07:55 And we push the time that was passed in.

1:07:58 And in this case here, it’s item 6.

1:08:01 Now we want to return the first item on the list.

1:08:06 We want to remove and return this item.

1:08:09 So, that we console.log here it should show the number 1.

1:08:15 So, instead of returning item, I’m going to return arr.shift().

1:08:21 That’s what shift does.

1:08:23 Shift moves the first item and returns that first item.

1:08:27 So, let’s check this out.

1:08:29 Okay, you can see before, [1,2,3,4,5].

1:08:35 Then we've popped off the 1 and after it is [2,3,4,5,6].

1:08:40 We did it.

1:08:41 [Boolean Values] Booleans are another datatype in Javascript.

1:08:48 There are only two values, true or false.

1:08:52 They’re basically little on/off switches where true is on and false is off.

1:08:57 They don’t use quotation marks around the Boolean.

1:09:02 See, it just says return false.

1:09:04 So, this is a function here.

1:09:06 It should be indented,

1:09:07 where it’s going to return false when you call this function.

1:09:11 It could also be true.

1:09:13 So, we could return true.

1:09:15 You can use true and false in more places than

1:09:19 just function returns and we'll be talking more about that later.

1:09:23 [Use Conditional Logic with If Statements] An if

1:09:27 statement is used to make decisions in code.

1:09:31 The keyword If tells Javascript to execute the code

1:09:35 in the curly braces under certain conditions defined in the parenthesis.

1:09:41 So, here is a full if statement right here.

1:09:44 And there’s always parenthesis after the keyword if.

1:09:48 And here’s the condition.

1:09:50 So, if the stuff inside these parenthesis evaluates to true,

1:09:55 then the code within these curly braces will be evaluated or run.

1:10:01 So, in this case, it’s a variable.

1:10:04 So, if the isItTrue variable is true, it will return “Yes, it’s true”.

1:10:10 Now if this is not true,

1:10:12 then we'll get to the second return statement "No, it’s false”.

1:10:16 So, this whole function here takes in a variable.

1:10:21 And we check if that’s true or not.

1:10:24 So, I’m going to make another example just like this.

1:10:27 We have another function that hasn’t been filled out yet, trueOrFalse.

1:10:31 And there’s a variable that’s passed in (wasThatTrue).

1:10:35 So, we'll say if– and then the parenthesis (wasThatTrue).

1:10:41 If that’s true, we're going to return something.

1:10:44 It will be a string just like before.

1:10:48 And the string is "Yes, that was true”.

1:10:52 If it’s not true, then we'll get to the second return statement in the function.

1:10:59 And we'll return a different string.

1:11:02 We'll return “No, that was false”.

1:11:06 I’ll just add some semicolons, and then I can run this.

1:11:17 And we'll see what happens.

1:11:19 Oh, return needs to be spelled correctly.

1:11:21 So, let me spell return correctly.

1:11:24 So, before I run this, I’m going to add a console.log.

1:11:29 So we can console.log the answer.

1:11:32 So, this is the function call here, true or false.

1:11:36 We’re passing in true.

1:11:38 And then we're going to log what is returned here.

1:11:41 “Yes, that was true”.

1:11:43 Since we passed in true,

1:11:45 this if statement evaluates to true and this code is run right here.

1:11:50 [Comparison with the Equality Operator] There are many comparison operators

1:11:56 in Javascript that will return a Boolean of true or false.

1:12:00 The most common is the equality operator.

1:12:04 And it’s often used in an if statement.

1:12:06 So, here it just says if (val).

1:12:09 So, we have this whole if statement right here, if (val).

1:12:13 We're going to see if if (val)= 12.

1:12:16 Now, to check if it equals 12, we're going to have to use the==.

1:12:21 That is the equality operator and we'll say if (val== 12).

1:12:28 The reason why we can’t just use a single equal

1:12:31 sign is that a single equal sign is the assignment operator.

1:12:35 If we just had a single equal sign,

1:12:38 that would mean that we were setting the value of the val variable to equal 12.

1:12:45 We're not trying to set this to equal 12,

1:12:49 we're trying to check if the value of this variable equals 12,

1:12:54 so we have to use the double equal sign.

1:12:56 So, now, this testEqual function is going to test to see

1:13:00 if the number we pass in is equal to 12.

1:13:04 I can do a console.log here.

1:13:07 Console.log.

1:13:08 And then we can see what appears in the console here.

1:13:14 “Not Equal” because 10 does not equal 12.

1:13:17 [Comparison with the Strict Equality Operator] We learned about

1:13:22 the equality operator which is the double equal== sign.

1:13:26 There’s also the strict equality operator, the triple equal sign===.

1:13:30 So, here we're checking if 3 equals 3 with the strict equality operator.

1:13:36 So, the difference is that the equality operator,

1:13:39 the double equals sign attempts to convert

1:13:42 both values being compared to a common

1:13:44 type while the strict equality operator does not do the type conversion.

1:13:49 So, this is going to evaluate to true, the 3=== 3.

1:13:55 But the 3=== ‘3’ with the string on the side is going to evaluate to false.

1:14:02 Both of these would be true if we were using the double equals sign== because

1:14:07 the string would be converted to a number and it would be equal to true.

1:14:13 But with the=== it does not get converted to a number,

1:14:17 so it would be evaluated to false– this second one with the three equal signs.

1:14:23 So-and-so, here, we're just going to use it right in this if statement.

1:14:27 And do=== 7.

1:14:30 So, now we can pass in the number 7 and it’s going to evaluate to true.

1:14:38 But if we pass in a string 7, it will evaluate to false.

1:14:42 [Practice Comparing Different Values] We will do one more

1:14:48 review with the equality operator and the strict equality operator.

1:14:52 So, if I run this here, we'll see in the console it says "Equal” because it’s

1:14:58 checking if the number 10 and the string “10” are equal.

1:15:02 So, if a= b, the number 10 equals a strict number 10, return “Equal”.

1:15:08 Since we're using the equality operator with two equal signs,

1:15:12 it performs a type conversion.

1:15:15 And it converts the string into a number.

1:15:18 But if we use the strict equality operator with three equal signs,

1:15:23 I’ll run that again,

1:15:24 and you’ll see “Not Equal” in the console because now it’s not converting

1:15:29 the types and it’s just checking if a number is equal to a string,

1:15:35 which it’s not, so we get not equal.

1:15:37 [Comparison with the Inequality Operator] Now I will show you

1:15:43 the inequality operator which is basically

1:15:45 the opposite of the equality operator.

1:15:47 So, I’m going to do the inequality operator

1:15:50 with an exclamation point and an equal sign.

1:15:53 In this case, I’m going to see if the value is not equal to 99.

1:16:00 And again, just like the equality operator, this does type conversion.

1:16:06 So, let’s just run this program and we'll see it is

1:16:10 “Not Equal” because 10– we passed in 10 into the function here.

1:16:14 And 10 is not equal to 99, so we get “Not Equal”.

1:16:19 [Comparison with the Strict Inequality Operator] The strict inequality

1:16:24 operator is basically the opposite of the strict equality operator.

1:16:29 Now, it works like this.

1:16:30 So, it says if (val)– I’m going to do if (val) does not equal 17.

1:16:36 So, this is the strict inequality operator.

1:16:39 Instead of one equal sign we have two equal signs.

1:16:42 And that means it’s going to check if this is not true.

1:16:45 But it’s not going to convert types.

1:16:48 So, for instance, if we were checking if the number

1:16:52 3 does not equal the string 3, that would be true.

1:16:56 So, in this example, we're just checking if 10 does not equal 17.

1:17:01 If we run this, we will see it’s not equal.

1:17:04 [Comparisons with the Logical And Operator] We

1:17:09 can also use the greater than operator.

1:17:11 So, in this function we're checking if a value is over 100.

1:17:14 So, I’m going to put greater than 100.

1:17:19 And then here we're checking if a value is over 10, so I’ll put greater than 10.

1:17:25 So, here we call the function.

1:17:27 We pass in 10.

1:17:28 And if I run that function, you'll see “10 or Under” because we're not over 100.

1:17:34 We’re not over 10.

1:17:36 10 or under, because we passed in 10.

1:17:39 [Comparison with the Greater Than Or Equal To Operator] We

1:17:43 can also use the greater than or equal to operator.

1:17:46 So, we'll finish this function by using greater than or equal to.

1:17:51 It’s just a>=.

1:17:53 And we'll put 20 down here.

1:17:56 Just greater than or equal to 10.

1:18:01 If I run that, we should see “10 or Over” because

1:18:05 we're passing in 10 and it’s greater than or equal to 10.

1:18:08 [Comparisons with the Less Than Operator] Now I’ll

1:18:13 show you an example of the less than operator.

1:18:15 With this function, we're going to check if the value is less than 25.

1:18:20 And then up here we're checking if a value is less than 55.

1:18:27 So, here, it’s a trick I use to remember which

1:18:30 symbol is less than and which symbol is more than.

1:18:33 If you see the less than symbol looks kind of like

1:18:36 the letter L which is the first letter in less than.

1:18:40 And then the more than symbol is just the opposite.

1:18:43 [Comparisons with the Less Than Or Equal To Operator] And we also

1:18:47 have the less than or equal to operator we can use in Javascript.

1:18:51 So, here, we're going to check if it’s less than or equal to 12.

1:18:55 So, we just put the less than operator 12.

1:18:59 Equal– less than or equal.

1:19:03 That’s an important part.

1:19:04 Here it’s the less than or equal to 24 to make this statement true.

1:19:10 And if we run, we see “Small Than or Equal to 12”.

1:19:14 The number 10 we passed in.

1:19:16 [Comparisons with the Logical And Operator] Sometimes you want

1:19:21 to check if 2 things are true at the same time.

1:19:24 For instance, you may want to check if this value is less than or equal to 50.

1:19:33 And you also want to check if the value is more than or equal to 25.

1:19:41 So, here we have a nested if statement.

1:19:46 So, it’s going to check if it’s less than equal

1:19:48 to 50 and if it’s more than equal to 25, then it’s going to return “Yes”.

1:19:51 But there’s an easier way to do this.

1:19:53 So, what I’m going to do is copy this where

1:19:56 it says value is more than or equal to 25,

1:19:58 I’m going to delete this nested if statement.

1:20:02 So, we don’t need that if statement.

1:20:04 And I’m going to use the And operator.

1:20:09 So, we have less than or equal to 50.

1:20:12 And if I put two ampersands, like this, that means and.

1:20:18 Now, I’m going to put value is more than or equal to 25.

1:20:21 So, this says if value is less than or equal

1:20:25 to 50 and the value is also more than or equal 25,

1:20:30 then we're going to return “Yes.” So,

1:20:33 both this statement and this statement have to be

1:20:37 true to get inside this if statement here.

1:20:40 [Comparisons with the Logical Or Operator] In this code here,

1:20:46 we’re checking if the value is not between 10 and 20.

1:20:50 So, if the value is less than 10, we return “Outside”.

1:20:55 And if the value is more than 20, we return “Outside”.

1:20:59 There is an easier way to do this with the logical Or operator.

1:21:04 So, I’m just going to delete this whole if statement here.

1:21:08 And then I can add an or statement.

1:21:11 Which is just two pipes.

1:21:15 So, I’m going to put val is more than 20 here.

1:21:21 So, now, we're checking if the value is less

1:21:25 than 10 or if the value is more than 20.

1:21:29 Either way, we're going to return “Outside”.

1:21:32 And if it’s not true, we'll return “Inside”.

1:21:35 [Else Statements] When an if statement is true,

1:21:42 normally the block of code right after the if statement will be evaluated.

1:21:46 And if it’s not true, nothing happens.

1:21:49 But with an else statement,

1:21:51 an alternate block of code can be executed when it’s not true.

1:21:55 So, this is a perfect use case.

1:21:57 If value is more than 5, the result is bigger than 5.

1:22:01 If the value is less or equal to 5, the result is 5 or smaller.

1:22:05 We can do this with an else statement.

1:22:08 So, I’m just going to type in else here.

1:22:10 And then we can just delete this whole if statement.

1:22:15 Just like that.

1:22:16 And now we have if the value is less than 5.

1:22:19 The result is going to be “Bigger than 5”.

1:22:21 Else, if it’s not more than 5, we'll return “5 or Smaller”.

1:22:26 [Else If Statements] If you have multiple conditions that need to be addressed,

1:22:33 you can use else if statements.

1:22:35 It’s a way of chaining if statements together.

1:22:38 In this example, we have three conditions.

1:22:41 If value is more than 10, we're going to return greater than 10.

1:22:44 If it’s less than 5, return smaller than 5,

1:22:47 or else we're going to return 5 and up.

1:22:50 So, this is a perfect use case for an else if statement.

1:22:54 So, this is how we do it.

1:22:56 We’ll do else and then just we're going to add

1:22:59 the if statement at the end of the else.

1:23:01 I’m just going to delete all of this stuff.

1:23:03 So, else if value is less than 5,

1:23:06 and then we're going to have one final else statement.

1:23:10 Else– and I’m going to put this statement here.

1:23:15 This final return.

1:23:16 Just going to cut that.

1:23:18 And then paste in right in there.

1:23:20 So now, instead of using multiple if statements,

1:23:23 we have the if and then we have the else if, and then we have the else.

1:23:29 [Logical Order in If Else Statements] When you’re

1:23:34 using else if statements order is very important.

1:23:37 Let’s look at this example here.

1:23:39 In this function, first we check if the value

1:23:42 is less than 10 and return less than 10,

1:23:45 then else if we check if the value is less than 5, and return less than 5.

1:23:51 Well, if we look at this example and we pass in the number 7.

1:23:56 If I run this, you’ll see it’s going

1:23:59 to say "Less than 10” which is what we want.

1:24:02 However, if we put 3 it’s still just going to say “Less than 10”.

1:24:09 Really, we want this to say "Less than 5” because it is actually less than 5.

1:24:15 However, this is in the wrong order.

1:24:18 So, what we need to do is change the order.

1:24:21 So, this should be 5.

1:24:23 This should be 5.

1:24:25 And this should be 10.

1:24:27 And this should be 10.

1:24:30 So, once the first condition is met,

1:24:32 it doesn’t even check for the rest of and conditions.

1:24:35 So, that’s why it’s important to think about the order.

1:24:39 So, if we run this now, yeah "Less than 5”.

1:24:42 That’s what we want.

1:24:44 [Chaining If Else Statements] You can also chain if and else if statements.

1:24:52 So, I’m going to complete the following challenge here.

1:24:55 Write chained if/else if statements to fulfill the following conditions.

1:25:00 So, we have these conditions.

1:25:03 If the number is less than 5, we're going to return “Tiny”.

1:25:06 If it’s less than 10, return “Small”, and so on.

1:25:09 So, what I’m going to do is actually just copy this right here because

1:25:13 this is written– part of it is written exactly how we want it to be written.

1:25:17 I’ll just paste it here.

1:25:19 And I’m going to just add the if and else statements.

1:25:22 So, it’s going to be if– and then we put

1:25:25 this in parenthesis because the condition is always in paranthesis.

1:25:27 If number is less than 5,

1:25:30 then we're going to use the curly braces and we're going to return “Tiny”.

1:25:36 So, I’ll just move that up here.

1:25:37 I’ll cut it and paste it.

1:25:39 Now, we're going to use an else if statement.

1:25:42 And I got the curly braces.

1:25:45 First of all, also I need to put the condition in these parenthesis.

1:25:49 I’m just going to cut this.

1:25:51 Number is less than 10.

1:25:53 Put it right here.

1:25:54 And we're going to return this “Small”.

1:25:57 So, I’ll put that in the curly braces here.

1:26:00 And then we have another else if statement.

1:26:04 Else if and the condition.

1:26:07 Just like before, the number is less than 15.

1:26:10 Put that in there.

1:26:12 We always need the curly braces to show

1:26:15 what’s going to happen in the if statement.

1:26:18 So, I’m just cutting and pasting this text again.

1:26:21 We have an else if.

1:26:25 And then we have this here.

1:26:28 And we have return “Large”.

1:26:32 Another– actually, the final thing is just going to be else.

1:26:42 We don’t even need an else if with this statement at the end.

1:26:45 We don’t even need to put the condition because if it’s

1:26:48 more than or equal to 20 that’s going to be everything else.

1:26:51 So, I’m just going to cut this.

1:26:54 We don’t need any of this stuff here.

1:26:57 And we're just going to return “Large”.

1:27:02 So, with this one test here, for test 7, we can actually console.log that.

1:27:08 Console.log.

1:27:11 And see what it returns for 7.

1:27:15 We can try a few different things.

1:27:17 Oh, we have an error here.

1:27:18 Oh, forgot to– I put this parenthesis the wrong way.

1:27:21 Let’s try that again.

1:27:24 “Small” but if this is 20, it should be “Huge”.

1:27:35 And if it’s 19, which would be less than 20, we should see “Large”.

1:27:43 Yep, that worked.

1:27:45 [Golf Code] In the game of golf each hole has a par which means

1:27:51 the average number of strokes you’re supposed

1:27:54 to use to get the ball into the hole.

1:27:56 So, depending on how far above or below par your strokes are,

1:28:01 there’s a different nickname.

1:28:02 So, here are some of the nicknames "Hole-in-one!”

1:28:05 “Eagle” “Birdie” “Par” and we're going to write

1:28:08 a function where you pass in the par and you also pass in the strokes.

1:28:12 You can see up here, par and strokes.

1:28:14 And it’s going to return the nickname.

1:28:17 So, that’s what we're going to write.

1:28:20 You can see this table here shows what we have to do.

1:28:23 If the strokes are 1, then you get “Hole-in-one!”.

1:28:28 If the stroke is less than or equal to par-2, you get an “Eagle”.

1:28:32 And so on.

1:28:33 And we also have this array that’s going to make it easier because

1:28:36 we can just use things from this array instead of typing out the words.

1:28:39 So, we're going to start with an if statement.

1:28:43 If– and then we have to put the condition.

1:28:47 If (strokes)== that’s the equality operator.

1:28:55 We don’t want to use a single equals

1:28:57 sign because that would be the assignment operator.

1:28:59 If it equals 1, then we can return.

1:29:03 And we can see down here, we're going to return “Hole-in-one!”.

1:29:07 But we can just use it from this names array.

1:29:09 So, it’s going to be names.

1:29:11 And this is going to be index zero of the array.

1:29:13 So, we'll do names and then [0].

1:29:16 And then we can do an else if.

1:29:19 Else if– and then we can put the condition, (strokes).

1:29:24 I have to spell strokes right.

1:29:27 Strokes.

1:29:33 And then we can just actually copy this right from here.

1:29:36 Less than or equal to par-2.

1:29:38 And then we are going to return name

1:29:43 and this will be the index[1] which is an “Eagle”.

1:29:49 At this point, I can do some copy and pasting.

1:29:53 I’m going to copy this whole thing because a lot

1:29:54 of the rest of this will be else if.

1:29:56 So, else if strokes is– this time it’s going to be equal to par-1.

1:30:07 And we're going to return “Birdie” which is array index[2].

1:30:14 And I’m going to continue just like this.

1:30:19 So, this time it’s if strokes equal par, we're going to return name index[3].

1:30:29 See?

1:30:31 Zero.

1:30:31 One.

1:30:32 Two.

1:30:32 Three.

1:30:33 It’s going to be the word par up.

1:30:35 Keep just like this.

1:30:38 Now it’s going to be par+1.

1:30:41 And we'll change this to [4].

1:30:44 Now it’s going to be par+2.

1:30:51 And we’ll change this to [5] which is going to be the double bogie.

1:30:56 And finally, if strokes is– change this to more than or equal

1:31:05 to par+3 that means you did very poorly so you should just go home.

1:31:12 So, it’s going to be name index[6].

1:31:16 And we don’t need this anymore.

1:31:18 So, now we're going to do some tests here.

1:31:22 I’m going to do a console.log.

1:31:28 And we're going to pass in the function that we're calling.

1:31:31 So, in this case, the par is 5 and the strokes are 4.

1:31:35 So, that should return “Birdie”.

1:31:38 Let’s see what happens.

1:31:39 Null.

1:31:41 Okay.

1:31:42 That’s not what I expected.

1:31:44 It’s because this should be names.

1:31:47 I spelled this wrong.

1:31:52 That’s why it’s sometimes better to check before you go through the whole thing.

1:31:57 You can test things as you go.

1:31:58 But let’s do that again.

1:32:00 Yep "Birdie”.

1:32:01 And if I type in 2 here "Eagle”.

1:32:06 If I type in 8, it’s probably going to tell us to go Home.

1:32:11 “Go Home!” Yep.

1:32:12 We just completed this challenge.

1:32:14 [Switch Statements] Instead of using chained else

1:32:20 if statements you can use a switch statement.

1:32:23 A switch statement tests a value and can

1:32:26 have many case statements which define various possible values.

1:32:29 So, let me show you how that works.

1:32:32 Here we're going to write a switch statement which

1:32:34 tests val and sets the answer to the following conditions.

1:32:37 If we pass in 1, the answer should be “alpha”.

1:32:41 If we pass in 2, the answer should be “beta”.

1:32:43 And so on.

1:32:44 So, let me show you how that works.

1:32:46 We'll just type in the word switch.

1:32:48 That’s the keyword here.

1:32:50 And we're testing the val that’s passed into this function.

1:32:53 So, it starts off kind of like an if statement.

1:32:57 And right now– so, we're going to compare

1:33:01 the val to the different cases that we have.

1:33:04 So, we'll have case and the first number is going to be 1.

1:33:09 So, here we're saying if the case of val is 1,

1:33:14 if val= 1 and it’s using the strict equality operator,

1:33:19 so it’s like the===, it’s going to make sure

1:33:22 that the type of the variable are the same.

1:33:24 So, a string ‘1’ and a number 1 will not be equal.

1:33:27 But if the case is 1, then we're going to set answer to= “alpha”.

1:33:42 And then we're going to break.

1:33:46 Break means that we're at the end of that case statement.

1:33:50 And once you break it, it just goes to the end of the switch statement

1:33:54 and doesn’t evaluate anything else in the switch statement So,

1:33:58 we're also going to have case 2.

1:34:02 And one thing I forgot,

1:34:04 that we're going to indent that so it’s easier to see the different cases.

1:34:08 And case 2, the answer is going to equal to “beta”.

1:34:14 And then we also need the break statement.

1:34:18 If you don’t have a break statement it will

1:34:21 just run through to the next case statement automatically.

1:34:25 So, if the case was 1 and you did not have a break here,

1:34:29 first it would set the answer to “alpha”.

1:34:32 And then it would set the answer to “beta”.

1:34:35 It would just skip over to the next case statement.

1:34:37 The break is here.

1:34:39 It’s going to go out of the switch statement completely.

1:34:43 So, it would go– start running the code after this last curly bracket.

1:34:46 So, now we're going to do case 3.

1:34:50 We’ll just do some copying and pasting here.

1:34:53 And we're going to have 4 cases so I’ll just do the rest of the pasting here.

1:35:00 So, we’ll have 3 and 4.

1:35:03 “alpha” “beta” and then we have “gamma” and “delta”.

1:35:11 And we know that the switch statement is

1:35:16 over because we have this final curly bracket.

1:35:21 And then we're just going to return answer.

1:35:24 So, let’s do some tests.

1:35:26 To really test this, we're going to have to add

1:35:29 a console.log here to log what it’s going to be.

1:35:32 And I’ll run this.

1:35:34 “Alpha” good.

1:35:35 Now 2 should be “beta”.

1:35:38 3 should be “gamma”.

1:35:42 Good.

1:35:43 And we'll just assume 4 is correct so we're done.

1:35:45 [Default Option in Switch Statements] Now we'll talk

1:35:50 to you about the default option in a switch statement.

1:35:53 The default option is kind of like else in an if else statement.

1:35:57 So, here’s a switch statement that’s very similar to the one we already saw.

1:36:02 And it’s inside this function where we pass in a value into the function.

1:36:06 And we're going to check if the value equals a.

1:36:08 If it equals a the answer is going to be sent to “apple”.

1:36:11 B, answer set to “birds”.

1:36:13 C "cat”.

1:36:14 So, in this example we can see that we passed in here– we passed

1:36:20 in the a and it returned “apple” because that was one of the options.

1:36:25 But what if we pass in something else?

1:36:27 If I pass in the number 2 here it’s going to return an empty string.

1:36:32 That’s because the answer is set to an empty string and we

1:36:36 never override the answer here so it just returns the empty string.

1:36:39 What if we want to return something anytime a, b, or c is not passed through.

1:36:46 So, for anything else that’s passed into the function,

1:36:49 we're going to do default.

1:36:51 This is like the else statement.

1:36:53 So, the default, we're going to do answer= “stuff”.

1:36:59 Again, we're going to have the break.

1:37:02 But now, whenever we pass in something that’s not a, b,

1:37:06 or c, it’s going to return “stuff”.

1:37:09 So, we can pass in 5.

1:37:11 It’s going to return “stuff”.

1:37:14 But if I go back to passing in c,

1:37:17 one of the things we have a case for, it’ll return “cat”.

1:37:20 And that’s the switch statement.

1:37:23 [Multiple Identical Options in Switch Statements] Sometimes you want

1:37:27 a switch statement where multiple inputs give the same output.

1:37:31 Well, that’s easy enough by omitting the break statement.

1:37:36 Let me show you how that works.

1:37:37 So, let’s get a switch statement here.

1:37:40 And we're going to have val, that’s what’s passed into the function.

1:37:45 And then this case we want the case of 1,

1:37:49 2, and 3 all to return the answer of low.

1:37:53 So, I can do it like this, case 1– and I can go straight into case 2.

1:37:58 And then I can go straight into case 3.

1:38:03 And since I don’t have any break statement between these cases,

1:38:08 it will just keep going to the next one automatically.

1:38:11 And now, I’m going to say that the answer is going to be set to equal “Low”.

1:38:18 And here is where I put the break statement.

1:38:21 Okay, now we're going to do the same thing with cases 4 through 6.

1:38:25 And actually, I’m just going to do some copying and pasting.

1:38:28 I’m going to copy all this.

1:38:29 And now we're going to paste.

1:38:31 That’s 4, 5, 6.

1:38:33 We're going to do the same thing with 7, 8, 9.

1:38:35 So, I’m going to do copy and paste again.

1:38:38 And then I’m just going to update the code.

1:38:39 So, this is going to be 4, 5, 6.

1:38:42 And we'll have 7, 8, 9.

1:38:44 And we're going to have “Mid” and “High”.

1:38:49 So, if the case is 1, 2, or 3– like for instance,

1:38:52 if it’s 1, it’s going to pass through 2 and 3 to get low.

1:38:56 And then it’s going to break about it.

1:38:57 If it’s 4, 5, or 6, it’s going to pass through to get

1:39:00 to “Mid” and then it’s going to break out 7, 8, and 9.

1:39:03 It’s going to pass through to the “High” and break out.

1:39:05 So, let’s test this out and see.

1:39:07 Since we're passing in the number 1 here it’s going to be “Low”.

1:39:10 But if we pass in 5, we should get “Mid.” And if it’s 7,

1:39:16 8, or 9, we should get “High”.

1:39:19 [Replacing If Else Chains with Switch]

1:39:23 Sometimes a switch statement can be easier

1:39:25 to write and easier to understand than a chain of if else statements.

1:39:30 So, we're going to change this chain

1:39:34 of else if statements to become a switch statement.

1:39:38 So, let’s do that right now.

1:39:41 So, we're going to start with the switch keyword and we're

1:39:45 going to be evaluating the value with open curly bracket,

1:39:49 and we'll have to make sure to have an end curly bracket at the end.

1:39:52 So, for a case “bob” we're going to set the answer to “Marley”.

1:40:01 And then we need to have a break in here.

1:40:03 For case 42 we're going to set the answer to “The Answer”.

1:40:13 For case 1 we’ll set the answer to “There is no 1”.

1:40:27 We need a break up here.

1:40:34 For case 99 the answer is “Missed me by this much!”.

1:40:45 And then we need a break.

1:40:47 Now we have for case 7– 7, 8, 9, and break.

1:41:03 And now we just changed that chain

1:41:06 of else if statements into a switch statement.

1:41:11 [Returning Boolean Values from Functions] Here’s a little trick

1:41:16 when you want a function to return a Boolean, a true or false value.

1:41:20 You can see in this function, we're checking if a is less than b.

1:41:23 And if so, we return true, else we return false.

1:41:27 You may remember from before the all comparison

1:41:31 operators return a Boolean true or false value.

1:41:35 So, instead of using this if statement here we can

1:41:38 just– we can actually delete all of this and just

1:41:43 return the result of this, return– we’re just

1:41:47 returning the result of a is less than b.

1:41:51 So, this is going to be true or false.

1:41:54 And we can just skip that whole if statement logic and just return this.

1:42:00 So, if we console.log this out, console.log,

1:42:04 we should be able to see if 10 is less than 15.

1:42:11 It is less than 15.

1:42:14 It’s true.

1:42:14 But if we put a 20 here then it’s false.

1:42:19 [Returning Early Pattern from Functions] We've

1:42:24 already seen a few examples of this.

1:42:26 But you can return early from a function with the return statement.

1:42:30 So, if you see this function right here,

1:42:32 we return at the very end of the function,

1:42:35 so it leaves the function and returns this value from the function.

1:42:40 But you can leave the function any time with a return statement.

1:42:44 So, we're going to modify this function so that if a or b

1:42:48 are less than 0 the function will

1:42:51 immediately exit with the value of “undefined”.

1:42:54 So, let’s do that.

1:42:55 We're going to set an if statement.

1:42:57 If a is less than 0, or– that’s two pipes.

1:43:05 B is less than 0 then we're going to return undefined.

1:43:14 So, we can do a test here, console.log.

1:43:22 8.

1:43:25 But what if this is a negative number?

1:43:27 It’s going to return undefined.

1:43:31 Scrimba has a little quirk here where it just shows null.

1:43:34 But in a browser it will show undefined.

1:43:37 [Counting Cards] We are going to create a blackjack card counting function.

1:43:46 So, how card counting works, at least how this function is going to work,

1:43:51 is that when you see a low card, the count goes up.

1:43:55 And when you see a high card, the count goes down.

1:43:59 And if it’s a middle value card, the count stays the same.

1:44:03 And then when the count is positive, the player should bet high.

1:44:07 And when the count is a zero or negative, the player should bet low.

1:44:13 So, we are going to use a switch statement to figure out

1:44:18 what card has been passed in and what to do about it.

1:44:22 You can see that the function looks like this– cc and we pass in card.

1:44:27 And depending on what the card is,

1:44:29 it’s going to increase this global count variable or it’s going to decrease it,

1:44:34 or it’s going to stay the same.

1:44:36 And then we are going to return two things.

1:44:39 We're not going to return “Change Me”.

1:44:41 We're going to return the current count value

1:44:44 and whether the player should hold or bet.

1:44:48 So, every time you call the cc function it’s going

1:44:53 to change this count value and return the total count.

1:44:58 So, let’s see how this is going to work.

1:45:00 We are going to use the switch statement, like I said.

1:45:04 And we're going to check the card value that was passed in.

1:45:11 So, if the case is 2, 3, 4, 5, 6, we are going to increment the count variable.

1:45:18 So, we're going to do it like this– case 2.

1:45:22 I’m going to do some copying and pasting.

1:45:25 If the case is 2, 3, 4, 5, 6, we'll just have to change these values.

1:45:30 3, 4, 5, 6.

1:45:36 Now, there are many ways to write any program.

1:45:38 This could be done with if statements and else statements.

1:45:42 It could be even done with other ways that we haven’t even talked about yet.

1:45:47 As long as the program works, in this case, that’s all that matters.

1:45:51 So, if you find a different way to write this program, that’s great.

1:45:55 So, if the case is 2, 3, 4, 5, or 6, we are going to take the count value.

1:46:02 And if we just do++, it increments it by 1.

1:46:08 And then we're going to break.

1:46:10 Now, if the case is 7, 8, 9– so let’s paste in three of these.

1:46:16 We’ll do 7, 8, 9.

1:46:21 Actually, we're going to do nothing.

1:46:23 The count is not going to change at all.

1:46:26 So, we don’t even need case 7, 8, or 9.

1:46:29 So, instead of doing 7, 8, 9,

1:46:31 we just need to check in the case that something is actually going to happen.

1:46:35 So, we are going to decrement the count variable if we have 10,

1:46:40 Jack, Queen, King, or Ace.

1:46:42 So, that’s what we're going to change this to.

1:46:45 10 "Jack”.

1:46:49 “Queen”.

1:46:52 “King”.

1:46:55 or “Ace”.

1:46:59 In this case, we're going to decrement the count.

1:47:02 So, we're going to do count--.

1:47:05 So, that’s the same as count= count -1.

1:47:07 And then we will break.

1:47:12 Now we've taken care of the count and updating the count,

1:47:17 now we have to take care of what we're going to return.

1:47:20 We are going to return the count.

1:47:24 And we're also going to return whether we are going to hold or bet.

1:47:30 So, we're going to actually return a variable.

1:47:33 But first there’s going to be a space.

1:47:35 There’s a space between the number and then

1:47:38 we're going to return the hold variable.

1:47:41 Now, this is a variable we haven’t created yet.

1:47:44 Normally, this would be the perfect time to use the turn area operator,

1:47:48 but we haven’t learn that yet and we're not going to learn

1:47:51 that for a few more lessons so I won’t use that now.

1:47:53 We are going to set what that hold bet value is.

1:47:57 First, we’ll create the holdbet variable.

1:48:01 Variable holdbet.

1:48:04 And we’ll set it to ‘Hold’.

1:48:09 However, if (count) is more than 0, then we can set holdbet to equal ‘Bet’.

1:48:27 So, now this should work.

1:48:33 Let’s test it out and see if we’ve made any mistakes yet.

1:48:36 holtbet is not defined.

1:48:38 We have it right here.

1:48:42 Oh, we spelled that wrong.

1:48:44 So, instead of holtbet that should be holdbet.

1:48:47 Okay.

1:48:50 In this case, we're going to bet because we

1:48:53 had a bunch of positive numbers and then negative numbers.

1:48:58 But if we change this to ‘K’ and we change this to 10, let’s see what happens.

1:49:06 Now we're going to hold.

1:49:08 Okay, it worked.

1:49:10 [Build Javascript Objects] Objects!

1:49:15 Objects are similar to arrays except that instead

1:49:19 of using indexes to access data, you use properties.

1:49:23 So, here’s an object called ourDog.

1:49:26 Objects are going to be defined with these curly

1:49:29 braces at the beginning and the end.

1:49:31 And these are the properties.

1:49:33 Now, the properties are everything before the colons.

1:49:38 So, we have “name” that’s a property.

1:49:42 “legs” is a property.

1:49:43 And then the values are the things after the colons here.

1:49:47 So, the name is “Camper”.

1:49:49 The legs, 4.

1:49:50 Tails, there’s only one tail on this dog.

1:49:52 And “friends” are “everything”.

1:49:54 Now you can see that the properties can be strings.

1:49:58 They can be numbers.

1:50:00 They can be arrays.

1:50:01 They can be any datatype in Javascript.

1:50:03 So, now we are going to create our own dog.

1:50:07 So, this is going to have a “name”.

1:50:10 Personally, I like the name “Quincy”.

1:50:14 So, we'll use that for our dog’s name.

1:50:16 Also, we're going to have “legs”.

1:50:20 Unfortunately, our dog has had an accident.

1:50:23 He only has 3 legs.

1:50:25 But to make up for only having three legs, he does have 2 tails.

1:50:33 And for “friends”, another unfortunate thing, it’s an empty array.

1:50:40 He has no friends.

1:50:42 Okay.

1:50:43 We’ve now created our own object.

1:50:45 [Accessing Object Properties with Dot Notation] There are two

1:50:51 main ways to access a property on an object.

1:50:53 The first I will talk about is dot notation.

1:50:56 So, we have this testObj.

1:50:58 And we have “hat” “shirt” and “shoes”.

1:51:01 And we want to find out the value of these properties.

1:51:03 So, right here the hatvalue we're going to set to testObj.

1:51:08 Now here’s where we use the dot notation.

1:51:10 We just put a dot or a period and then I put the name of the property, .hat.

1:51:15 And then for the shirt value, I will do .shirt.

1:51:20 So, see this word right here is just a word here.

1:51:23 So, the value of hatValue, testObject.hat is now going to be “ballcap”.

1:51:27 And the value of the shirtValue is going

1:51:30 to be “jersey” [Accessing Object Properties with Bracket Notation]

1:51:36 Besides using dot notation you can also use

1:51:40 bracket notation to access a property in an object.

1:51:44 You can use bracket notation anytime but it is

1:51:47 required if the name has a space in it.

1:51:51 You can see in this object we have three properties.

1:51:56 And each of them have a space.

1:51:58 So, to get the value of these properties

1:52:00 we're going to have to these bracket notation.

1:52:03 So, the entreeValue we're going to do testObj.

1:52:06 That’s the name of the object.

1:52:07 And then we're going to put brackets kind of like an array index.

1:52:11 So, you need the opening and closing brackets.

1:52:13 And inside we will put the name of the property.

1:52:18 So, I’ll do “an entree”.

1:52:20 And then we can do it again down here for the drink value.

1:52:25 I’ll use a single quote this time instead of a double

1:52:28 quote to show that each of those will work.

1:52:31 ‘the drink’.

1:52:34 And then we need the closing brackets here.

1:52:37 So now, entreeValue is set to equal hamburger.

1:52:42 And drinkValue is set to equal “water”.

1:52:45 [Accessing Object Properties with Variables] Bracket notation can also

1:52:51 be used to look up object properties using variables.

1:52:55 So, here we have this testObj.

1:52:57 We have these different numbers associated with these names here.

1:53:01 And we are going to set this variable to be one of the numbers.

1:53:06 So, I’ll set this to be 16.

1:53:08 So, now we can– in this testObj, 16 is “Montana”.

1:53:14 And we can look that up using the variable name instead of the number.

1:53:18 So, instead of putting 16, I’m going to put [playerNumber] in here.

1:53:22 And now player is set to the word, the string "Montana”.

1:53:29 And we use these variable to look up the object property.

1:53:33 [Updating Object Properties] We can use

1:53:38 dot notation to update object properties.

1:53:41 Here you can see an object called ourDog.

1:53:44 It has a name, legs, tails, friends.

1:53:46 And the name is “Camper”.

1:53:49 However, here we used dot notation ourDog.name.

1:53:53 And use the assignment operator, the equals sign,

1:53:56 to set the name to “Happy Camper”.

1:53:59 So, if we do console.log on ourDog.name it would

1:54:03 no longer be “Camper” it would be “Happy Camper”.

1:54:06 Well, we have another dog here with the name of “Coder”.

1:54:09 But we want to change the name to “Happy Coder”.

1:54:13 So, that’s what I’ll do right here.

1:54:14 So, myDog.name= “Happy Coder”.

1:54:22 So, just like above,

1:54:24 we use dot notation to set the object property to a new value.

1:54:29 [Add New Properties to an Object] You can add new

1:54:35 properties to an object using dot notation or bracket notation.

1:54:38 So, here’s an example right here.

1:54:41 We have this object, ourDog.

1:54:43 And there’s four properties here.

1:54:45 But down here we're adding a new property.

1:54:48 ourDog.bark= “bow-wow”.

1:54:50 So, it had four properties but now it

1:54:53 has 5 properties as the property bark as well.

1:54:56 Now down here we'll add a property to the myDog object.

1:55:00 So, we can do myDog.

1:55:03 And then here I’m going to use bracket notation instead of dot notation.

1:55:08 ‘bark’.

1:55:09 I’m going to set that to equal “woof”.

1:55:13 And because he’s yelling it we’ll have an exclamation point.

1:55:17 And that’s how you add properties to objects.

1:55:20 [Delete Properties From an Object] It’s simple

1:55:24 to delete a property from an object.

1:55:26 Our ourDog object has all these properties.

1:55:29 And with the delete keyword, delete ourDog.bark.

1:55:32 So, now this property here, the bark,

1:55:35 has been deleted and is no longer in the object after we’ve deleted it.

1:55:39 So, we can do the same thing down here.

1:55:41 And this time we will delete the tails property myDog.tails.

1:55:48 So, now the myDog object no longer has a tails property.

1:55:53 [Using Objects for Lookups] Objects can be thought

1:55:58 of as a key value storage like a dictionary.

1:56:00 You can use an object too lookup values.

1:56:03 So, in this case we have a switch statement that returns certain values.

1:56:08 So, when you pass in “alpha” to the function it returns “Adams”.

1:56:12 If you pass in “bravo” it returns “Boston”.

1:56:15 We can replace this switch statement with an object

1:56:20 and use the object for lookups instead of the switch statement.

1:56:24 Let me show you how that’s down.

1:56:26 I’m going to create var lookup.

1:56:30 This is going to be an object here.

1:56:32 And the object is going to have a bunch of key value pairs.

1:56:37 So, we have alpha and that’s going to be “Adams”.

1:56:45 And then we have “bravo”.

1:56:48 And the value for “bravo” is going to be “Boston”.

1:56:55 And that’s it.

1:56:58 So, we can now delete this whole switch

1:57:03 statement and now we can say result= lookup.

1:57:10 And bracket notation we put the value that was passed in.

1:57:15 And then I forgot one thing which was

1:57:18 the equals sign here because lookup equals this object.

1:57:22 And let’s do a test.

1:57:23 So, let me put console.log so we can actually see what happens here.

1:57:30 So, if we do “charlie” we're going to get “Chicago”.

1:57:34 If we do “foxtrot” the result will be “frank”.

1:57:41 So, it works.

1:57:42 [Testing Objects for Properties] You can check if

1:57:48 an object has a property with the hasown property method.

1:57:52 Let me show you how to use this method and finish making

1:57:56 this function where we check if an object has a specific property.

1:58:01 If it doesn’t have the property we’ll return “Not found”.

1:58:04 So, let me show you how that’s going to work.

1:58:07 We’ll do myObj– that’s the object up above.

1:58:13 .hasOwnProperty.

1:58:14 And then we pass in the property we're going to check which is checkProp.

1:58:18 This is either going to come back as true or false if it has the property.

1:58:23 So, let’s make this into an if statement.

1:58:26 if (myObj.hasOwnProperty(checkProp)).

1:58:30 But if that’s true, we're going to return

1:58:37 myObj and then use bracket notation [checkProp].

1:58:43 So, we're going to return the value of that property.

1:58:45 Else we're going to return “Not Found”.

1:58:54 So, let’s take off this other return statement.

1:58:59 And I’ll do a test.

1:59:01 So, when we pass in “gift” here, we returned “pony”.

1:59:07 But let’s say we pass in “hello.” Load that "Not Found”.

1:59:12 Okay, it works.

1:59:14 [Manipulating Complex Objects] A Javascript object

1:59:20 is a way to store flexible data.

1:59:22 So, you can store strings, numbers, and arrays.

1:59:27 And even other objects.

1:59:29 So, in this example we have an array called myMusic.

1:59:33 We can see it’s an array because we have the open bracket and closed bracket.

1:59:37 But inside the array are objects.

1:59:40 So, this is one of the objects.

1:59:42 And inside the objects are all these key value

1:59:44 pairs with the strings and the numbers and so on.

1:59:47 So, I’m going to add another object.

1:59:49 So, since this is an array,

1:59:51 after each element in an array, you have to have a comma.

1:59:54 So, I’m going to add a comma here.

1:59:55 And then I’m going to add my next record right below this comment here.

2:00:00 And we're going to have just like above, we're going to have an “artist”.

2:00:05 The artist is going to be “Beau Carnes”.

2:00:08 And then we have a “title”.

2:00:11 The title will be “Cereal Man”.

2:00:15 “release_year” will be “2003”.

2:00:28 And for “formats” this is going to be an array, just like above.

2:00:36 So, we can have any format.

2:00:38 I’m going to put “YouTube video”.

2:00:41 And now we've created a second object in our myMusic array.

2:00:49 And each object holds data and a property which is the key value format.

2:00:55 This is very similar to JSON which we will talk more about later.

2:01:00 [Accessing Nested Objects] Here we have

2:01:04 an object with other objects nested inside that.

2:01:07 So, in order to access sub-properties of an object

2:01:11 you can chain together the dot or bracket notation.

2:01:14 So, I’m trying to get the gloveBoxContents.

2:01:18 So, I’m going to take away

2:01:21 this undefined here and I’ll do a myStorage.car.inside.

2:01:26 And then now the next thing "car” “inside” and the last thing is “glove box”.

2:01:33 Because there’s a space here we have to use bracket notation.

2:01:36 So, I’m going to use bracket notation on the end here and say “glove box”.

2:01:43 And now if we run this– see, we're going to console.log.

2:01:48 So, let’s see if we get the contents here.

2:01:49 Yeah "maps”.

2:01:51 It worked.

2:01:52 [Accessing Nested Arrays] Array bracket notation

2:01:58 can be changed to access nested arrays.

2:02:00 You can see we have this array here.

2:02:03 And inside this array are two objects.

2:02:05 The first element in the array is this object.

2:02:08 The second element of the array is this object.

2:02:10 And then inside the object we have a key value pair.

2:02:15 The key is list and the value is another array here.

2:02:18 So, we can combine dot notation and bracket notation to access the second tree.

2:02:24 That’s what we're trying to do here.

2:02:27 So, let’s do that.

2:02:28 First we need to do myPlants.

2:02:32 And the trees are the second element in the myPlants array, which is index [1].

2:02:38 Now we need to get the list.

2:02:42 So, the list of trees here, so I’m going to do .list.

2:02:47 And since .list is an array, I can use the bracket notation to get

2:02:53 the second list element which again is array index [1].

2:02:57 So, if we run this it’s going to console.log and we see “pine”.

2:03:02 That’s the second tree here.

2:03:05 [Record Collection] This is a coding challenge we're going to do.

2:03:11 We're given this object here which is a record collection.

2:03:17 Each record has an ID and then also

2:03:21 has different pieces of information about the record.

2:03:25 They don’t all have the same information.

2:03:27 But see, we have “album” “artist” “tracks” "album” “artist” “tracks”.

2:03:32 This just say “artist” “tracks” and this just has album here.

2:03:36 And we are supposed to create this updateRecords

2:03:41 function where we can pass in the ID, the property, and the value.

2:03:46 And it’s going to update our record collection with the property and the value.

2:03:51 So, for instance, if we pass in the ID "2468” and we put the property “artist”.

2:03:58 And if we set a different value,

2:04:00 like “Quincy” or something like that, then we should update this whole object.

2:04:05 So now it says “Quincy” instead of Prince.

2:04:08 And we should return the full collection.

2:04:12 So, it’s going to update the collection and then return the collection.

2:04:15 If we have an empty string for the value,

2:04:19 it should just completely delete that property.

2:04:22 Also, if we have the property of tracks and then we have a value,

2:04:28 instead of updating the whole tracks here with what we put in, it’s

2:04:34 just going to add the track to the end of this array.

2:04:38 So, if you look really here,

2:04:40 the comment says "Keep a copy of the collection for tests”.

2:04:45 This JSON.parse and JSON.stringify and then collection,

2:04:50 this is just a fancy way in Javascript to make a copy of the object.

2:04:56 Remember, in our function we are going to be changing the collection object.

2:05:02 But we want to have a copy of the original object before anything was changed.

2:05:08 So, that’s what that’s for.

2:05:10 So, let’s go ahead and do that.

2:05:12 So, we're just updating this function here.

2:05:15 This update records function.

2:05:17 Okay, so let’s get to this.

2:05:19 So we'll do if (value)=== blank.

2:05:26 Because the first condition we are going to test

2:05:28 for is if we need to delete the property.

2:05:31 Remember, if the value is set to blank we delete that property.

2:05:34 So, if the value is blank, we are going to delete collection.

2:05:41 And then we have to use bracket notation [ID] and then [prop].

2:05:47 The collection[ID][prop], that’s the collection here.

2:05:51 If we pass in the ID 1248, it’ll go to there.

2:05:55 The property, if we pass in album for the property it would go to here.

2:05:58 And then it would just delete that whole thing if our value is an empty string.

2:06:02 Okay, the next condition we have to look for is if the property is “tracks”.

2:06:09 Because for most properties we're just going to override

2:06:12 that property with the value passed into the function.

2:06:15 But if the property is tracks, we're going to push onto the end of the array.

2:06:20 So, let’s do an else if.

2:06:22 Else if (prop)=== “tracks”),

2:06:25 then we just have to push onto the end of the array.

2:06:34 So, there’s also another condition here which

2:06:38 is if the tracks property is empty.

2:06:43 If the tracks property is empty, we need to create it.

2:06:47 Here’s a fancy way to do that.

2:06:49 Collection[ID][prop] So if prop= tracks,

2:06:58 we are going to set the tracks– because remember prop is going to equal tracks.

2:07:03 We're going to set the tracks to equal.

2:07:06 It’s going to either equal itself if it exists.

2:07:10 Or if it doesn’t exist, we're going to create it.

2:07:12 I’ll show you how.

2:07:14 Collection[ID][prop].

2:07:19 It’s going to equal itself.

2:07:21 Or– if the or operator is going to equal an empty array.

2:07:27 So, if this already exists we're going to set it to equal itself.

2:07:32 But if itself doesn’t exist, we'll just set it to equal an empty array.

2:07:38 So, that’s just a way to create that property if it doesn’t already exist.

2:07:43 So, now that we know it exists we can

2:07:46 just push the value to the end of the array.

2:07:48 Collection[ID][prop].

2:07:54 And we'll just do the .push and then put in the parenthesis, the value.

2:08:02 So we're able to push the value that was passed

2:08:05 in to the function onto the end of the array.

2:08:08 Okay, there’s only one last condition which

2:08:12 is the kind of the default condition.

2:08:15 Else.

2:08:17 So, if the value isn’t blank and the property isn’t tracks,

2:08:22 then we just push the value onto the property.

2:08:27 Then we just set the property to equal the value, just like this.

2:08:32 collection[ID][prop]=value.

2:08:42 Okay.

2:08:42 Let’s test this out.

2:08:45 So, we already have this example down here, but to see if it actually worked,

2:08:49 we're going to do a console.log so we can see the output there.

2:08:54 And if I run that– oh, let me open up the console so we can really see it.

2:09:00 So, let’s see what we changed.

2:09:02 Go to 5439 and we set the artist which didn’t previously exist to “ABBA”.

2:09:09 So, let’s look down here.

2:09:11 In the console, 5439 and the artist is “ABBA”.

2:09:15 Let’s see what happens when we add a track.

2:09:18 So, we'll do one more example here.

2:09:21 I’ll just put it right above here, updateRecords.

2:09:26 And I’m going to pass in something.

2:09:29 I’ll pass in– let’s see, the ID 2468.

2:09:35 And we'll pass in the key which is going to be “tracks”.

2:09:43 And then for the value, we'll put “test”.

2:09:49 So, let’s see what happens here.

2:09:53 If we run that, it’s going to update the record here.

2:09:55 And then it’s going to update the record again, but we don’t care about that.

2:09:59 We mainly care that it’s going to console.log what the final value is.

2:10:03 So, if we look at 2468 here.

2:10:06 2468, let’s see the tracks.

2:10:08 We got “1999” “Little Red Corvette” and “test”, so it’s working.

2:10:13 Great.

2:10:14 [Iterate with While Loops] Loops allow you to run the same code multiple times.

2:10:22 I’m going to talk to you about a while loop that runs

2:10:26 while a specified condition is true and stops once it’s no longer true.

2:10:30 So, we are going to push the digit 0 through 4 onto this array.

2:10:35 Here’s how it’s going to work.

2:10:36 while is the while loop.

2:10:39 while i is less than 5.

2:10:43 And we're going to do something while that’s true.

2:10:46 First, we have to set what i starts off at.

2:10:50 So, var i= 0.

2:10:53 So, while i is less than 5, we'll do myArray.push(i).

2:11:01 Just push it onto the array.

2:11:03 And to make sure this loop eventually ends,

2:11:06 I’ll have to do i++ which increments i.

2:11:09 So, then I will test this out by doing console.log.

2:11:15 And I’m going to console.log the myArray.

2:11:18 So, let’s see if this works.

2:11:20 I’ll run this and check the console.

2:11:23 [0, 1, 2, 3, 4].

2:11:25 The while loop worked.

2:11:26 Every time it went through this five different times and pushed 0,

2:11:31 1, 2, 3 and 4 onto the loop.

2:11:34 [Iterate with For Loops] A for loop is

2:11:40 the most common type of loop in Javascript.

2:11:42 So here is an example of a for loop.

2:11:45 You start with the keyword for.

2:11:47 And then we have these parentheses with three

2:11:50 different items and they’re separated by semicolons.

2:11:52 The first thing is the initialization.

2:11:55 Then we have the condition.

2:11:57 Then we have the final expression.

2:12:00 So, the initialization happens before any of the code inside the loop runs.

2:12:06 So, we will start by initializing i to equal 0.

2:12:11 So, this is what most for loops start with, is you

2:12:15 have a variable that you’re going to initialize for the for loop.

2:12:18 Then the next thing is the condition.

2:12:21 So, once this evaluates to false we break out of the loop.

2:12:26 So, while i is less than 5 we'll continue to run through the loop

2:12:32 over and over until this is false and we break out of the loop.

2:12:36 The final thing is what we do at the end of each iteration.

2:12:40 At the end of each iteration, we will increment i by 1.

2:12:44 In this example, we are filling our array with the numbers 0 through 4.

2:12:49 I’m going to do another example where we

2:12:51 fill an array with the numbers 1 through 5.

2:12:53 So, we'll start with 4.

2:12:55 Now, we're going to initialize i to equal 1.

2:13:00 We're starting with 1 instead of 0 this time.

2:13:03 And we're going to do i is less than 6.

2:13:05 So while i is less than 6 or until i is more than 6,

2:13:09 we are going to run all the code in this loop.

2:13:12 And at the end of each iteration, we are going to increment i.

2:13:17 Now I can just do what we have before.

2:13:21 myArray.push(i).

2:13:25 So, the final thing we will do is test this.

2:13:28 I will do console.log and put myArray inside here.

2:13:33 And I’ll just load this and see what we see in the console.

2:13:37 [1, 2, 3, 4, 5].

2:13:39 It worked.

2:13:41 We iterated five different times and each time

2:13:44 we pushed a new digit onto the array.

2:13:47 And at the end of each iteration we incremented

2:13:51 i so it pushed a larger number onto the array.

2:13:55 [Iterate Odd Numbers with a For Loop] Loops

2:13:59 don’t just have to increment one at a time.

2:14:02 Look at this for loop here.

2:14:04 We have our initialization where we initialize i to 0.

2:14:08 And then we are going to run the loop until i is less than 10.

2:14:14 And finally, our increment, instead of incrementing i by 1,

2:14:18 we're incrementing i by 2.

2:14:20 So, now this is going to push all the even numbers onto the array.

2:14:25 We have console.log, so let’s log it out and see what it looks like.

2:14:28 [0, 2, 4, 6, 8].

2:14:31 I’m going to write another loop right now that creates an array of odd numbers.

2:14:36 So, let’s do that.

2:14:38 for (var) i= 1.

2:14:43 We’ll start at 1.

2:14:44 While i is less than 10.

2:14:49 I can use 10 again.

2:14:50 I’m going to do i +=2.

2:14:58 So, we're still going to count by 2s,

2:15:00 but since we're starting at 1 instead of 0 this should give us the odd numbers.

2:15:04 So, let’s see what’s going to be inside our loop.

2:15:08 myArray.push and I’ll just put i there.

2:15:13 So, let’s log this out and see if we did it right.

2:15:17 console.log(myarray).

2:15:20 And I’ll run that.

2:15:22 [1, 3, 5, 7, 9].

2:15:26 It worked.

2:15:27 [Count Backwards with a For Loop] A for loop

2:15:32 can also be used to count backwards.

2:15:34 So, if we see this for loop here, we’re initializing i to 10.

2:15:38 We're starting at 10 and we're going back to 0.

2:15:42 So, we're going to iterate through this loop while i is more than 0.

2:15:46 We’re going to keep iterating.

2:15:49 And at the end of each iteration we're

2:15:51 going to decrement i instead of increment it.

2:15:54 We're going to go down by 2.

2:15:56 i-= 2 means i=i-2.

2:15:59 So, we're going to continue pushing the lower and lower

2:16:03 numbers onto the array until i is less than 0.

2:16:06 So, let’s log this out and see what ourArray becomes.

2:16:09 You can see [10, 8, 6, 4, 2].

2:16:13 Well, I’m going to write another where we’re going

2:16:16 to push the odd numbers from 9 through 1 to myArray.

2:16:19 So, another for loop.

2:16:22 And I’m going to do var i= 9 because we want to start at 9.

2:16:28 Now we’ll still do i is more than 0.

2:16:31 So while i is more than 0 we're going to keep going through this array.

2:16:35 And we'll do i– and everything else is really the same.

2:16:40 2.

2:16:41 And this is going to get all the odd numbers onto the array.

2:16:46 So, we just have to do myArray.push and then push on the i there.

2:16:52 Now we'll just console.log so we can see what it ended up as.

2:16:58 myArray.

2:17:00 And I’ll run the code.

2:17:04 [9, 7, 5, 3, 1] We did it.

2:17:07 [Iterate Through an Array with a For Loop] It is

2:17:12 common in Javascript to iterate through the contents of an array.

2:17:16 So, look at this example.

2:17:18 We have this array here.

2:17:20 Before, we were always adding items to the array.

2:17:23 But this time the array already exists.

2:17:25 Right here, ourArr= [9, 10, 11, 12].

2:17:28 So, we are going to start at 0.

2:17:31 But now instead of going to a specific number of iterations,

2:17:37 we are going to the OurArr.length.

2:17:40 So, the length is 4 here.

2:17:42 But if we added elements to this array,

2:17:45 that means this loop would just go even longer

2:17:48 until we went through every element of that array.

2:17:51 And then at the end we're going to increment

2:17:53 i by one at the end of each iteration.

2:17:56 So, look at what we're doing inside the array.

2:17:59 We're going doing ourTotal that starts off at 0 up here.

2:18:03 And we’re doing+=.

2:18:05 That means we're going to do ourTotal= ourTotal plus something else.

2:18:09 So, we're going to keep adding to the total

2:18:13 whatever is in the array at that index.

2:18:16 So, ourArr[i].

2:18:18 So, it starts at 0.

2:18:20 And then it goes 1, 2, 3 until it gets to 4 which is the length

2:18:26 of the array and it doesn’t even run the iteration at 4.

2:18:29 And there is no index[4] on the array.

2:18:33 Remember, it’s 0, 1, 2, 3.

2:18:35 So this is just going to add up all those numbers.

2:18:38 If we run this we can see it adds up to 42.

2:18:42 I’m going to write another for loop down here that’s

2:18:44 going to add up all the numbers in this array here.

2:18:47 So, we'll do for (var i= 0).

2:18:53 And then we’ll do i is less than myArr.length.

2:19:00 And i++.

2:19:05 So, just like before.

2:19:07 For each element in myArr we're going to do a total+= myArr index [i].

2:19:21 So, we have to initialize the total variable right up here.

2:19:24 So, we'll do a var total= 0.

2:19:28 And then at the end we’ll just console.log that out to see what the total is.

2:19:35 So, if I just run this we can see that the total this time is 20.

2:19:42 [Nesting For Loops] If you have a multidimensional or nested array,

2:19:50 you can use nested for loops to access all the array elements.

2:19:54 So, for instance, we have this multiple all function.

2:19:57 It’s defined up here,

2:19:59 but we're calling it here and we're passing in this multidimensional array.

2:20:03 Which is basically an array with the arrays inside the array.

2:20:07 So, inside the first array there are three elements.

2:20:10 One.

2:20:11 Two.

2:20:12 Three.

2:20:13 And you can see each of those elements

2:20:15 are in array with their own set of elements.

2:20:17 So, we are going to use nested for loops within this multiply

2:20:20 all function to multiply every number in these nested arrays here.

2:20:26 So, let’s get started.

2:20:27 We're going to start with a for loop.

2:20:29 And it’s going to look just like the other for loops that we started.

2:20:32 i= 0.

2:20:35 We’re going to initialize i to 0.

2:20:36 And then we're going to say while i is less than arr.length.

2:20:42 And then we're just going to increment i at the end of each iteration.

2:20:48 Now, arr.length, that’s going to start off

2:20:51 as 3 because we're passing in this array.

2:20:55 And the first level of the array, there’s just one, two, three elements.

2:21:00 So, that’s going to be 3.

2:21:02 But now, we're going to go inside this for loop and create another for loop.

2:21:07 So, we're going to do var j= 0.

2:21:12 Normally, it’s standard practice to call the variable that we're incrementing i,

2:21:16 but we already have an i within this scope.

2:21:19 So, we need to create another name and it’s pretty standard

2:21:22 to call the next variable j because j is after i.

2:21:26 So, now we're going to do a j.

2:21:28 while j is less than– now this is where it gets a little tricky.

2:21:32 We're going to do while a is less than arr index[i].length.

2:21:40 Also, we're going to increment j here.

2:21:43 So, this is going to change.

2:21:45 So, the first iteration of this outer for loop,

2:21:48 we're looking at the length of this array.

2:21:50 Then we're looking at the length of this array.

2:21:52 Then we're looking at the length of this array.

2:21:55 The index is going to be different every time so we're

2:21:58 going to be going to each different array inside the nested array.

2:22:01 So, at this point, we just have to multiply all the numbers together.

2:22:08 So, we already have the product that we've defined above.

2:22:11 So, we're going to do product*= which

2:22:14 is just going to multiply everything together.

2:22:17 And we're going to do arr[i][j].

2:22:24 So, the i references the outer array and the j

2:22:28 references the inner array within what we're passing in.

2:22:33 And now we're done.

2:22:35 So, let’s– we have the console.log here so let’s run this and see what happens.

2:22:40 And 5040.

2:22:44 [Iterate with Do…While Loops] Next I’m going to talk about do while loops.

2:22:51 Now we already talked about while loops and I’m going to review this while loop

2:22:56 and then I will tell you how a do while loop is different than a while loop.

2:23:00 So, this while loop first checks the condition

2:23:04 before it runs any code within the loop.

2:23:08 A do while loop will always run at least

2:23:12 one time and then it will check the condition.

2:23:16 So, here we have this empty array.

2:23:19 We have i= 10.

2:23:21 So, while i is less than 5, well,

2:23:23 i is not less than 5 so it’ not going to do anything.

2:23:27 Let’s see what happens.

2:23:28 So, we see it logged out 10 and then an empty array

2:23:33 because i started as 10 and myArray started as this empty array.

2:23:36 So, you were logging the i in myArray.

2:23:39 With a do while loop, it’s different.

2:23:41 So, what I’m going to do is cut this line up here and put it at the end.

2:23:45 And then at the beginning I’m going to put the keyword do.

2:23:49 In a do while loop, this is always

2:23:52 run at least once before it checks the condition.

2:23:55 So, first it’s going to do these things

2:23:57 and then it’s going to check the condition.

2:23:59 In this case, it’s going to find out the condition

2:24:01 is false and it’s going to break out of the loop.

2:24:04 Let’s see what happens here.

2:24:05 See, now i is 11 and the array has the 10 added to it.

2:24:11 [Profile Lookup] This is a coding challenge.

2:24:17 We have this array of objects in our contacts list.

2:24:21 And you’ll see each object is one of our contacts.

2:24:24 What the first name, a last name, a number, and likes.

2:24:27 So, these are key value pairs here.

2:24:30 So, what we want to do is create

2:24:33 this lookUpProfile function where we pass in a name.

2:24:37 This is a first name.

2:24:39 And the property.

2:24:40 and it’s going to return the value of that property.

2:24:43 For instance, if we pass in the name “Kristian” here

2:24:47 and we pass in the property of “number” it should return “unknown”.

2:24:52 If we pass in the first name of “Sherlock” up here and we return the property

2:24:58 and we pass in the property of “likes”

2:25:02 it should return the array “Intriguing Cases” and “Violin”.

2:25:05 If the name that’s passed in does not correspond to any contacts,

2:25:10 then our function should return “No such contact”.

2:25:13 And if there’s no property, it should return “No such property”.

2:25:16 So, let’s go to this function here and start creating it.

2:25:19 So, the first thing we're going to have to do

2:25:22 is iterate through each element in the contacts list.

2:25:25 So, let’s make a for loop.

2:25:28 So, for (var i= 0) while i is less than contacts.length.

2:25:43 And at the end of each iteration we'll do i++ to increment that.

2:25:49 So, for each of these contacts the first thing we're going

2:25:53 to check is if the name is a name in this list.

2:25:57 So, if(contacts[i].firstName=== The name that was passed in.

2:26:14 So, we're checking each item to see if it was the name that was passed in.

2:26:17 And if so, we're going to do something.

2:26:21 Now, if not, we're going to do something else, so let’s do that now.

2:26:25 Remember, if the name that was passed in is not in the array,

2:26:28 we're going to return “No such contact”.

2:26:33 If it is in the array we're going to go something else.

2:26:37 If the name is in the contacts list we're going

2:26:40 to return the value of the property that was passed in.

2:26:43 So, return contacts[i][prop].

2:26:48 So, this will return the value of that property that was passed in.

2:26:52 However, there’s another case which is if the property

2:26:55 does not exist we return “No such property”.

2:26:58 So, a fancy way in Javascript of saying use this value if it exists,

2:27:04 but otherwise use a different value is to use the or operator.

2:27:08 So, we'll say return contacts[i][prop] or if it doesn’t exist,

2:27:13 we're going to return “No such property”.

2:27:17 And just so you know, there would be a way to do this without using

2:27:22 this or operator as long as that your code passes the requirements,

2:27:27 that’s all that’s important.

2:27:29 There’s many ways of doing this.

2:27:31 But let’s check it.

2:27:32 So, right now we have our lookUpProfile.

2:27:34 We're passing in “Akira” and we're trying to find the “likes”.

2:27:37 And we're console.logging the data.

2:27:39 And “Pizza” "Coding” "Brownie Points”.

2:27:43 So, what if we passed in something else?

2:27:45 If we passed in “Shirlock”.

2:27:48 Pass in “lastName”.

2:27:51 “No such contact.” Well, that’s working because I spelled “Sherlock” wrong.

2:28:01 This is E.

2:28:02 So, this is a good way to test that.

2:28:05 “Holmes”.

2:28:07 And the last thing we'll check is if we pass in a property that does not exist.

2:28:11 I’ll just say “Hello”.

2:28:13 And “No such property”.

2:28:15 So, our function works.

2:28:18 [Generate Random Fractions] There is a simple way

2:28:23 to create a random decimal number in Javascript.

2:28:25 It’s with the math.random function.

2:28:29 So, we have this function here which just says randomFraction.

2:28:33 And it’s returning 0 currently.

2:28:36 But we're going to use the math.random function.

2:28:39 And you well see that when I run this we have 0,2003813741 and so on.

2:28:47 So, it’s always going to be a number between 0 and it could be 0.

2:28:51 Between 0 and 1, but it could not be 1.

2:28:53 [Generate Random Whole Numbers] Often you want a random

2:28:59 whole number instead of a random decimal number.

2:29:01 That can be accomplished with Math.floor.

2:29:05 We have Math.floor here.

2:29:07 This rounds down to the nearest whole number.

2:29:10 So, we pass in (Math.random()* 20).

2:29:15 And then we round down to the nearest whole number.

2:29:18 This is going to create a random whole number between 0 and 19.

2:29:23 Remember Math.random can never be 1.

2:29:27 It can be 0, but it can ever be quite 1.

2:29:30 So, when we multiply it by 20 we’re going to get a number between 0 and 20,

2:29:37 but not including 20.

2:29:39 And then we round down, which will end up being 0 to 19.

2:29:44 So, let me show you another example where we're going

2:29:46 to get a random whole number between 0 and 9.

2:29:49 It’s going to look just like this.

2:29:52 So, we're going to modify this function.

2:29:54 So, this Math.random we're going to pass that into Math.floor.

2:30:00 So, I have to put the parenthesis

2:30:02 because we're passing that in to that function.

2:30:05 And it’s Math.random* 10.

2:30:09 And that’s going to give us a random number between 0 and 9.

2:30:12 So, if I reload this I can see.

2:30:18 Every time I load it, it’s a different random number.

2:30:21 [Generate Random Whole Numbers within a Range] You

2:30:25 can also generate random whole numbers within a range.

2:30:27 So, look at this function here, ourRandomRange.

2:30:31 It takes a minimum number and a maximum number

2:30:34 and then it just runs through this calculation here.

2:30:37 So, we have the Math.random and we multiply it by the maximum or min number+ 1.

2:30:44 And then we get the floor which is rounding down.

2:30:48 And we add all that to our minimum number.

2:30:50 So, this is just a calculation to get a random number between the min and max.

2:30:56 So, as practiced, I’m going to rewrite it down here.

2:31:01 So, we have the random range.

2:31:02 And instead of ourMin and ourMax, we have myMin and myMax.

2:31:06 However, the equation is going to be the same.

2:31:08 So, we have Math.floor.

2:31:10 You can take a chance to actually just look over

2:31:13 the equation and see if you can understand how it works.

2:31:17 myMax minus myMin.

2:31:21 And then we just have to do+ 1.

2:31:26 And then this whole thing is going to be+ myMin.

2:31:30 So, we already have this example test set up down here.

2:31:35 randomRange between 5 and 15 and we're going to log it out here.

2:31:38 So, let’s try that.

2:31:42 See, every number is between 5 and 15 whenever I run it.

2:31:45 [Use the parseInt Function] Another useful function is the parseInt function.

2:31:52 It takes a string and returns an integer.

2:31:55 A lot of times you want to make sure you’re dealing

2:31:58 with integers and not strings for different calculations and things like that.

2:32:02 If the string cannot be converted into an integer

2:32:05 it returns in NaN for Not a Number.

2:32:08 So, let me show you how it works.

2:32:10 From this convertToInteger function we are going to return.

2:32:14 And we're going to return the string except

2:32:16 we're going to convert it into an integer first.

2:32:20 So, we'll do parseInt.

2:32:23 And then I’ll pass in the string.

2:32:25 Now, it was a string because you can see here we're passing in the string

2:32:31 of “56” but it’s going to return it as a number and integer.

2:32:35 [Use the parseInt Function with a Radix] The parseInt

2:32:40 function can also be used with a radix.

2:32:42 The radix specifies the base of the number in the string.

2:32:46 Such as base 2 or base 7 or base 8.

2:32:50 A base 2 would be binary.

2:32:52 So, that’s one of the most common ones to use.

2:32:55 Now the default is base 10.

2:32:57 That’s what we use normally every day.

2:33:00 But let me show you how that would work.

2:33:01 We're going to convert this number which is a binary number to an integer.

2:33:06 So, we'll do return.

2:33:08 And I will do the parseInt.

2:33:13 I’ll pass in the string as before, but now we'll have a second argument after

2:33:18 the comma which is going to be the number 2.

2:33:21 So, instead of the default of base 10 we'll be passing it as base 2.

2:33:25 So, the computer knows that this is a binary number.

2:33:28 [Use the Conditional (Ternary) Operator] I love the ternary operator.

2:33:34 It’s like a one line if else expression.

2:33:38 Now this is what it looks like.

2:33:40 You have your condition just like in an if statement.

2:33:44 And then you would have a question mark.

2:33:47 After the question mark you have what’s

2:33:49 going to happen if the condition is true.

2:33:52 Then you have a colon.

2:33:54 Then you have what’s going to happen if the condition is false.

2:33:58 So, we can replace an if else statement

2:34:01 like this into something using the ternary operator.

2:34:05 So, here we have if this condition is true, we're going to return true.

2:34:09 Else, we're going to return false.

2:34:11 Let’s change this.

2:34:12 So, now we're going to use the ternary operator.

2:34:15 So now it’s just going to say return a=== b.

2:34:20 That’s the condition.

2:34:22 Then we use the question mark.

2:34:23 So if it’s true, we're going to return true.

2:34:26 And then we have a colon.

2:34:29 And after the colon we have what’s going to happen if it’s false,

2:34:33 which is we're going to return false.

2:34:36 Now I’m going to be honest.

2:34:38 You would never write a line like this in real

2:34:42 life because you could just write return a=== b.

2:34:47 And this line is actually going to do the same thing as this line.

2:34:51 However, I just want to give you a simple example of using the ternary operator.

2:34:56 [Use Multiple Conditional (Ternary) Operators] One

2:35:01 of the great things about conditional or ternary operators

2:35:04 is that you can nest them within each other which gives them even more power.

2:35:08 So, we're going to write a function here.

2:35:11 The function checkSign.

2:35:12 And it’s going to return the string “Positive” if this number

2:35:16 is positive "Negative” if the number is negative, or 0.

2:35:21 And we're going to use a nested conditional operator.

2:35:24 So, here it is.

2:35:25 return.

2:35:27 And first we're going to check if num is more than 0.

2:35:31 And then we'll use the ternary operator.

2:35:33 If so, the first thing after the question mark is if it’s true.

2:35:38 If it’s true, we're going to return “positive”.

2:35:40 If it’s false, if the number is not more than 0 we'll do something else.

2:35:47 Here is where we're going to have another ternary operator.

2:35:51 We're going to check if num is less than 0.

2:35:55 So, if the number is less than 0, well, if that’s true,

2:35:59 we have to have the question mark for the ternary operator.

2:36:02 If that’s true, we're going to return “negative”.

2:36:06 And if it’s false, that’s where the colon

2:36:09 comes in, we're going to return “zero”.

2:36:13 So, let’s do this checkSign.

2:36:16 I’m going to do a console.log so we can see what this returns here.

2:36:20 And we can see this is going to return “positive”.

2:36:25 If we have a negative number here it’s going to return “negative”.

2:36:29 Or if we have a 0 it’s going to return “zero”.

2:36:33 Now you’ll see that after this colon we have an entire ternary operator.

2:36:40 So, if this is true we just return “positive”.

2:36:44 If it’s false, then we do everything here which is

2:36:49 another ternary operator where it checks if this is true.

2:36:52 And if that’s true, we return “negative”.

2:36:54 And if it’s false, it would return “zero”.

2:36:56 [Differences Between the var and let Keywords] For a long time in Javascript if

2:37:02 you were going to declare a variable you had to use the var keyword.

2:37:07 But starting with ES6 in 2015 we can

2:37:11 now declare variables with let and const as well.

2:37:15 Over the next few lessons I will be talking about

2:37:18 what let and const do that is different than var.

2:37:21 But one of the things is that let does not let you declare a variable twice.

2:37:27 So, let’s look at this example.

2:37:29 You have var catName= “Quincy”.

2:37:31 And then down here, var catName= “Beau”.

2:37:33 And if I just run this code you’ll see that nothing is happening.

2:37:37 It’s just allowing us to set the catName

2:37:40 twice and declare it twice with the var keyword.

2:37:42 However, if we change this to let.

2:37:45 We're going to change all the var to let.

2:37:48 And you’ll see that when we load it again,

2:37:52 you’ll see an error, Duplicate declaration “catName”.

2:37:55 So, this is good that it’s creating this error because you usually

2:38:00 don’t want to declare a variable two times in the same scope.

2:38:04 So, this allows your program to give you

2:38:07 an error to tell you that you’ve done something wrong.

2:38:10 Now you can still reset it.

2:38:13 So if we don’t use the word let here we could just set the catName variable.

2:38:18 And now we're not going to get an error.

2:38:21 In this case, we're declaring the variable here to be “Quincy”

2:38:24 and we're setting the same variable to a new name here.

2:38:28 This is one of the few reasons that many people only

2:38:31 use let and const and never use var to declare variables.

2:38:36 Another thing in this code you can see is “use strict”.

2:38:40 Now this enables strict mode which

2:38:43 catches common coding mistakes and unsafe actions.

2:38:46 So, a lot of people will use “use strict” at the top

2:38:50 of a full Javascript file or maybe just in a function to catch coding mistakes.

2:38:56 Such as if you create a variable and don’t declare it with var, let, or const.

2:39:01 [Compare Scopes of the var and let Keywords] Another major difference between

2:39:07 the var and let keywords is that when you declare a variable with var,

2:39:11 it is declared globally or locally if declared inside a function.

2:39:16 However, let– the scope of let is limited

2:39:20 to the block statement or expression that it was declared in.

2:39:24 So, let’s look at this example here.

2:39:27 If you see this code,

2:39:29 we have this checkScope function and we're calling it down here.

2:39:33 And it’s setting i with a var here, the var keyword, to “function scope”.

2:39:38 Then we're setting it to “Block scope” in here.

2:39:41 And you can see it’s console.logging “Block scope i is:“.

2:39:46 And it says “Block scope”.

2:39:48 And when we get down here "Function scope” it’s still “Block scope”.

2:39:52 If we want this to be “function scope” down here,

2:39:55 we're going to have to use let.

2:39:58 So, we would use let here and then we would use let here.

2:40:04 And if we run the code,

2:40:06 now you can see in the console ""Block scope i is: “block scope”.

2:40:11 “Function scope i is: “function scope”.

2:40:14 So, even though we set i to block scope here inside this block.

2:40:19 Now, a block is just anything inside these squiggly braces here.

2:40:24 So, with an i inside this block to “block scope”.

2:40:27 But then when we get out here,

2:40:29 it’s now back to “function scope” because of this up here.

2:40:33 Here’s another thing I want to show you.

2:40:35 If this is– if we comment this line out and we change this to var,

2:40:41 what do you think is going to happen?

2:40:43 Well, let’s run it and find out.

2:40:46 Look, we set the var inside this block here to “block scope”.

2:40:53 And it says Block scope is: “block scope”.

2:40:56 But then when we're outside of the block,

2:40:59 when we're outside of this squiggly braces here, we can still access i here.

2:41:04 And it’s set to block scope.

2:41:07 But if this was a let and we're declaring it inside this block.

2:41:11 If we run that now when we get outside the block,

2:41:15 we get an error because it’s not defined.

2:41:18 So, that’s another reason why people use let instead of var is so that they can

2:41:23 make sure the variable is only defined

2:41:25 in the area they want it to be defined in.

2:41:28 But for now I’ll uncomment this out.

2:41:32 [Declare a Read-Only Variable with the const Keyword]

2:41:36 Const is another way to declare a variable.

2:41:39 It has all the features of let but it’s also read-only.

2:41:43 You cannot reassign a const.

2:41:45 So, let’s look at this program here.

2:41:48 We’re running this printManyTimes.

2:41:50 And it’s going to log out this sentence.

2:41:53 And the sentence is up here.

2:41:55 var sentence is declared.

2:41:57 And then we reassign it here.

2:41:59 So, first we declare the sentence to be the string“ is cool!”.

2:42:02 Then it’s reassigned to be the string“ is amazing!”.

2:42:06 So, if we run that it should work.

2:42:08 It prints freeCodeCamp is amazing!

2:42:10 many times.

2:42:11 But if we change this to const let’s see what happens.

2:42:16 Now I’ll run this and we get an error.

2:42:19 “sentence” is read-only.

2:42:22 If you declare a variable with the const

2:42:26 keyword you cannot reassign it afterwards.

2:42:29 This can be very helpful to prevent you from accidentally making mistakes later.

2:42:35 If you know for sure that you never want to reassign a variable,

2:42:40 always use const so you don’t accidentally reassign it when you don’t mean to.

2:42:47 Another thing is when you’re using const

2:42:51 it’s very common to use all capital letters.

2:42:55 So, like this, SENTENCE like that.

2:42:59 And that’s another away to remember that it’s a constant.

2:43:02 So, if I rename this here, I’m also going to have to repeat it here.

2:43:06 And while we're at it, we're going to change this to let because

2:43:11 for the most part you should only use const or let,

2:43:15 but there are certain circumstances where you would use var.

2:43:18 And also in some other videos in this course I’ll be using var.

2:43:22 But in your own code you should mainly use const and let.

2:43:26 Let’s reload this to see what happens.

2:43:29 And it worked.

2:43:30 freeCodeCamp is cool!

2:43:31 many times.

2:43:32 We can no longer say that freeCodeCamp is awesome,

2:43:36 even though we know it actually is.

2:43:39 [Mutate an Array Declared with const] While you cannot reassign

2:43:45 a variable declare with const you can mutate an array.

2:43:49 So, look at this example that’s not going to work.

2:43:52 First we declare the variable s and we assign it to an array.

2:43:57 We declare with const.

2:43:59 And now we're going to reassign the variable s here.

2:44:02 But if we do that we're going to get the error “s” is read-only.

2:44:06 However, we can update the array using bracket notation.

2:44:12 So, I’ll just comment that out.

2:44:15 And using bracket notation, I’ll do index [0].

2:44:18 I’ll assign to the 2.

2:44:20 Index [1], I’ll assign that to 5.

2:44:27 And then index [2] I’ll assign that to 7.

2:44:33 And just like that it is going to reassign the array.

2:44:38 So, if I just do a console.log here.

2:44:41 Console.log and put the array in there,

2:44:45 we should see the new array here, [2, 5, 7].

2:44:50 [Prevent Object Mutation] As seen previously,

2:44:56 a const declaration alone doesn’t really protect your data from mutation.

2:45:01 If you have an object or an array,

2:45:04 you can still mutate it even if it’s declared with const.

2:45:07 There is something called object.freeze that will prevent data mutation.

2:45:14 So, let me talk to you about object.freeze.

2:45:17 First of all, let’s understand this function here.

2:45:20 We're using this function to demonstrate object.freeze.

2:45:24 So, it’s going to create this constant, a math constant with the Pi in it.

2:45:29 This is an object.

2:45:31 And right now this can still be changed.

2:45:35 So, if we look down here, this is a try catch block.

2:45:40 We'll talk about try catch blocks in more detail later.

2:45:44 But for now, you just have to know that it’s

2:45:46 going to try what’s in the first part of the block.

2:45:49 And if there’s an error,

2:45:50 then it’s going to go into the catch part and it’s going to log it out.

2:45:55 So, right now we're going to try to change MATH_CONSTANTS.PI to 99.

2:46:01 And if you can see right here, we're going to return the MATH_CONSTANTS.PI.

2:46:08 And down here we are putting it into a variable called PI.

2:46:13 So, if we run this you’ll see that we console.log PI and it’s 99.

2:46:19 But wait a second, we don’t want PI

2:46:22 to change because we know that PI never changes.

2:46:25 That’s why we're going to use object.freeze.

2:46:29 So, I’ll put it right here.

2:46:30 I’m going to do object.freeze.

2:46:34 And in parenthesis I’ll put the object which is (MATH_CONSTANTS).

2:46:41 Now I’ve frozen MATH_CONSTANTS.

2:46:44 So when it tries to change MATH_CONSTANTS.PI here

2:46:47 it’s not going to work and it’s going to go into this catch block and it’s

2:46:53 going to log out the error or the exception.

2:46:55 So, let me run that.

2:46:57 And you’ll see.

2:47:03 So, we had an error.

2:47:04 And we can see here that PI stays the same at 3,1004.

2:47:08 So whenever you have an object and you don’t want

2:47:11 any of the items in the object to change, use object.freeze.

2:47:15 [Use Arrow Functions to Write Concise Anonymous Functions]

2:47:20 This function here is called an anonymous function.

2:47:24 It doesn’t have a name.

2:47:26 It is assigned to this variable magic.

2:47:29 But there’s no word right before the function

2:47:32 keyword to assign the name to the function.

2:47:34 Whenever you have an anonymous function you

2:47:37 can convert it into an arrow function.

2:47:40 That makes it a little quicker to write.

2:47:43 So, instead of the word function, I’m going to take that out completely.

2:47:47 And then put an arrow here.

2:47:49 So, this is the same thing except it’s just a little quicker to write.

2:47:54 But we can shorten this even more.

2:47:57 If we're just returning one value here we don’t even need the return keyword.

2:48:04 And we don’t need the curly braces.

2:48:07 So, I can delete all this.

2:48:09 And I can delete all this here.

2:48:12 And now this is the full function from before,

2:48:15 but it’s just really shortened up.

2:48:17 And to make this even nicer, we're not going to use var.

2:48:20 I’m going to change this to const.

2:48:22 [Write Arrow Functions with Parameters] Just like in a normal function,

2:48:29 you can pass arguments to arrow functions.

2:48:31 So let me show you how to convert this function into an arrow function.

2:48:36 So, it’s a normal function now and it has two arguments.

2:48:39 And then it’s going to concatenate the two arrays passed in.

2:48:43 So, first we'll take off the function keyword.

2:48:46 We're going to leave these parenthesis with the parameters.

2:48:49 Now I’ll put the arrow.