Slides of the of the Frontend Bootcamp Session 1 by GDSC NED

1. FRONTEND BOOTCAMP
Session # 1

2. JavaScript
• Fundamentals
• DOM Manipulation and Events
• Array Magic
• Objects and Object Constructors
• Factory Functions

3. Fundamentals
The basics

4. Data Types
Primitive:
1. Number
2. Bigint
3. String
4. Boolean
5. Undefined
6. Null
7. Symbol
Non-Primitive:
8. Object

5. Truthy and Falsy Values
• if (true)
• if ({})
• if ([])
• if (42)
• if ("0")
• if ("false")
• if (3.14)
• if (-3.14)
• if (Infinity)
• if (-Infinity)
• if (new Date())
• if (-42)
In JavaScript, a truthy value is considered true when encountered
in a Boolean context

6. Truthy and Falsy Values
if (false) {
// Not reachable
}
if (null) {
// Not reachable
}
if (undefined) {
// Not reachable
}
if (0) {
// Not reachable
} … and so on
In JavaScript, a falsy value is considered false when encountered in a Boolean
context. All values are truthy except false, 0, -0, “ ”, null, undefined, NaN

7. Functions

8. Will it run??

9. Parameters

10. Arrow Functions

11. Higher Order Functions

12. Vanilla JS DOM Manipulation:
Le Developers:

13. Array Magic
The basics of array iteration and manipulation

14. Arrays
• push(), adds new element at end of array
• pop(), removes last array element
• length, gives the length of array
• concat(), joins two arrays into a new single one
• slice(), returns a new array of elements consisting of the start and end index.

15. Array Magic
The map() method creates a new array populated with the results of calling a
provided function on every element in the calling array.

16. Array Magic
The reduce() method executes a user-supplied "reducer" callback function on each element of the
array, in order, passing in the return value from the calculation on the preceding element. The final
result of running the reducer across all elements of the array is a single value.

17. Objects and Object
Constructors
Here goes object creation and handling in JS

18. Objects
Objects are used to store keyed collections of various data and more complex
entities

19. Object Constructors

20. Factory Functions
A JavaScripty approach to initializing objects

21. Factory Functions
One of the biggest issues with constructors is that while they look just like
regular functions, they do not behave like regular functions at all. If you try to
use a constructor function without the new keyword, your program will not
work as expected, but it won’t produce error messages that are easy to
trace.

22. Factory Functions

23. Make sure to join us in the next session!!
Thank You!

25. Aa Aa
Color Theme
Typography
Calibri Calibri Light

26. www.PresentationGO.com
The free PowerPoint and Google Slides
template library
Designed with by