Javascript Fundamentals I
What Is Javascript?
A dynamically typed, object oriented programming language used to create interactive web pages and web applications.
**Fun fact: Can sometimes be used in the backend.
What is the DOM
Document object model
Acts as the bridge between HTML and Javascript
Provides functions to effectively add, remove, and modify parts of the document.
function number(n) {
var add = 5;
return;
n + add;
}
console.log(number(10));
return is being used in the wrong place here and due to this, the functions output is undefined.
Corrected version:
function number(n) {
var add = 5;
n + add;
return n
}
console.log(number(10));
console.log(1 + "2" + "2");
console.log(1 + +"2" + "2");
console.log(1 + -"1" + "2");
console.log(+"1" + "1" + "2");
console.log( "A" - "B" + "2");
console.log( "A" - "B" + 2);
console.log(1 + "2" + "2"); // "122"
console.log(1 + +"2" + "2"); // "32"
console.log(1 + -"1" + "2"); // "02"
console.log(+"1" + "1" + "2"); // "112"
console.log( "A" - "B" + "2"); // "NaN2"
console.log( "A" - "B" + 2); // NaN
Describe the functionality of the If, Else statement
If Else statement allows us to test a condition and run a piece of code based on if the condition passes or not.
Name some ES6 Features
Let, Const, Promises, Destructuring, Modules, Template Literals, Classes, arrow functions, plus many more.
What Is a Promise?
Promises are an object that lets us handle the return of the success and failure of an asynchronous request.
It takes a callback method that has "resolve" and "reject" arguments that we use to help decide what happens to a promise after its returned.
We use .then() to handle those returns and .catch() to handle the errors or failures of the request.
When this code runs on the browser, its developer console shows an error. It shows an error because the called function, i.e., SpeakNow(), has not been defined in the JavaScript code.
var trees = ["pine","apple","oak","maple","cherry"];
delete trees[3];
console.log(trees.length);
The output would be 5. When we use the delete operator to delete an array element, it doesn't unset the element in that position of the array, but it sets it to undefined instead. So the array length is not affected by the delete operation. This would hold true even if you deleted all elements of an array using the delete operator.
What is JSON?
JSON is the string representation of an object that is used to communicate to our back ends.
What are some pros and cons of javascript?
Pros: Widely used. Richer User Interfaces. Fast performance. Very frequently updated
Cons: Loosely types. Security Leaks. Single Threaded
Explain the event loop!
**Bonus: Explain the individual parts of the event loop
The eventloop TLDR, is javascripts way of handling asynchronous functionality.
Callstack: functions get pushed to the callstack when they're invoked and popped off when they return a value
Web API: The web API takes care of those callbacks that we pass to it
Event Queue: Handles the execution of the functions that were passed into the callback queue
if((x > y) && (y < 77) {
//more code here
}
In the first line of code, the last parenthesis of the conditional statement is missing.
if ((x > y) && (y < 77)) {
//more code here
}
console.log(1 < 2 < 3);
console.log(3 > 2 > 1);
The first statement returns true which is as expected.
The second returns false because of how the engine works regarding operator associativity for < and >. It compares left to right, so 3 > 2 > 1 JavaScript translates to true > 1. true has value 1, so it then compares 1 > 1, which is false.
what is the "this" keyword
the this keyword will point to the object thats in its scope, otherwise it points to the global window object
Null is a placeholder value representing "nothing".
Undefined is a variable that has not been assigned a value
Name all of the HTTP methods and what they do!
**Bonus: there are two methods that modify, explain why we limit our usage of one of them.
GET: Gets data from database
POST: Posts new record to database
PUT: Updates the database
PATCH: Updates a single record
DELETE: Deletes a record from the database
**Bonus: PUT can modify the entire database if not used properly which is why its usage is very limited
let myPromise = promise((resolve, reject) =>{
resolve( "do something if success")
reject("do something if fails")
})
.then()
.catch()
in order for this function to work, this function requires the "new" keyword, and promise should be "Promise"
let myPromise = new Promise((resolve, reject) =>{
resolve( "do something if success")
reject("do something if fails")
})
.then()
.catch()
Imagine you have this code:
var a = [1, 2, 3]
A: Will this result in a crash?
a[10] = 99
B: What will this output?
console.log(a[6])
a) It will not crash. The JavaScript engine will make array slots 3 through 9 be “empty slots.”
b) Here, a[6] will output undefined, but the slot still remains empty rather than filled with undefined. This may be an important nuance in some cases. For example, when using map(), empty slots will remain empty in map()’s output, but undefined slots will be remapped using the function passed to it:
What is a class?
Classes on the basic level, are blueprints to create objects.
Name a few Operators and EXAMPLES of them!
Assignment Operator: =
Comparison Operator: <, >, <=, >=, ==, ===
Arithmetic Operators: +,-,*, /,%
Logical Operators: &&, ||, !
How do we get the value from an input field
document.getElementById()
then select the input field you want in the parenthesis and then add the .value to the end.
EX:
document.getElementById("inputName").value
let car = {
make: "dodge",
model: "challenger",
year: 2023
}
car.color = blue;
car.mileage = 12000
console.log(car)
the color in this case is being passed as a variable, so this results in a reference error due to blue not being defined.
Simply put, blue is missing quotations to make it a proper value. Simple mistake, that breaks the code.
var x = 21;
var girl = function () {
console.log(x);
var x = 20; };
girl ();
Neither 21, nor 20, the result is undefined
It’s because JavaScript initialization is not hoisted.
(Why doesn’t it show the global value of 21? The reason is that when the function is executed, it checks that there’s a local x variable present but doesn’t yet declare it, so it won’t look for global one.)
What are the different ways to create an object? Explain the differences and use cases of each!
Object Literals
Using a constructor function
Object.Create