Comments and the ConsoleComments are an easy way for you to leave notes for both yourself and other collaborators, directly into the code! This simple challenge shows you how to both print something using the console and utilize a comment. Challenge 1: Create your own console.log below line 4. You can print any word or phrase you like to the console. Just make sure you put the word or phrase in between quotes ("") like the example. We'll go into detail very soon as to what that means. Solution 1: There are two ways of commenting; (//) comments everything on the same line that comes after (/* */) is a way to performing multi-level comments On MacOSX you can hold the ⌘ + / buttons together while highlighting a section of code to quickly comment or un-comment without having to actually type it. Variable Assignment — (var)Challenge 2: Below line 6, declare a variable named lastName and assign it the value of your last name. Make sure you wrap your name in quotation marks, e.g. "Smith". Now, go back to line 1 and modify the value of firstName to be your first name. Uncomment the console.log statement on line 10 and run your code; you should see Jenny replaced by your first name—unless your first name is Jenny, of course. Code Editor
Solution 2: Older versions of JavaScript utilized the (var) to initialize a variable. In JavaScript ES6, (let) was introduced as another way to initialize variables and is the preferred way among software engineers. However, you may still run into (var) in older applications where it was used. This code will print the following to the console: Hi, Christopher Estep Notice how there is a space after the (,) in "Hi, " — This is done intentionally to add a space before the variable firstName is inserted. You will also notice in the final console.log() that there is also another empty space placed inside of quotations " ", which is done intentionally. Without the spaces the following would have been printed to the console: Hi,ChristopherEstep Variable Assignment — (let)Challenge 3: Now let's try declaring a variable with the let keyword. On line 3, declare a variable favFood using let and then assign it a value of the string "tacos". Now you can uncomment out line 6 to test your code. You should see "My favorite food is tacos" in your console. But wait! Maybe tacos aren't YOUR favorite food. Luckily, since we declared our variable, favFood, using the letkeyword, we can reassign it's value to something different! The best part is we don't have to declare the variable again. All we need to do is reassign it's value. On line 9, let's change the value of favFood to whatever your favorite food is. Next, uncomment the console.log on line 12 to check your code. You should see "No, but really, my favorite food is " in the console below. Solution 3: JavaScript is case-sensitive so it's imperative that once you assign a variable, you continue to refer to that same exact variable by using the camelCase naming convention. camelCase is a naming convention in which a name is formed of multiple words that are joined together as a single word with the first letter of each of the multiple words capitalized so that each word that makes up the name can easily be read. In this challenge it is (favFood). It is also very important to memorize the rules of naming variables:
Constant Assignment — (const)Challenge 4: Constants are a way to declare a variable that can never be modified. On line 3, declare a constant (myCodingConfidence) and assign it a value of "unwavering". Next, uncomment out line 6 to test your code! Now below line 8, let's try and reassign the value of myCodingConfidence to something else. After you've reassigned it, hit the Run Code button again and you'll know you did it right if you get the following error in the console: Type Error: Assignment to constant variable. Did you get the error message? Congratulations, you have successfully declared a constant! Now in order to pass the tests, you'll need to get rid of that error, so comment out line 9 where you attempted to reassign the variable and click the Check My Answer button below to run the tests! Solution 4: Just like the variables, you can set a constant (const) the exact same way. The reason why the console throws an error once you attempt to re-define the constant is because they can never be modified. The only variables that can be modified are (var) and (let). Primitive Data TypesChallenge 5: Now that you have been introduced to some of JavaScript's data types, take a stab at declaring some variables below with different data types. Make sure to read the challenge carefully so you know if you should be using let or const! Challenge 1: Declare a constant name that is a string, and set it equal to your name. Challenge 2: Declare a variable age that is a number, and set it equal to your age. Challenge 3: Declare a constant loveJavaScript that is a boolean, and set it equal to true. Challenge 4: Declare a variable listOfComplaints and set it's value to null. Solution 5: Code Editor
Primitive Data Types
Below is an example of what I mean by analyzing your syntax. I absolutely adore the engineering behind the 2022 Porsche Cayman GT4RS that was recently unveiled at the 2021 Los Angeles Auto Show. The first line of code is a string that would print 'true' to the console, and the second line of code is the boolean data-type true. These are two completely different data-types. StringsChallenge 6: 1. On line 7, declare a variable mySingleString with single quotes ('), and set it's value to any string you like. 2. On line 8, declare a variable myDoubleString with double quotes ("'), and set it's value to any string you like. 3. On line 9, declare a variable myBackString with backticks (`), and set it's value to any string you like. Hint: For now, only use plain text without any special characters or contractions. We'll go into why these may cause you trouble in next challenge. You can uncomment lines 12-14 to test your code in the console. Solution 6: All three of those variations of quotations work, however, use of single quotes ('') are the preferred method. Strings — Escape SequencesChallenge 7: 1. Uncomment out lines 1 & 2. Hit the Run Code button. Notice how we are missing all those backslashes? Add the appropriate \'s so that the path prints to the console with the proper \'s where they belong. 2. Uncomment out lines 4 & 5. Hit the Run Code button. Uh Oh! We've got an error! Fix the heSaid string so that it doesn't throw and error and prints to the console properly. 3. Uncomment out lines 7 & 8. Hit the Run Code button. Uh Oh! Another error! Fix the sheSaid string so that it doesn't throw and error and prints to the console properly. Solution 7: Syntax is important in JavaScript, especially when using symbols and multiple quotation marks within lines of code. Sometimes you can crash a program from simple missing \ or }. String ConcatenationChallenge 8: Use string concatenation to join the three provided strings (first, second, and third) and assign the resulting string to a variable called welcomeStatement. The value of welcomeStatement should be 'Welcome to the jungle!' Solution 8: This challenge utilizes the + operator. You can find a full list of operators and how they work here. There are so many different types of operators, that reference page is a great resource to identifying them. Template LiteralChallenge 9: Declare 2 variables x & y, and set their values to any number you like. Next declare a constant solution which is a string that prints to the console like the example below: let x = 2; let y = 5; const solution = <insert your code here>; console.log(solution) // => "The sum of 2 and 5 is 7" Hint: Don't forget the backticks (``).! Solution 9: Let's break this down into parts. The first part is setting two variables that are numbers, because they are the number data-type we do not put them in quotations. You can set the numbers to any number that you want, the challenge doesn't require any specific number in order to pass. I just had cars on my mind which is why I picked such simple numbers, but definitely feel free to try more complex numbers to get a feel for it! let x = <any number>; let y = <any number>; The next part that the challenge asks for is to define a string using a template literal. To perform this, you'll have to set a const and place the template literal inside of it using the backticks (` `). Once you have the string, you can refer to variables and execute code within the template literal by using ${ }. Just don't forget your closing backtick! Now the only part you have left to do is write the console.log() to print your answer to the console! String Properties & MethodsChallenge 10: 1. Declare a variable count and set its value equal to the length property of the string variable hometown. 2. Declare a variable upper and set its value equal to the string favAlbum converted to uppercase letters. 3. Declare a variable lower and set its value equal to the string favAlbum converted to lowercase letters. Solution 10: These are two very simple string methods, there are many more. You can find a list of the different string methods and what they do here. Bracket Notation for StringsChallenge 11: 1. Declare a variable firstLetter and assign it a value of the first letter of songTitle using bracket notation. 2. Declare a variable seventhLetter and assign it a value of the seventh letter of songTitle using bracket notation. 3. Declare a variable lastLetter and assign it a value of the last letter of lyrics using bracket notation and the .lengthproperty we learned in the last challenge. Solution 11: JavaScript utilizes a zero-based indexing system. Therefore, counting starts at 0 rather than 1, this is why in the first part of this challenge we set the variable firstLetter equal to songTitle[0] instead of songTitle[1]. The same goes for the variable seventhLetter, spaces included, to get the correct answer you would use songTitle[6]. For the last part, you need to obtain the last letter of the const lyrics. A quick way to determine how many indexes are in that string you can use the .length method to get the exact number printed in the console — 66, then just decrement that by 1 to compensate for the zero-based indexing system to place that inside the brackets. Numbers — Addition/SubtractionChallenge 12: Create a variable birthYear and set it equal to the year of your birth. Next, create a variable named age and set the value to your current age. Finally, create a variable named in10Yrs and set the value to equal your age plus 10. Solution 12: The number data-type does not need to be wrapped within quotations to execute. Numbers — Multiplication/DivisionChallenge 13: Perform the following multiplication/division operations in the code editor: 1. Multiply 20 by 4 and save the result to a variable called twentyTimesFour 2. Divide 9 by 3 and save the result to a variable called nineOverThree 3. Multiply 200.3 * 3 and save the result to a variable called twoHundredTimesThree Solution 13: Numbers — Exponents/RemaindersChallenge 14: Now we're gonna take the training wheels off a bit now. This time you're going to have to write your own tests! Utilize the space below line 8 to write any console.log statements that you'd like to use to test your answers. 1. Declare a constant fiveSquared and assign it the value of 5 to the power of 2 using the exponentiation operator. 2. Declare a constant eightCubed and assign it the value of 8 to the power of 3 using the exponentiation operator. 3. Declare a constant sevenToTheSixth and assign it the value of 7 to the power of 6 using the exponentiation operator. 4. Declare a constant eightyThreeModSix and assign it remainder of dividing 83 by 6. 5. Declare a constant sixtyModNine and assign it the remainder of dividing 60 by 9. Solution 14: Numbers — Incrementor/DecrementorChallenge 15: 1. Using the incrementor operator, increase the value of num1 by 1. 2. Using the decrementor operator, decrease the value of num2 by 1. Solution 15: Numbers — Assignment OperatorsChallenge 16: 1. Using the appropriate assignment operator, reassign the value of num1 to the current value plus 17. 2. Using the appropriate assignment operator, reassign the value of num2 to the current value minus 14. 3. Using the appropriate assignment operator, reassign the value of num3 to the current value times 11. 4. Using the appropriate assignment operator, reassign the value of num4 to the current value divided by 8. Utilize the console to test your code before you submit it! Solution 16: BooleansChallenge 17: 1. Below line 3, reassign the value of iHaveChanged to true. 2. Declare a variable iLoveCoding and assign it a boolean value of true. 3. Declare a variable codingIsTooHard and assign it the boolean value of false. Solution 17:
0 Comments
|