Skip to content

Commit eed2f20

Browse files
Aman0509Aman0509
committed
Added Basics Dir
1 parent 8e62be8 commit eed2f20

File tree

2 files changed

+173
-0
lines changed

2 files changed

+173
-0
lines changed

‎Basics/JS_Basics.js‎

Lines changed: 144 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,144 @@
1+
'use strict';
2+
/*
3+
Strict mode in JS eliminates some JS silent errors
4+
*/
5+
6+
// Variable Definition
7+
8+
var temp1 = 'Hello1';
9+
let temp2 = 'Hello2';
10+
const temp3 = 'Hello3';
11+
// temp4 = 'Hello4'; This is not allowed in strict mode
12+
13+
// Valid identifiers
14+
let $ = 'Yo';
15+
let _ = 'Mama';
16+
17+
// Cannot use reserved keywords as Variable Name
18+
19+
// This is allowed although previously it holds string
20+
// temp3 = 478;
21+
22+
/* Primitive Data types
23+
- Number
24+
- BigInt
25+
- String
26+
- Boolean
27+
- Null
28+
- Nan
29+
- Undefined
30+
- Symbol
31+
32+
Object Data types
33+
*/
34+
35+
// Object Data types
36+
const obj1 = {
37+
'a': 1,
38+
'b': 2,
39+
'c': true,
40+
};
41+
console.log(`1 - ${obj1}`)
42+
/*
43+
Type Of
44+
As an operator - typeof <object>
45+
As a function - typeof(object)
46+
*/
47+
48+
console.log(`2 - `, typeof(null)); // object
49+
//It's a mistake recognized officially but didn't rectify for compatibility purpose
50+
51+
/*
52+
Basic Operators
53+
- Assignment Operators
54+
- Arithmetic Operators
55+
- Comparison Operators
56+
- Logical Operators
57+
- Bitwise Operators
58+
- String Operators
59+
- Other Operators
60+
*/
61+
62+
// Template Literals
63+
console.log(`3 - ${temp1}, How are you ${$} ${_}`);
64+
65+
// Implicit Conversion to String
66+
console.log(`34 +'45' = ${34+'45'}`); // 3445
67+
console.log(`'43' + true = ${'43'+true}`); //43true
68+
console.log(`'43' + undefined = ${'43'+undefined}`); //43undefined
69+
console.log(`'43' + null = ${'43'+null}`); //43null
70+
console.log(`'43' + nan = ${'43'+NaN}`); //43NaN
71+
console.log(`'5' + 'hey' = ${'5'+'hey'}`); //5hey
72+
73+
// Implicit Conversion to number
74+
console.log(`'69' - '34' = ${'69'-'34'}`); //35
75+
console.log(`34 - '45' = ${34-'45'}`); // -11
76+
console.log(`34 * '3' = ${34*'3'}`); // 102
77+
console.log(`34/'17' = ${34/'17'}`); // 2
78+
79+
// Non-numeric results to NaN
80+
console.log(`'5' - 'hey' = ${'5'-'hey'}`); //NaN
81+
console.log(`'5' * 'hey' = ${'5'*'hey'}`); //NaN
82+
console.log(`'5' / 'hey' = ${'5'/'hey'}`); //NaN
83+
84+
// null is 0 when used with numbers
85+
console.log(`56 + null = ${56+null}`); //56
86+
console.log(`56 - null = ${56-null}`); //56
87+
console.log(`56 * null = ${56*null}`); //0
88+
89+
// Arithmetic operation with number, boolean or null give NaN
90+
console.log(`4 + undefined = ${4+undefined}`); //NaN
91+
console.log(`4 - undefined = ${4-undefined}`); //NaN
92+
console.log(`true + undefined = ${true+undefined}`); //NaN
93+
console.log(`null + undefined = ${null+undefined}`); //NaN
94+
95+
// Switch Statement implemented with function
96+
function check(){
97+
const choice = Number(prompt('Enter a number between (1-7)'));
98+
switch(choice){
99+
case 1:
100+
console.log(`You've entered ONE`);
101+
break;
102+
case 2:
103+
console.log(`You've entered TWO`);
104+
break;
105+
case 3:
106+
console.log(`You've entered THREE`);
107+
break;
108+
case 4:
109+
console.log(`You've entered FOUR`);
110+
break;
111+
case 5:
112+
console.log(`You've entered FIVE`);
113+
break;
114+
case 6:
115+
console.log(`You've entered SIX`);
116+
break;
117+
case 7:
118+
console.log(`You've entered SEVEN`);
119+
break;
120+
default:
121+
console.log(`You've entered out of range number`)
122+
break;
123+
124+
}
125+
}
126+
127+
// Function Expression
128+
// Function Exp are created when execution reaches them. Hence, can't be called
129+
// before there declaration.
130+
const func1 = function(){
131+
console.log(`I am inside a Function Expression`);
132+
};
133+
134+
func1();
135+
136+
// Arrow Function - A concise way of writing functions
137+
// Also can't be called before declaration
138+
const func2 = () => console.log(`I am inside Arrow Func1`);
139+
func2();
140+
141+
const func3 = (a = 'Paul', b = 'John') => {
142+
console.log(`${a} & ${b} = The Beatles`);
143+
};
144+
func3();

‎Basics/index.html‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<script src="JS_Basics.js"></script>
8+
<link rel="shortcut icon" href="#" />
9+
<style>
10+
@import url('https://fonts.googleapis.com/css2?family=Potta+One&display=swap');
11+
body{
12+
background-image: linear-gradient(to right, red,orange,yellow,green,blue,indigo,violet);
13+
font-family: 'Potta One', cursive;
14+
}
15+
div{
16+
margin-top: 20%;
17+
}
18+
p{
19+
text-align:center;
20+
font-size:3rem;
21+
color: white;
22+
}
23+
</style>
24+
<title>Learning</title>
25+
</head>
26+
<body>
27+
<div><p>JS Fundamentals</p></div>
28+
</body>
29+
</html>

0 commit comments

Comments
 (0)