This is Javascript Basic Tutorials.

1. Jubair Ahmed Junjun
B.Sc in Computer Science & Engineering(CSE)
JS Lecture.
https://www.youtube.com/c/JubairAhmedJunjun/videos?view_as=subscriber
YouTube :

2. Js(JavaScript)
JavaScript is a text-based programming language used
both on the client-side and server-side that allows you to
make web pages interactive. Where HTML and CSS are
languages that give structure and style to web pages,
JavaScript gives web pages interactive elements that
engage a user.
Incorporating JavaScript improves the user experience of
the web page by converting it from a static page into an
interactive one. To recap, JavaScript adds behavior to
web pages.

3. What is JavaScript used for?
 JavaScript is mainly used for web-based applications and web browsers. But JavaScript is also used beyond the Web in
software, servers and embedded hardware controls. Here are some basic things JavaScript is used for:
 Adding interactive behavior to web pages
➢ Show or hide more information with the click of a button
➢ Change the color of a button when the mouse hovers over it
➢ Slide through a carousel of images on the homepage
➢ Zooming in or zooming out on an image
➢ Displaying a timer or count-down on a website
➢ Playing audio and video in a web page
➢ Displaying animations
➢ Using a drop-down hamburger menu
 Creating web and mobile apps
 Building web servers and developing server applications
 Game development

4. Why use JavaScript over other
programming languages?
 JavaScript is the only programming language native to the web browser
 JavaScript is the most popular language
 There’s a low thresholdto get started
 It’s a fun language to learn

5. History of JS
 Want to added support for Java applets
more accessible to non-Java
programmers in Netscape.
 Developedby Brendan Eich of
Netscape
 December 1995
 Mocha => LiveScript => JavaScript
 Popular!
 Microsoft release JScript
 NetScape submit to ECMA for
standardize

6. JavaScript vs. Java
 There’s often some confusion about the two, but JavaScript and Java have
almost nothing in common. The name JavaScript came from Netscape’s
support of Javaapplets within its browser. Many say it was also a marketing
tactic to divert some attention from Java, which was the most buzzed-about
language at the time. To run Java programs, the code must be first compiled
into an executable form. On the other hand, JavaScript was created to be
interpreted at run time, making it much more dynamic (these days the
boundary of the two methods is a lot more blurred).
 JavaScript didn’t exactly get off to the best start. It didn’t perform as well, and
those developing in Java considered JavaScript more of a “UI glue” to be used
mostly by designers and other non-engineers. But the reality is that having a
“glue” language allowedthe internet to really flourish. Programmers could react
better to use events and compose interactive components. And due to that,
JavaScript spread like wildfire and very quickly became the lingua franca of the
web.

7. ট োকেন(Token)
 A token is the smallest element of a program that is meaningful to the compiler.
 Types of Token
 Keyword হক ো এমন কেছু সংরকিত শব্দ,যো এেটি কনকদি ষ্ট অর্ি বহণ েরকব এবং
টরোগ্রোকম এেটি কনকদি ষ্ট েোযি সম্পোদন েরকব।
✓ Keywords : int,float,while
✓ Identifiers : sum,main
✓ Constants : 100,555
✓ Strings : “Maisha”
✓ Special Symbols : [] () {}, ; * = #
✓ Operators : +,-,*,/,%

8. Keyword বযবহোকরকর কনয়ম
➢ Keyword েখকনো variableবো চ কের নোম কহকসকব বযবহোর েরো হয় নো।
➢ Keyword সমূকহর রকতটি বণি small letterএর হয়।
➢ যকদ েখকনো দুটি keyword এে সোকর্ বযবহোর েরকত হয়,তোহক মোঝখোকন ফোেোাঁ স্থোন র্োেকত হকব।
➢ keyword সমূকহর নোম এেটি এেে শব্দ,অর্িোৎ মোকঝ টেোন ফোাঁেো স্থোন র্োকে নো।

9. Keywords
in Js
abstract arguments await* boolean
break byte case catch
char class* const continue
debugger default delete do
double else enum* eval
export* extends* false final
finally float for function
goto if implements import*
in instanceof int interface
let* long native new
null package private protected
public return short static
super* switch synchronized this
throw throws transient true
try typeof var void
volatile while with yield

10. Identifier
 Identifiers are used as the general terminology for naming of variables,
functions and arrays.
 Some identifiers are used :
