Loading
Lesson 19
Courses / JavaScript for Complete Beginners
Review of the JavaScript Things We Learned (Part 2)

Video Transcript

Welcome back to NBK Tech World! Let's continue our review of what we have done so far. Remember if you already feel comfortable with everything we've did, we've done so far feel free to skip this lesson. Alright so we finished our last video talking about revealing the operators we talked about the triple equals, strike equality, talking about striking equality and all the other operators greater than or lower, less than or equal to etc. So now let's review what we did in terms of string concatenation and interpolation. So we learned about string concatenation to combine strings together. So if you have a string hello and you want to add this guy to another string you can use the plus another string. For example if I have the string with the word hello and I have another string with the word world and you want to combine them you can use the plus operator and that will concatenate this with that. Notice if I do this way there won't be any space between the words so they'll be all glued together. So you actually have to place a space either here or here okay. Let's do it in a world. So keep that in mind. Also remember that this space here around the operator doesn't really matter it's just for style convention that I adopted. Even if you have spaces here could have as many as you want it will make a difference to the output right it will be the same. What determines the output is whatever is inside the quotes okay. The convention is I always put one space before and after the operator this case the plus that's a style convention okay. So that's concatenation and we learned that we can also have the variables like we'd had before right. If you have a name the variable you can concatenate this variable with whatever you want. So like a message to the screen we learn console log hello my name is whatever right. You can concatenate with the variable here. So if you want to print to the console some message and in the message you need some value from a variable in this case the variable is called name and holds the value my name or whatever your name is. So you can use the plus and then you concatenate with the string that's stored in the variable name. Okay so hello my name is my name okay. So that's string concatenation. Now we also learn about string interpolation. It's an alternative to concatenation that allows you to do the same kind of thing except you don't have to break the string right here and have to add a plus and then continue on another different part. You can just use the back tick if you want to do string interpolation that's a feature from JavaScript AcumenScript 2015 aka ES6. Okay so back tick and then you do the same thing hello my name is except now you can do the interpolation using the dollar sign with two curly races and whatever you want to interpolate inside. So this time I want this value of the variable name to be replaced right here where these these guys at. Okay so hello my name is my name so that's string interpolation. Okay so string concatenation or string interpolation. It's up to you to choose which one you would like to use. Can you use either of them or a combination of both? Doesn't matter. Whatever if you're comfortable with if you like better remember that string interpolation is fairly new to JavaScript comes with ES6 AcumenScript 2015. That's it for interpolation and concatenation so we also learn about functions. So we learned the concept of function and we learned to reuse code so we can call the function many times and we don't have to change the same code at multiple places. We can just change that in the function definition so we can call the function many times and if you want it you need to modify that function you just do it once instead of every single instance where you have to do the same code. Just to illustrate let's define a function here that prints some message and your name like we did before. So we start off with the keyword function then you give it a name let's say say hello okay and then you need some parameters. This function needs some inputs so we're gonna do just somebody's name so we need somebody's name so we can generate an output that is we want to print the message to the console saying let's say hello whatever the person's name is. Okay so we're gonna need that input you need to know the name person's name before you can say hello to them. So that's only one parameter in this function. Now when you define this function signature here you're gonna open the function definition function body with the open curly brace by convention I always put a space a style convention space after the parameters up to you to choose which convention you like. I usually do this convention and whenever I open a block okay this is called also a block a function definition block I indent by two spaces okay that's another convention that I use and then I start writing the function. It could be one could be one or more statements or it could be nothing at all right but that wouldn't be useful so let's do that console log to print a message so what we want to do is we want to say hello whatever the person name is and an exclamation how about that let's do a string interpolation do you remember use the back tick instead of the other kind of quote and then the variable name within the curly braces with a prepended with a dollar sign and that's what the exclamation point there okay remember I like adding semicolons to the end of statements set to another convention you don't have to have it here but it's a convention that I follow for every statement JavaScript I will have the semicolon and then I close the function I finish this definition with the closing curly brace aligned on the same level as the function keyword okay I don't do this I do that okay always aligned that's a convention that's widely used in not only JavaScript but other programming languages so let's see everything okay keyword function name of the function parameter just one that's the name definition just does a log to the console and it the message is going to be hello whatever name exclamation okay so we press enter we get nothing return value on defined right the function because we just defined a function we did not call it yet so first you have to define it before you can try to use it so if you want to call the function what do you do is first what's the function name say hello now you need to give it argument remember the whole notion of a parameter versus argument so when you define the function declaring the function signature this part here you give it a name and you give some parameters when I'm talking in this context I usually refer to this guy as the parameter but when I'm talking about the calling when you're calling a function I usually say argument instead of parameter that's just a convention and a naming okay that's like difference but sometimes some people might use the same term interchangeably but you should be aware that's a slight difference so what's the argument at whatever person's name you want I just gonna use my name you can use your name okay so let's try it out say hello with the argument name takes this guy and goes to that function and then this variable is gonna hold this value then it's gonna do a log hello and then whatever you passed here in this case my name is gonna be display hello my name with an exclamation mark so that's it that's a function right just reviewing what we already did and we learned if you can add more stuff to the function if you want you can add age like we did before so that would add another what what do you call this guy not a parameter right if you want to add another parameter you have to separate them with a comma so let's with age and also say hello whatever you are age years old so it's gonna say also the person's age you are age years old so remember comma separated parameter list for the function definition here by convention I always put a space after the comma it's not necessary but it's a style convention so you see there's all these style conventions that we follow I highly recommend that you pick them up from the beginning because it'll make your code a lot cleaner and you just practice ours is the beginning and once you're doing the real thing you're just gonna buy automatically right in a very elegant fashion okay so keep that in mind I was following these good best practice conventions so that's defined this again that's called a function now we can pass two arguments can pass your name comma the second argument is gonna be the age I'm just gonna make something up a number 35 okay so comma separated and this guy is gonna be mapped to name 35 is gonna be mapped to age so whatever say name you're gonna get this inside the function block okay whenever say age you're gonna get 35 inside the function block all right so let's try it out hello my name you are 35 years old so exactly we want it to be okay so that's it for functions now let's go on and continue our review we learned about some string operations remember so we learned about converting a string all the characters to uppercase and all the characters to lowercase so that's very easy right so if you have somebody's name like John someone and you want to convert this you want to generate a new string with all the characters in uppercase you can use to uppercase this is a method of the string you can use the dot name of the function or method and you just call it without any arguments because it already has the string right here so you're gonna get a new string okay it's not the original that's changed you're gonna get a new string with all the letters capitalized in the same fashion if you have John someone all capitalized and you want to convert all of these guys to lowercase note I just put some lower case here it won't matter you will stay the same right when we do to what to lowercase and then don't forget the parentheses whenever you have function calls remember the parentheses okay John someone so you're gonna get every single letter in lowercase so that's it to uppercase and to lowercase methods of the string type okay now let's talk about slicing a string so like we did before slice is used if you want to take parts of a string and you want to cut things off so if you have let's do the same example John someone you want to for example just get his last name here you want to get rid of one two three four five characters you can use slice right five characters give me you can think of it this way please slice the first five characters that's one way of thinking about this so this means it's gonna only get this part of the string okay then there's not a you can add another argument to the slice method to be able to grab not only from one side from the other example you want something like this part how would you get that well we have to figure out the indices right the index for each they start index and the end index for the string remember indices always start counting from zero count the index from zero so you're going let's count I just want this part of the string so how can we do it so zero is J one is O and two is gonna be the H so the first argument to the slice is gonna be two and I forgot if I highlighted everything okay sorry I took off the highlight but let's do it like this one from the H to out the way to the so me you owe the okay the last oh so where's that last oh so we figure out the first index for the H that's two let's keep counting and is three spaces for s is five oh is six and seven e eight oh nine okay oh is nine but remember that the slice is always the second argument is X is not inclusive so you have to count one more so you're gonna count to the end and that's 10 let make sure one zero one two three four six seven eight nine ten yeah correct ten so use 10 which is the index for n but that is not included when you do the slicing it actually includes 10 minus one which is gonna be the O so it's gonna grab from the H to the last oh let's try it out so it each to the last oh correct okay so that's slice so you're gonna get parts of a string you want to slice it okay now to finish our review we're gonna talk about replacement string replacement if you have John someone and you want to replace say someone with I don't know let's say another you can use a dot replace on that string first you have to tell it what to look for look for someone replace that with what the second argument is going to be another so I want to replace every instance of these the sequence of characters with this other sequence of characters called another just happened to be a word doesn't have to be a word could be any sequence of characters any patterns so you're gonna notice now it generates a new string with whatever whenever see someone it replaces with another the second argument to the replace method of the string we also talk about globally global replacement because if you have John someone and someone and someone whatever it only replaces the first instance it finds so if you really want to replace every instance of someone with another you have to do a global substitution for that you'll have to write the first argument in a regular expression fashion the JavaScript you can put forward slash anything in between will be a pattern for a regular expression we just learned the term we don't quite understand everything about it yet you just know that's something that you can put a pattern in between and then after that we put a G to say it's a global substitution okay for the replace is gonna take that okay you want to replace every instance of this pattern the word someone with this other word another so that case every single instance of someone is replaced with another okay so we have finished our review of all the things we've done so far I hope that helped you to refresh your mind about all the things that we've done so we can go on and keep on learning in this JavaScript this wonderful journey with JavaScript thank you so much for watching and until the next time goodbye
No comments yet (loading...)
No comments yet (loading...)
Did you like the lesson? 😆👍
Consider a donation to support our work: