JavaScript Flashcards
What is SAML
Security Application Mark up Language
function calc() {
console.log("inside function")
}
calc()
calc() //hoist
function calc() {
console.log("inside function")
}
var calc = function() {
console.log("inside function")
};
calc()
calc()
var calc = function() {
console.log("inside function")
};
Assigning a function to a variable
function calc(){
console.log("inside function")
};
var anotherfn = calc; anotherfn();
Adding a return value with “return”
function calc(){
return "inside function";
};
var returned = calc(); console.log(returned);
Adding a return value with using a var
function calc(){
var stringVar "inside function";
return stringVar;
};
var returned = calc(); console.log(returned);
Passing data to a function
function calc(number1, number2){
return number1 + number2;
};
var returned = calc(10,8); console.log(returned);
Passing data to a function via a variable
function calc(number1, number2){
return number1 + number2;
};
var calculator = calc; console.log(calculator(15,2));
If statement “executed”
var condition = true;
if (condition){
console.log('Executed');
}else{
console.log('Not executed');
}
If statement “not executed”
var condition = false;
if (condition){
console.log('Executed');
}else{
console.log('Not executed');
}
Checking multiple conditions with else if
var condition = true; var anotherCondition = false;
if (condition){
console.log('Executed');
}else if (anotherCondition){
console.log('Still Executed');
}else (condition){
console.log('Not executed');
}
Casting “true” with 1 and “false” with 0
var condition = 0; var anotherCondition = 1;
if (condition){
console.log('executed');
}else if (anotherCondition){
console.log('still executed')
}else {
console.log('not executed');
}
=> returns "still executed"
“0” is explicitly true, even though only 1 == true and all other numbers are not treated the same as true.
Only 1 and 0 are booleans and the rest are treated as true (compared to 0). Negative values (i.e. -1) are also treated as true. Any text is interpreted/treated as true.
var condition = 0; var anotherCondition = 0;
if (condition){
console.log('executed');
}else if (anotherCondition){
console.log('still executed')
}else {
console.log('not executed');
}
console.log(2==true);
=> returns “still executed” , false
Null condition is treated as false to make sure that a certain number is set correctly.
var condition = null; var anotherCondition = 0;
if (condition){
console.log('executed');
}else if (anotherCondition){
console.log('still executed')
}else {
console.log('not executed');
}
console.log(2==true);
=> returns “not executed” , false
Switch statements vs. lots of “else if”. More convenient if we know the cases we need to solve for. It’s much more structured than reading lots of else if statements.
Also, without the break statements, you get all 3 values since it falls through. Once it finds it’s case, it continues to execute.
var luckyNumber = 8;
switch (luckyNumber){
case 1:
console.log('Is 1');
break;
case 8:
console.log('Is 8');
break;
default:
console.log('Default');
break;
}
vs.
var luckyNumber = 8;
if (luckyNumber ==1){
console.log('Is 1');
}else if (luckyNumber ==8){
console.log('Is 8')
}else {
console.log('Default')
}
For loop
- define a variable.
- follow by semicolon
- define parameters of how long it will run
- counter
for (var i=0; i < 5; i++){
console.log(i)
}
===> prints 0 through 4 (runs 5 times)
Nested For Loop
- We just j since i is already taken
- The inner loop is executed upon each iteration of the outer loop and before the inner loop isn’t finished, the outer loop won’t continue.
for (var i=0; i < 5; i++){
for (var j=0; j<2; j++)
console.log(i*j)
}For loop with an if condition
for (var i = 0; i < 5; i++){
if (i == 0){
console.log('1');
}
}
===> prints "1"for (var i = 0; i < 5; i++){
if (i == 1){
continue;
}
console.log(i);
}==> 0, 2,3,4
For loop with a conditional if statement and continue statement. This should tell JS that once it meets the condition in the if statement, it should continue executing the for loop
for (var i = 0; i < 5; i++){
if (i == 1){
break;
}
console.log(i);
}==> 0
for (var i = 0; i < 5; i++){
for (var j = 0; j < 2; j++){
if (i == 1){
continue;
}
}
console.log(i);
}==> 0,1,2,3,4
This continues statement is trigger if i is 1, which is the case. Upon the second iteration, will refer to this inner loop. So this inner loop will continue which doesn’t really matter because we weren’t executing code here anyways.
for (var i = 0; i < 5; i++){
for (var j = 0; j < 2; j++){
if (i == 1){
break;
}
console.log('inside inner loop, j = ' + j);
}
console.log(i);
}The break is only applied to the inner loop. Therefore, “continue and “break” only refers to the lop in which they are written and not to any other wrapping loop around them.
inside inner loop, j = 0 inside inner loop, j = 1 0 1 inside inner loop, j = 0 inside inner loop, j = 1 2 inside inner loop, j = 0 inside inner loop, j = 1 3 inside inner loop, j = 0 inside inner loop, j = 1 4
for (var i = 2; i > 1; i--){
console.log(i);
}==> 2
We only make 1 round because we start with 2, subtract 1 and we are at 1 so i > 1 is no longer satisfied.
for (var i = 4; i > 2; i--){
console.log(i);
}==> 4,3
It subtracts 4 until the condition of i > 2 is met. Here, 3 and 4 are greater than 2.
for (var i = 6; i > 2; i--){
console.log(i);
}==> 6,5,4,3
It substracts 6 until the condition of i > 6 is met. Here, 6, 5,4,3 is greater than 2.
array.length - how should we create a for loop that can loop through an array as long as i is smaller than the length of the array.
var array = [1,2,3];
for (var i = 0; i < array.length; i++){
console.log(array[i]);
}
note: we don't want it to be i <= because in this case, we would loop until i takes the value of 3 which actually tries to access the 4th element which is not the behavior we want.While loop with condition where you print a number less than 7, then increment until it’s 1 less than 7.
We use the wile loop to check a condition “while (condition) so we can check that a condition is no longer true.
var number = 5;
while (number < 7) {
console.log(number);
number ++;
}
Note: currently at 5, it prints number which is 5, then it increments to 6 which is smaller than 7 and I print 6, then it increments to 7, which is no longer smaller than 7, therefore we quite the loop
while with multiple conditions
var condition = true; var i = 2;
while (condition) {
if (i == 3) {
condition = false;
}
console.log(i);
i++
}
==> 2, 3
Note: 2 is the starting point and then we increment it to 3 which is when we set condition to false, but we are not instantly skipping out of the loop, we’re just setting condition to false. When we reach the next iteration, we again check the condition as it was set to false, now the loop is finished.
do-while loop: We’re still using this while condition but we specify that we want to execute this code anyways even if it starts out as false.
var condition = false;
do{
console.log(‘executed’);
}
while (condition);
==> “executed”
This is executed even when the condition is false, which is what this “do” keyword allows us to do.
Multiplication:
Javascript has issues with long floating numbers. We therefore try to fix it with .tofix method.
var a = 1.3; var b = 2.2;
console.log(a *b);
if ((a * b).toFixed(2) == 2.86) {
console.log(‘true’);
}else {
console.log(‘false’);
}
==>
2.8600000000000003
true
Note: we are fixing it and cutting off all the part we don’t want since it might be a source of hard to trace down bug.
var a = 2; var b = '2.2';
console.log(a *b);
==> 4.4
Javascript will try to cast (interpreting of numbers) a string to “figure out” what the intent of the operator is, as long as it can be casted to a number.
var a = 2; var b = 'join';
console.log(a *b);
==> NaN
“join” This is not possible to cast to a number.
var a = 2; var b = infinity;
console.log(a *b);
==> infinity
var a = 3.3; var b = 2.2;
console. log (a / b);
console. log((a / b).toFixed(3));
==>
- 4999999999999998
- 500
var a = 10; var b = 3;
console.log (a % b);
==> 1
Modulus returns the value that in the first non-decimal case.
var a = 10; var b = 0;
console.log (a / b);
==> Infinity
JS will show the limit value. when dividing by something extremely big
comparison operators
console.log(1 !== 2);
==> true
Checking for both value and types are not equal.
console.log(null == undefined);
==> true
NULL can’t be compared, except it can be compared to undefined.
Undefined is always false, except when comparing to null.
if (( 1 == 1) && (2 == 2)) {
console.log('true');
}else{
console.log('false');
}==> True
The boolean operator here tells JS both sides of this operator have to be true, or combine both results into one single result.
console.log((1 == 1) || (2 ==3 ) (4 == 5));
==> true
The Or operator will return true as long as any of the conditions we have here is true.
console.log((1 == 1) || (2 ==3 ) && (4 == 5));
==> true
console.log((1 == 1) && (2 ==3 ) || (4 == 5));
==> false
inversion with a variable
var isTrue = true; console.log(!isTrue);
==> false
true comes false and false becomes true. You want to do this to check for the opposite.
var a = 5; var b = 5;
console.log(a == b ? ‘Equals’ : ‘Not Equal’);
==> ‘equals’
ternary operator same as writing. First comes the check ‘a==b’, or “:” we execute the else case.
if (a == b){
console.log('Equals');
}else {
console.log('Not equal');
}
Primitive vs. Reference:
var aNumber = 5; console.log(aNumber); var anotherNumber = aNumber; console.log(anotherNumber); aNumber = 12; console.log(aNumber); console.log(anotherNumber);
==>
5, 5, 12,5.
Note: anotherNumber is still 5 even though number has changed after being assigned to anotherNumber. The reason for this is that a copy of the value is created and therefore anotherNumber has the value 5, and no reference to aNumber, therefore, it doesn’t care what I do with aNumber.
Primitive vs. Reference
var array = [1,2,3];
var anotherArray = array;
console.log(array);
console.log(anotherArray);
array. push(4);
console. log(array);
console. log(anotherArray);
==> [ 1, 2, 3 ] [ 1, 2, 3 ] [ 1, 2, 3, 4 ] [ 1, 2, 3, 4 ]
Note: Since objects are by reference and reference are references to pointers, so even though we didn’t change anotherArray, it still got changed. When we assign array to anotherArray, we copy that reference. When we push a new item on array, the value itself is changed. The 2 pointers aren’t changed, and therefore, both point to the new value with the additional 4.
var array = [1,2,3]; var anotherArray = array;
array = [‘a’, ‘b’];
console. log(array);
console. log(anotherArray);
==>
[ ‘a’, ‘b’ ]
[ 1, 2, 3 ]
Note: We are creating another array so it print out the old and new value. With array.push, we were editing an existing object so both pointers to the identical pointer were therefore updated.
Scope:
var test = 'Global test'; var test = 'Test';
function localScope() {
var test = 'Local Scope';
console.log(test);
}
localScope();
console.log(test);
==> local scope. global scope
the function has it’s own scope and therefore, it’s own registry.
function localScope() {
var test = 'Local Scope';
console.log(test);
}
localScope();
console.log(test);==> localscope
==> reference error, since it can’t access the local function.
function localScope() {
test = 'Local Scope';
console.log(test);
}
localScope();
console.log(test);In non-strict mode:
local scope
local scope
note: If you try to use a variable which hasn’t been declared before, such variable have global scope. Therefore, use strict mode or remember to put var in front of the variable name.
var array = [1,2,3];
console. log(1);
console. log(array.length);
==> 1, 3
var array = [1,2,3];
console.log(1);
array[1] = 100;
console.log(array);
==>
1, [1,100,3]
var array = [1,2,3]; array[5] = 100; console.log(array);
==> [1,2,3,undefined, undefined, 100]
var array = [1,2,3];
array.forEach(function(element){
console.log(element);
});
Explain
I use the forEach method and inside that method, I use an anomalous function and call out the ‘element’ of the array.
In general, this is something we’ll often see if we have a method which expects a function as an argument, like this method does, that don’t create a new function and then pass a reference to that–so instead, you create this function on the fly –and you don’t need a name because you are only passing it for this argument –and not using it anywhere else. The function takes an argument ‘element’ and we can name it anything.
So this forEach function expects an argument of type function, which in turn takes an argument and the name. You can then log element. “forEach, it only takes 1 element at a time of the array.
push
var array = [1,2,3,,];
array. push(4);
console. log(array);
==> pushes the argument into the last position.
pop
var array = [1,2,3,4];
array. pop();
console. log(array);
==> [1,2,3]