A-Z,a-z,0-9,$,_
Some valid and non-valid identifier example
Valid identifiers Non-valididentifiers
Number1,Int,std_name 1number ,int, std name
Keyword(Reservedword)
Space can’t be used
Digit can not be used

11. Constant
 Constants are also like normal variables. But, only
difference is, their values can not be modified by the
program once they are defined. Constants refer to
fixed values.
 Types of Constants :
✓ Integer constants – Example:0, 1, 1218, 12482
✓ Real or Floating point constants – Example: 0.0, 1203.03,
30486.184
✓ Octal & Hexadecimal constants – Example: octal: (013
)8 = (11)10, Hexadecimal: (013)16 = (19)10
✓ Character constants -Example:‘a’, ‘A’, ‘z’

12. String & Special Symbols
 In js, a string is a sequence of characters.
 char greeting[6] = {'H', 'e', 'l', 'l', 'o', '0'};
 char greeting[] = "Hello";
 Special Symbols :The following special symbols are used in C having some special
meaning and thus, cannot be used for some other purpose.[] () {}, ; * = #
 Brackets[]: Opening and closing bracketsare used as array element reference.
These indicate single and multidimensional subscripts.
 Parentheses(): These special symbols are used to indicate function calls and
function parameters.
 Braces{}: These opening and ending curly braces marks the start and end of a block of code
containing more than one executable statement.
 comma (, ): It is used to separate more than one statementslike for separating parameters in
function calls.
 semi colon : It is an operator that essentially invokessomething called an initialization list.
 asterisk (*): It is used to create pointer variable.

13. Variable/ চলক
টরোগ্রোকম টেোনএেটি নোম কদকয় যকদ তোরমকযয data রোখো হয়,তকবঐ নোমটিকেচ ে বক ।
টযমন : number 1 =10;
Name= "Maisha"
Variable ক খোর কনয়ম :
1.Variableএর নোম বণি (A-Z,a-z).অঙ্ক(0,1....9),আন্ডোরককোর(_)এবং ড োর কচহ্ন ($)বযবহোরেরো হয়।
Valid Invalid
first_name "JAJ SoftTech"
Id1 JAJSoftTech@
Code1022 #JAJSoftTech
$JAJSoftTech

14. 2.Variable এর নোম কডকি বো অঙ্ক কদকয় শুরু হকত পোকর নো।
Invalid Valid
1number _number1,
number,
a2b
3.Keywordবো function টেকরকয়বক র নোম কহকসকব বযবহোর েরো যোয় নো।
Valid Invalid
Main main
Float float
for
4. Variable এর নোকমর মোকঝ টেোন ফোাঁেো স্থোন র্োকে নো।
Invalid Valid
First number first_number

15. Operator,Operand,Constand,Expression
 JS- েোষোয় গোকণকতে এবং টযৌকিে েোি েরোর িনয েতগুক ো কবকশষ কচহ্ন (+,-*,/) বযবহোর েরো হয়,
একদরকে অপোকর র বক ।
A + B = 7
Operand
Expression
Constand
Operator

16. Types of Operator
➢ Arithmetic Operator
➢ Assignment Operator
➢ Relational Operator
➢ Logical Operator
➢ Conditional Operator
➢ Unary Operator
➢ Bitwise operator
➢ Special Operator

17. Arithmetic Operator
Operator কাজ উদাহারণ ফলাফল
+ য াগ করা X=15+6 21
- বিয় াগ করা X=15-6 9
* গুণ করা X=15*6 90
/ ভাগ করা X=15/6 2
% ভাগয়েষ X=15%6 3

18. গাবণবিক ফরমুলায়ক এয়েয়েেয়ে রূপান্তর :
গাবণবিক এেয়েেে সমি
ু লয বস এেয়েেে
X = a2-2ab + b2 X=a*a – 2*a*b + b*b;
Area = √ s(s - a)(s - b)(s - c) Area = sqrt(s*(s-a)*(s-b)*(s-c));
x = Y X ==Y;
Y=AB2+C Y = A*B*B+C;

19. Assignment Operator
Operator Example Full meaning
= X = x+5 X=x+5
+= X+=5 X=x+5
-+ X-=5 X=x-5
*= X*=y X=x*y
/= X/=5 X=x/5
%= X%=5 X=x%5

