Revising JavaScript.
When JavaScript variables are declared,
they have an initial value of undefined.
var locaal;
console.log(locaal);
// output: undefined
/* If you do a mathematical operation on an undefined
variable your result will be NaN which means "Not a Number".
*/
let str2;
let locaal = 44;
console.log(locaal+ str2);
// output: NaN
/*
If you concatenate a string with an undefined variable,
you will get a literal string of undefined.
*/
let str2;
let str = "This is a string ";
// str += undefined;
console.log(str + str2);
// output: This is a string undefined
Explore Differences Between the var and let Keywords
Keyword var
/*
One of the biggest problems with declaring variables with
the var keyword is that you can easily overwrite variable declarations:
In a small application, you might not run into this type of problem.
But as your codebase becomes larger,
you might accidentally
overwrite a variable that you did not intend to.
Because this behavior does not throw an error,
searching for and fixing bugs becomes more difficult.
*/
var myName = "Unknown";
var myName = "Anonymous";
console.log(myName);
// output: Anonymous
Keyword let
/*
A keyword called let was introduced in ES6, a major update to
JavaScript, to solve this potential issue with the var keyword.
So when you use
let, a variable with the same name can only be declared once.
*/
let yourLife = "Dark Side";
let yourLife = "Living";
console.log(yourLife);
// Error Output: Identifier 'yourLife' has already been declared.
Declare a Read-Only Variable with the const Keyword
/*
In ES6, you can also declare variables using the const keyword.
const has all the awesome features that let has,
with the added bonus that variables declared using const are read-only.
They are a constant value, which means that once a variable is assigned
with const, it cannot be reassigned:
The console will display an error due to reassigning the value.
You should always name variables you don't want to reassign using
the const keyword. This helps when you accidentally attempt to reassign
a variable that is meant to stay constant.
*/
const under_Trouble = "Not matter";
under_Trouble = "Never matter";
console.log(under_Trouble);
//Error output: Assignment to constant variable.
Compound Assignment With Augmented Division/ Addition/Subtraction/Multi.
(-=, += ,*=, /=)
// let num = 10;
// num = num -4;
// console.log(num);
// Compound Assignment With Augmented Subtraction.
let num = 10;
num -= 4;
console.log(num);
// let number = 15;
// number = number + 5;
// console.log(number);
// Compound Assignment With Augmented Addition.
let number = 15;
number += 5;
console.log(number);
// let mult = 10;
// mult = mult * 5;
// console.log(mult);
// Compound Assignment With Augmented Multiplication.
let mult = 10;
mult *= 5;
console.log(mult);
// let divv = 90;
// divv = 90 / 9;
// console.log(divv);
// Compound Assignment With Augmented Division.
let divv = 90;
divv /= 9;
console.log(divv);
Escaping Literal Quotes in Strings
/*
What happens when you need a literal quote: " or ' inside of your string?
In JavaScript, you can escape a quote from considering
it as an end of string quote by placing a backslash (\) in front of the quote.
The backslash \ should not be confused with the forward slash /.
They do not do the same thing.
*/
let str = "Hey dear! How are you? and \"where are you going\"."
console.log(str);
// output: Hey dear! How are you? and "where are you going".
\'s
let code = "Let\'s do the code.";
console.log(code);
// output: Let's do the code.
const badStr = 'Finn responds, "Let's go!"';
console.log(badStr);
// output: SyntaxError: Unexpected identifier
const badStr = 'Finn responds, "Let\'s go!"';
console.log(badStr);
// output: Finn responds, "Let's go!"
Escape Sequences in Strings
\' single quote
/*
Quotes are not the only characters that can be escaped inside a string.
There are two reasons to use escaping characters:
To allow you to use characters you may not otherwise be able to type out,
such as a carriage return.
To allow you to represent multiple quotes in a string without
JavaScript misinterpreting what you mean.
*/
let str = 'This is escape sequence\'s string in javaScript.'
console.log(str);
output:
This is escape sequence's string in javaScript.
\" Double quote
let str = "This is escape sequence\"s string in javaScript."
console.log(str);
output:
This is escape sequence"s string in javaScript.
\\ backslash
let str = "This is escape sequence \\ backslash string in javaScript."
console.log(str);
output:
This is escape sequence \ backslash string in javaScript.
\n newline
let str = "This is escape sequence \n New Line string in javaScript."
console.log(str);
This is escape sequence
New Line string in javaScript.
\t tab
let str = "This is escape sequence \t Tab string in javaScript."
console.log(str);
output:
This is escape sequence Tab string in javaScript.
\b word boundary
.png)
\f form feed
.png)
.png)
Concatenating Strings with Plus Operator
/*
In JavaScript, when the + operator is used with a String value,
it is called the concatenation operator.
You can build a new string out of other strings by concatenating them together.
Watch out for spaces. Concatenation does not add spaces between concatenated
strings, so you'll need to add them yourself.
*/
let concatt = "Life free " + "Or Die Hard";
console.log(concatt);
output:
Life free Or Die Hard
Appending Variables to Strings
/*
Just as we can build a string over multiple lines out of string literals,
we can also append variables to a string using the plus equals (+=) operator.
*/
let concatStr = "I want a job system.";
concatStr += " Hey system can you hear me."
console.log(concatStr);
output:
I want a job system. Hey system can you hear me.
Find the Length of a String
You can find the length of a String value by writing .length after the string
variable or string literal.
*/
let findLength = "This is a javaScript string.";
console.log(findLength.length);
// let str = findLength.length;
// console.log(str);
output:
28
Understand String Immutability
/*
Keep in mind javaScript is case sensetive.
In JavaScript, String values are immutable, which means that they cannot
be altered once created.
*/
let myStr = "string";
myStr[0] = "S";
console.log(myStr);
output:
string
/*
this does not mean that myStr cannot be changed,
just that the individual characters of a string literal cannot be changed.
The only way to change myStr would be to assign it with a new string, like this:
*/
let myStr = "string";
myStr = "String";
console.log(myStr);
output:
String
Use Bracket Notation to Find the Last Character in a String.
/*
In order to get the last letter of a string,
you can subtract one from the string's length.
lastLetter would have a value of the string r.
*/
let loose = "am i Losser";
console.log(loose[loose.length-1]);
output: r
// let notLosser = loose[loose.length-1];
// console.log(notLosser);s
Use Bracket Notation to Find the Nth-to-Last Character in a String
/*
You can use the same principle we just used to retrieve the last character
in a string to retrieve the Nth-to-last character.
you can get the value of the third-to-last letter of the const str.
thirdToLastLetter would have a value of the string v.
*/
let str = "Hey system am i live?";
console.log(str[str.length-3]);
output: v
// const str2 = str[str.length - 3];
// console.log(str2);
Word Blanks
let word = "This is " + "called " + "word " + "Blank. "+ "I think"+ "."
console.log(word);
output:
This is called word Blank. I think.
const myNoun = "dog";
const myAdjective = "big";
const myVerb = "ran";
const myAdverb = "quickly";
const wordBlanks = myNoun +" " + myAdjective +" " + myVerb +" " + myAdverb;
console.log(wordBlanks);
output:
dog big ran quickly
Nest one Array within Another Array
/*
You can also nest arrays within other arrays, like below:
This is also called a multi-dimensional array.
*/
const nestArr = [["Hello", "JavaScript"], ["Nested","Array",555],true];
console.log(nestArr);
output:
[ [ 'Hello', 'JavaScript' ], [ 'Nested', 'Array', 555 ], true ]
Access Array Data with Indexes
/*
Access Array Data with Indexes
We can access the data inside arrays using indexes.
Array indexes are written in the same bracket notation that strings use,
except that instead of specifying a character, they are specifying an entry in the array.
Like strings, arrays use zero-based indexing,
so the first element in an array has an index of 0.
*/
const array = [50,60,70];
const data = array[1];
console.log(array[0]);
console.log(data);
array[0] is now 50, and data has the value 60. 50
60
Modify Array Data With Indexes
/*
Unlike strings, the entries of arrays are mutable and can be changed freely,
even if the array was declared with const.
ourArray now has the value [ 'Keep pushing', 'Legend', 'Die Hard' ]
*/
const arr = ["Cleaner","Pressure no matter","Die Hard"];
arr[1]="Legend";
// console.log(arr);
const arr2 = arr[0] = "Keep pushing";
console.log(arr);
output:
[ 'Keep pushing', 'Legend', 'Die Hard' ]
Access Multi-Dimensional Arrays With Indexes
/*
One way to think of a multi-dimensional array, is as an array of arrays.
When you use brackets to access your array,
the first set of brackets refers to the entries in the outer-most (the first level) array,
and each additional pair of brackets refers to the next level of entries inside.
*/
const mulArray = [
['Russia','war','with','ukraine'],
["Mom","Dad","Sister","Brother"],
[55650,576,4654,2456],
["Need","a","Job","Emergency","Basis","whatToDo"]
]
console.log(mulArray[0]);
console.log(mulArray[0][1]);
console.log(mulArray[1]);
console.log(mulArray[1][3]);
console.log(mulArray[1][3][1]);
console.log(mulArray[2]);
console.log(mulArray[2][3]);
console.log(mulArray[3]);
console.log(mulArray[3][3]);
console.log(mulArray[3][4]);
output:
[ 'Russia', 'war', 'with', 'ukraine' ]
war
[ 'Mom', 'Dad', 'Sister', 'Brother' ]
Brother
r
[ 55650, 576, 4654, 2456 ]
2456
[ 'Need', 'a', 'Job', 'Emergency', 'Basis', 'whatToDo' ]
Emergency
Basis
// Multidimensional array another example.
const myArr = [
[1,2,3],
[4,5,6],
[7,8,9],
[[10,11,12],13,14]
];
// console.log(myArr[0]);
// console.log(myArr[3][2]);
// console.log(myArr[3][0]);
console.log(myArr[3][0][2]);
// output:
// 12
Manipulate Arrays With push()
/*
Manipulate Arrays With push()
An easy way to append data to the end of an array is via
the push() function.
.push() takes one or more parameters and "pushes" them
onto the end of the array.
*/
const myArr = ["Logo","code",true,false,"Number",434];
myArr.push("Car");
// console.log(myArr);
myArr.push(["multiDimensionalArray","pushing"]);
console.log(myArr);
output:
[
'Logo',
'code',
true,
false,
'Number',
434,
'Car',
[ 'multiDimensionalArray', 'pushing' ]
]
const mArray = [["hello","friends"],["Hello","world"]];
mArray.push(["Keep","codding"]);
console.log(mArray);
output:
[ [ 'hello', 'friends' ], [ 'Hello', 'world' ], [ 'Keep', 'codding' ] ]
Manipulate Arrays With shift()
/*
pop() always removes the last element of an array.
What if you want to remove the first?
That's where .shift() comes in. It works just like .pop(),
except it removes the first element instead of the last.
*/
const carArray = ["Lamborghini","Audi","Hurakon", "BMW","Ferrari"];
carArray.shift();
console.log(carArray);
.shift() removed 1st element from the Array.
output:
[ 'Audi', 'Hurakon', 'BMW', 'Ferrari' ]
const myArray = [["John", 23], ["dog", 3]];
const removedFromMyArray = myArray.shift();
console.log(myArray);
console.log(removedFromMyArray);
output:
[ [ 'dog', 3 ] ]
[ 'John', 23 ] // this is removed element show by shift().
Manipulate Arrays With pop()
/*
.pop() removes the last element from an array and
returns that element.
Any type of entry can be popped off of an array -
numbers, strings, even nested arrays.
*/
const popArray = ["This","Pop","function","Removed","LastElement","FromArray"];
popArray.pop();
console.log(popArray);
console.log(popArray.pop()) // it return removed element only.
output:
[ 'This', 'Pop', 'function', 'Removed', 'LastElement' ]
const myArray = [["John", 23], ["cat", 2],["code","more"]];
const removedFromMyArray = myArray.pop();
console.log(removedFromMyArray);
console.log(myArray);
output:
[ 'code', 'more' ]
[ [ 'John', 23 ], [ 'cat', 2 ] ]
Manipulate Arrays With unshift()
/*
Not only can you shift elements off of the beginning of an array,
you can also unshift elements to the beginning of an array
i.e.
add elements in front of the array.
.unshift() works exactly like .push(), but instead of adding
the element at the end of the array, unshift() adds the element
at the beginning of the array.
*/
const unshifArray = [99,"Hongkong",true,"talking"];
unshifArray.shift();
unshifArray.unshift("Barcelona");
console.log(unshifArray);
output:
[ 'Barcelona', 'Hongkong', true, 'talking' ]
const unshifArray = [99,"Hongkong",true,"talking"];
unshifArray.unshift("Barcelona");
console.log(unshifArray);
output:
[ 'Barcelona', 99, 'Hongkong', true, 'talking' ]
Add ["Paul", 35] to the beginning of the myArray variable using unshift().
const myArray = [["John", 23], ["dog", 3]];
myArray.shift();
myArray.unshift(["Paul",35]);
const myArray = [["John",23],["Dog",3]];
myArray.unshift(["paul",35]);
console.log(myArray);
output:
[ [ 'paul', 35 ], [ 'John', 23 ], [ 'Dog', 3 ] ]
Create a Shopping List using Array.
/*
Shopping List
Create a shopping list in the variable myList. The list should
be a multi-dimensional array containing several sub-arrays.
The first element in each sub-array should contain a string with
the name of the item. The second element should be a number
representing the quantity i.e.
["Chocolate Bar", 15]
There should be at least 5 sub-arrays in the list.
*/
const myList = [
["Chocolate", 33],
["Banana", 10],
["Graps",120],
["Orange", 20],
["Mango", 30],
]
console.log(myList);
Passing Values to Functions with Arguments
/*
Parameters are variables that act as placeholders for the values
that are to be input to a function when it is called.
When a function is defined, it is typically defined along with
one or more parameters. The actual values that are input
(or "passed") into a function when it is called are known
as arguments
*/
function funName(num, num2){
return num + num2;
}
const var1 = funName("Hello ","world");
console.log(var1);
output:
Hello world
function functionWithArgs(arg, arg1){
let num = arg + arg1;
console.log(num);
}
functionWithArgs(32,55);
Return a Value from a Function with Return
/*
We can pass values into a function with arguments.
You can use a return statement to send a value back out of a function.
*/
function funRe(num){
return num + 5;
}
console.log(funRe(5));
output: 10
function funSub(sub){
return sub - 2;
}
let aa = funSub(40);
console.log(aa);
output: 38