Variable (Global & Local) - Variables are a name or symbol that stores values like a string or integer or float that can be changed throughout the program. (var x = 10;, var month = "December";) Global variables are variables that can be used through all the program (except inside functions) while local variables are variables declared inside specific parts of a program that cannot be used outside of the specific part. Generally, you want your variables to be global to avoid any confusion. Variables need to be "declared" before you are able to use them.
Conditional Statements - Conditional statements are statements that handle decisions using a Boolean expression as its condition. Conditional statements will perform different computations or actions based on if the Boolean condition is evaluated as true or false. For example a conditional statement could be if (apples == 10) { console.log("You have exactly 10 apples");} else {console.log("You don't have 10 apples");}. If the variable apples is equal to 10, then the boolean would be true and the console would log the "You have exactly 10 apples" but if you had the variable apples at 3 it would evaluate as false and the console would log "You don't have 10 apples" because that is what the conditional would do when the boolean is false.
Functions - Functions are similar to variables where they store things, however, functions are operations able to take an input, run the code inside the function, and output something or perform a certain action. Functions store code and allow it to be repeatedly used. Functions help shorten code by allowing repeated segments of code to be compressed into one function. Functions need to be first defined and then declared later in the program. For example, a common use case that we used while coding was to create a updateScreen() function that would run code to update the information displayed to the user. Instead of having to write the code after every action that occurs, we could just call the function and update the screen.
Boolean Expressions - Boolean expressions are logical statements that either evaluate as TRUE or FALSE. For example, the boolean expressions 5 > 3 would evaluate as TRUE but the boolean 3 > 5 would evaluate as false.
Concatenation - Concatenation merges values such as variables, expressions, or strings together. For example, if we define var temperature = 24; and run the line of code console.log("The temperature outside is " + temperature + " degrees Celcius"); concatenation automatically joins together the values and logs the string "The temperature outside is 24 degrees Celcius". Concatenation helps us join values together.
Photo Liker Reflection -
a
b
c. The data contained in the comments variable is the content of the comment display box in the program. The purpose of the program is to receive a user input for a comment and display it in the comment display box. The comments variable holds all the previous comments, starting with the default comment as well as all additional comments that the user inputs by using concatenation to merge the comment strings together. The variable can then be displayed or changed when needed.
d. The comments variable makes it much simpler to store and display the information as once any new comments are inputted, the comments variable can just be displayed in the comments display box. Without the comments variable, each new message would have to be individually stored in a separate variable and then all displayed. I would have had to create multiple variables at the beginning of the program, assign the newest comment to a variable, then combine the variables, and finally display the combined variabls. This would have to be repeated for every new comment. The comments variables removes a lot of complexity from the program by allowing all comments to be stored and interacted with in a single variable, instead of having to use multiple variables when we want to modify or display all the comments.
Musem Ticket Generator
a ^
b. The first conditional statement is testing if the inputDay, or user input for the day is either the string Saturday or Sunday, as if that is the case, then the ticket rice must be 10 dollars no matter what, so the ticketPrice variable is set to 10. If the first statement is false, we then test if the inputDay is the string Friday and that the inputCode, which is the discount code the user can input is also the string FREEFRIDAY. If both of these are true, the ticketPrice is set to 0 as having the day be Friday, as well as the discount code, makes the ticket free. If this is also false, we then check if the inputAge, or age that the user inputed is less than or equal to 18. If this is true, then the price of the ticket is 5 dollars and we set the ticketPrice variable to 5. Finally, if all of the conditionals are false, the ticketPrice is set to 10 as that is the price for anyone over 18, not on weekends, and not having the day be Friday with the discount code.
c. Input 1: inputAge = 17 inputDay = "Monday" inputCode = ""
Obviously these values are first pulled using a getText or getNumber command from the input displays. The values then go through the conditional to figure out the ticketPrice. Since the inputDay isn't Saturday or Sunday, that conditional is false, so we move on to the next conditional. Since the day isn't Friday either and the inputCode is empty, this next conditional is also false. However, the next conditional we see is true, as the inputAge of 17 is in fact less than 18, so the ticketPrice is set to 5. Finally, these values are put into the last line of code which combines all the values through concatenation to output and display
Day: Monday
Age: 17
Price: $5
Input 2 inputAge = 36 inputDay = "Friday" inputCode = "FREEFRIDAY"
Obviously these values are first pulled using a getText or getNumber command from the input displays. The values then go through the conditional to figure out the ticketPrice. Since the inputDay isn't Saturday or Sunday, that conditional is false, so we move on to the next conditional. However, this time, we find that the inputDay is in fact Friday and the inputCode FREEFRIDAY is the correct code, so the ticketPrice is set to 0. Finally, these values are put into the last line of code which combines all the values through concatenation to output and display
Day: Friday
Age = 36
Price = $0
Quote Maker Reflection
The role of the update screen function is to update all of the parameters in the display. After any action or change has occured, the updateScreen() function is ran, which allows us to update any of the parameters that can be changed, such as the input text for the user, the font size, the font family, and the backround color. It also allows us to update the user feeback that the code gives. It sort of functions like the refresh button in your browser, which checks if anything new has changed, and if it has, updates it on the screen.
The first thing we do is use the setText command to change the text in the quoteOutput display. This makes sure if the user added a new quote that the quote would be updated. Then we can use the setProperty command on the quoteOutput to adjust the font-size and font-family. This will change the quoteOutput text to the disired size or font family that the user wants. We then use the setProperty commands on the colorOutput display and change the backround-color to the color the user inputs. Finally, we want to check to see if the feeback changes, which occrs when the backround color/ color the user inputted is light green and the size of the text or the size that the user inputted is 20. By using a conditional, we can check if both these conditions are true, and if they are, we can use the setText command to set the feedbackOutput display to show the text "Looking fresh!", otherwise, any other parameters would result in the feedback, "Nice Design!". After any changes are made to any of the user inputs, we want to run the updateScreen() function to update the program display/screen.