20. Relational
Operator
Operator Meaning Example Result
== Equal to 5== 2 False
!= Not equalto 5!= 2 True
< Less than 5<2 False
> Greaterthan 5> 2 True
<= Lessthanor
equalto
5<= 2 False
>= Greater than or
equal to
5>= 2 True

21. Logical Operator
Operator Name Example
&& Logical AND A&&B
|| Logical OR A||B
! Logical NOT !a

22. Conditional Operator
A ternary operator pair "?:" is available in c construct
conditional expression of the forms.
Exp1 ? Exp2 : Exp3;
Example :
If(a>b)
X=a;
Else
X=b;

23. Unary Operator
Operator Meaning
+ Unary Plus
- Unary minus
++ Increment
-- Decrement
! Logical implement

24. Bitwise Operator
Operator Meaning Example
& Binary AND Operator (A& B) = 12, i.e., 00001100
| Binary OR Operator (A| B) = 61, i.e., 0011 1101
^ Binary Ex-OR Operator (A^ B) = 49, i.e., 0011 0001
>> Binary Right Shift Operator A >>2 = 15 i.e., 00001111
<< Binary Left Shift Operator A <<2 = 240 i.e., 1111 0000
~ Binary One's Complement
Operator
(~A) = ~(60), i.e,. 1100 0011

25. Decision making Statement
 Decision making statement is depending on the condition block need to
be executed or not which is decided by condition.
 If the conditionis "true" statement block will be executed, if conditionis
"false" then statement block will not be executed.
There are three types of decision making statement :
➢ if
➢ if-else
➢ switch

26. if -Statement
Basic Syntax :
if(condition)
{
.......
.......
}
Condition
ConditionBlock
Flowchart :
if condition
is false
if condition is
true

27. else Statement
Condition
Condition Block
Flowchart :
if condition
is false
if condition is
true
else body
Basic Syntax :
if(condition)
{
.......
.......
}
else
{
…........
.........
}

28. if else /else if Statement
Basic Syntax :
if(condition)
{
…......
........
}
else if(condition)
{
….......
..........
}
else if(condition)
{
…........
…......
}
else
{
…...
…...
}
if
condition
else if 2
false
else if
condition2
else if
condition1
if body
else if 1
else body
false
false
true
true
true
Flowchart :

29. Switch Statement
Statement n
Statement 3
Statement 2
Statement 1 Break
Break
Break
Expression
Case 1
Case 1
Case 1
default
Basic Syntax :
switch(expression/variable)
{
case 1:
//statements
break;
case 1:
//statements
break;
case 2:
//statements
break;
.
.
default:
//statements
}
Flowchart :

30. Loops
 A loop statement allows us
to execute a statement or
group of statements
multiple times.
 A loop statement allows us
to execute a statement or
group of statements
multiple times.
Sr.No Loop Type & Description
1 while loop
Repeats a statement or group of statements while a given
condition is true. It tests the condition before executing the
loop body.
2 for loop
Executes a sequence of statements multiple times and
abbreviates the code that manages the loop variable.
3
do...while loop
It is more like a while statement, except that it tests the
condition at the end of the loop body.
4 nested loops
You can use one or more loops inside any other while, for, or
do..while loop.

31. while loop
initialization;
while(condition)
{
statement(s);
increment/decrement;
}
Basic Syntax :
Condition
code Block
Flowchart :
if condition
is false
if condition is
true
initialization

32. do...while loop
initialization;
do {
statement(s);
increment/decrement;
} while( condition );
Basic Syntax :
Condition
Code Block
if condition
is false
if condition is
true
Flowchart :
initialization;

33. for loop
Basic Syntax :
for(init; condition; increment)
{
statement(s);
}
Condition
code Block
Flowchart :
if condition
is false
if condition is
true
initialization
increment

34. for ( init; condition; increment ) {
for ( init; condition; increment ){
statement(s);
}
statement(s);
}
do{
statement(s);
do{
statement(s);
}while(condition);
}while(condition);
while(condition){
while(condition){
statement(s);
}
statement(s);
}
nested loop
while loop do...while for loop
Basic Syntax :

35. Data Type in
JS

36. Join with me
Fb page : https://www.facebook.com/jajsofttech
Fb group : https://www.facebook.com/groups/2704079586349093
YouTube: https://www.youtube.com/c/JubairAhmedJunjun/videos?view_as=subscriber
LinkedIn : https://www.linkedin.com/in/jubair-ahmed-junjun-4ab6a0177/