Javascript learning PPT

1. Programming Class
JavaScript

2. How to Learn Effectively
• Short Note
• Revise
• Second Brain

3. Why Choose This Course (JavaScript)
• Versatility
• Browser Compatibility
• Large Community and Resources
• Immediate Feedback
• Full-Stack Development
• Demand in the Job Market
• Fundamental Concepts

4. JavaScript Intro
History of JavaScript: From Humble Beginnings to Web
Domination
• Birth of JavaScript (1995):
• Created by Brendan Eich in just 10 days for Netscape Navigator.
• Initially called "LiveScript", then renamed to "JavaScript" for
marketing reasons.
• Introduced interactivity to static web pages, revolutionizing web
development.

5. JavaScript History
Early Years and Browser Wars (1995-2000):
• Microsoft adopted JavaScript for Internet Explorer, sparking a fierce rivalry with
Netscape.
• Focused on basic features and browser compatibility, leading to fragmented
implementations.
• Despite lack of standardization, JavaScript gained popularity due to its ease of
use.
Standardization and Maturity (2000-2015):
• ECMAScript standard emerged to standardize the language and guide its
evolution.
• Newer versions introduced significant features like object-oriented programming
and functions.
• Libraries and frameworks like jQuery emerged, simplifying web development with
JavaScript.

6. JavaScript History
Reaching New Heights (2015-present):
• Introduction of ES6 brought major additions like arrow functions and modules.
• Node.js revolutionized server-side development, expanding JavaScript beyond
browsers.
• Frameworks like React and Angular gained popularity, enabling sophisticated web
apps.
JavaScript Today:
• The dominant language for web development, powering interactive experiences for
billions.
• Supported by all major browsers, with a vibrant community driving its continuous
evolution.
• Widely adopted for various applications beyond web, like mobile and desktop
development.

7. IDE (Integrated Environment Tool)
• VS Code
• ATOM
• Sublime Text
• Notepad
• Web Strome
• PHP Strome

8. Set up IDE
• VS Code

9. Server Install
• Xampp
• Wamp Server
• Lamp

10. Connected with AI
• Create account in OPENAI and Google Birds

11. Setup some account & software
• GitHub
• Notion
• Stack overflow

12. Server related issue fixup
• Xampp (Apache and mysql)

13. Node
• Install Node

14. Start JavaScript
• Simple hello world in console log

15. JavaScript Syntax
• A letter (A-Z or a-z)
• A dollar sign ($)
• Or an underscore (_)
• JS is case sensitive

16. JavaScript Syntax
• JS reversed words
• Link: https://www.w3schools.com/js/js_reserved.asp

17. JavaScript Syntax
Hyphens:
• first-name, last-name, master-card, inter-city.
Underscore:
• first_name, last_name, master_card, inter_city.
Upper Camel Case (Pascal Case):
• FirstName, LastName, MasterCard, InterCity.
Lower Camel Case:
• firstName, lastName, masterCard, interCity.

18. JS Comment
• Single line
//this is a single line comment
• Multi line Comment
/*
this is multiple line comment
For test basis
*/

19. JS Variable
• var
• let
• const

20. JS Operator
• Arithmetic Operators
• Assignment Operators
• Comparison Operators
• String Operators
• Logical Operators
• Bitwise Operators
• Ternary Operators

21. Arithmetic Operation
+ Addition
- Subtraction
* Multiplication
** Exponentiation
/ Division
% Modulus (Remainder)
++ Increment
-- Decrement

22. Assignment Operators
= x = y x = y
+= x += y x = x + y
-= x -= y x = x - y
*= x *= y x = x * y
/= x /= y x = x / y
%= x %= y x = x % y
**= x **= y x = x ** y

23. Comparison Operators
== equal to
=== equal value and equal type
!= not equal
!== not equal value or not equal type
> greater than
< less than
>= greater than or equal to
<= less than or equal to

24. String Operators
let str1 = “Hriday";
let str2 = “Ahmed";
let result = (str1 + str2);
console.log(result);

25. Logical Operators
&& and (x < 10 && y > 1) is true
|| or (x == 5 || y == 5) is false
! not !(x == y) is true

26. Conditional (Ternary) Operator
let voteable = (age < 18) ? "Too young": "Old
enough";

27. Bitwise Operators
& AND Sets each bit to 1 if both bits are 1
| OR Sets each bit to 1 if one of two bits is 1
^ XOR Sets each bit to 1 if only one of two bits is 1
~ NOT Inverts all the bits
<< Zero fill left shift Shifts left by pushing zeros in from the right and let the leftmost bits fall
off
>> Signed right shift Shifts right by pushing copies of the leftmost bit in from the left, and let
the rightmost bits fall off
>>> Zero fill right shift Shifts right by pushing zeros in from the left, and let the rightmost bits fall
off

28. JS data types
• 1. String
2. Number
3. Bigint
4. Boolean
5. Undefined
6. Null
7. Object