Basic JavaScript Knowledge
var x = 5;
var y = 6;
var z = x + y;
z
let text = "Mort";
text
let text2 = 'Yeung';
text2
let number = 1234567890123456789012345n;
let Largenum = BigInt(1234567890123456789012345)
let typeLargenum = typeof Largenum;
typeLargenum
Largenum
Boolean(10 > 9)
Write a boolean statement that outputs true
let name;
name
grade = undefined;
let result;
result = Boolean(undefined);
console.log(result); // false
result = Boolean(null);
console.log(result); // false
7. Symbol: used to represent unique values that can be used as identifiers/keys in objects.
- They are also used to create private properties and methods in classes.
- unique and immutable, so they can be used as unique identifiers in objects and classes.
- useful for creating constants that can be shared across different parts of your code.
// Create a Symbol
const mySymbol = Symbol();
console.log(mySymbol);
// expected output: Symbol()
const myObject = {
[mySymbol]: 'Hello World'
};
console.log(myObject[mySymbol]);
Edit/add to the code above so that it outputs "Hello World"
Object
- Identify the name/keys in the object below: name, breed, color, age
- Identify the values in the object below: Elly, Rottweiler, black, 4
const dogs = {name: "Elly", breed:"Rottweiler", age:4, color:"black"}
dogs
Array
const songs = ["Love Story", "Blank Space", "I Knew You Were Trouble"];
songs
const cost1 = 2;
const cost2 = 11;
let totalCost = cost1 + cost2;
totalCost
Conditionals: control behavior, decides whether or not pieces of code can run.
- If: if a condition is true it is used to specify execution for a block of code.
- Else: if the same condition is false it specifies the execution for a block of code.
- Else If: new test if the first condition is false.
if (10 > 5) {
var outcome = "True";
}
outcome;
if ("red" === "blue") {
var outcome = "if block";
} else {
var outcome = "else block";
}
outcome;
let temperature = 54
if (temperature < 70) {
cast = "Chilly";
} else if (temperature < 60) {
cast = "Cold";
} else {
cast = "Warm";
}
cast
Create a conditional statement about how you would greet someone based on the time of day.
let currentTime = 5
if (currentTime < 70) {
greeting = "Good morning!";
} else if (temperature < 60) {
greeting = "Good afternoon!";
} else {
greeting = "Good evening!";
}
greeting
Iteration:
- for loop: repeats until a specified condition evaluates to false
- do...while: repeats until a specified condition evaluates to false
- while statement: executes its statements as long as a specified condition evaluates to true
- label: provides a statement with an identifier that lets you refer to it later in the code. ex. you can use a label to identify a loop, and then use the break or continue statements to indicate whether a program should interrupt the loop or continue its execution
- break: used to terminate a loop, switch, or in conjunction with a labeled statement
- continue: can be used to restart a while, do-while, for, or label statement
- for...in: iterates a specified variable over all the enumerable properties of an object
- for...of statement creates a loop Iterating over iterable objects, invoking a custom iteration hook with statements to be executed for the value of each distinct property
JavaScript in HTML- Questions
- Where do you store the JavaScript Code?
- I store Javascript code in .js file
- How do you import a JS file into HTML?
- < script src="name.js"></ script>
- What is onClick?
- onClick describes a function in which a click happens, some action occurs
- What tag do you use to write JavaScript code?
- use < script > tag
Javascript Hangman Game
(Link)[https://jonathanwuz.github.io/LeuckACheuck/]
- This is a hangman Javascript game code through html and javascript. The Submit button is colorful and is apart of the SASS hacks.
JS Code:
<script>
// Initialize variables
var words = ["apple", "banana", "cherry", "date", "elderberry", "fig", "grape", "honeydew", "indian gooseberry", "jackfruit", "kiwi", "lemon", "mango", "nectarine", "orange", "peach", "quince", "raspberry", "strawberry", "tangerine", "ugli fruit", "vanilla", "watermelon", "xylocarp", "yellow watermelon", "zucchini"];
var wordToGuess = words[Math.floor(Math.random() * words.length)];
var incorrectGuesses = [];
var gameStatus = "";
var guessInput = document.getElementById("guess-input");
var wordToGuessDisplay = document.getElementById("word-to-guess");
var incorrectGuessesDisplay = document.getElementById("incorrect-guesses");
var gameStatusDisplay = document.getElementById("game-status");
// Initialize the word to guess display
var wordToGuessArray = [];
for (var i = 0; i < wordToGuess.length; i++) {
wordToGuessArray.push("_");
}
wordToGuessDisplay.innerHTML = wordToGuessArray.join(" ");
// Function to handle a guess
function guessLetter() {
var guess = guessInput.value.toLowerCase();
if (guess.length === 1 && guess.match(/[a-z]/i)) {
if (wordToGuess.includes(guess)) {
for (var i = 0; i < wordToGuess.length; i++) {
if (wordToGuess[i] === guess) {
wordToGuessArray[i] = guess;
}
}
wordToGuessDisplay.innerHTML = wordToGuessArray.join(" ");
} else {
incorrectGuesses.push(guess);
incorrectGuessesDisplay.innerHTML = incorrectGuesses.join(" ");
}
guessInput.value = "";
}
if (wordToGuessArray.indexOf("_") === -1) {
gameStatus = "You win!";
} else if (incorrectGuesses.length === 6) {
gameStatus = "You lose!";
}
gameStatusDisplay.innerHTML = gameStatus;
}
</script>