Home

Full JavaScript Tutorial

1. Introduction to JavaScript

Title	Remark/code
What is JavaScript?	An introduction to JavaScript, its uses, and how it's integrated into websites for dynamic behavior.
Setting Up JavaScript	How to include JavaScript in an HTML file using <script> tags or external .js files.
Hello World Example	Your first JavaScript program: Displaying "Hello, World!" in the browser console.

---

2. Basic Syntax & Operators

Title	Remark/code
Variables	Declaring variables using let, const, and var. Understanding variable scope.
Data Types	Overview of JavaScript data types: string, number, boolean, null, undefined, object, symbol.
Operators	Understanding arithmetic, assignment, comparison, and logical operators in JavaScript.

---

3. Control Structures

Title	Remark/code
Conditions	Using if, else, else if, and switch for decision-making.
Loops	Looping through data with for, while, do/while, for/in, and for/of.
Switch Statement	When and how to use the switch statement for multiple conditions.

---

4. Functions

Title	Remark/code
Function Basics	Declaring functions, function parameters, and return values.
Arrow Functions	Using arrow functions for cleaner syntax.
IIFE	Immediately Invoked Function Expressions (IIFE) for function execution right after definition.

---

5. Objects & Arrays

Title	Remark/code
Objects	Creating and manipulating JavaScript objects with properties and methods.
Array Basics	Working with arrays: declaring, accessing, and modifying elements.
Array Methods	Using built-in array methods like push(), pop(), shift(), unshift(), and forEach().

---

6. DOM Manipulation

Title	Remark/code
Document Object Model	Understanding the DOM and how to access and manipulate HTML elements.
getElementById & getElementsByClassName	Using getElementById() and getElementsByClassName() to select DOM elements.
Changing Style and Content	How to change HTML content and apply CSS styles dynamically with JavaScript.

---

7. Event Handling

Title	Remark/code
Event Listeners	Attaching event listeners to elements for user interaction (clicks, key presses, etc.).
Event Propagation	Understanding event bubbling and capturing.
Custom Events	Creating and dispatching custom events in JavaScript.

---

8. Asynchronous JavaScript

Title	Remark/code
Callbacks	Using callback functions to handle asynchronous operations.
Promises	Using promises for handling asynchronous code in a cleaner way.
Async/Await	Using async and await for handling asynchronous functions more intuitively.

---

9. Error Handling & Debugging

Title	Remark/code
Try/Catch	Handling errors with try, catch, and finally.
Throwing Errors	Manually throwing errors to catch exceptions in your code.
Debugging Tools	Using browser developer tools for debugging JavaScript code.

---

10. Advanced JavaScript Concepts

Title	Remark/code
Closures	Understanding closures and their applications in JavaScript.
Higher-Order Functions	Functions that take other functions as arguments or return them as values.
Modules	Organizing code into reusable modules using import and export syntax.

---

11. Working with the Web

Title	Remark/code
AJAX	Using AJAX (Asynchronous JavaScript and XML) to fetch data from the server without reloading the page.
Fetch API	A modern approach to handling asynchronous HTTP requests using the fetch() API.
Web Storage	Storing data locally in the browser using localStorage and sessionStorage.

---

12. Libraries & Frameworks

Title	Remark/code
jQuery	Simplifying DOM manipulation and event handling with jQuery.
Chart.js	Create interactive charts and graphs using the Chart.js library.
React	Introduction to React, a JavaScript library for building user interfaces.

---

13. Best Practices & Optimization

Title	Remark/code
Code Structure	Writing clean, readable, and maintainable JavaScript code.
Performance Optimization	Techniques to optimize JavaScript performance for better web application speed.
Security	Best practices for securing JavaScript code against common vulnerabilities like XSS and CSRF.

---

---

JavaScript Cheat Sheets:

Title	Remark/code
Array	Basic Array Operation
Browser modes setting	<meta content = "IE=EmulateIE10"> this will force the browser to use IE version 10
Chart.js	Create chart with chart.js library
Conditions	if/else/else if/switch
Date	Date object
Dialog Box	Pop up window
Document Background	document.body.style.background = "#FFFFFF";
Event Listener	isNumberKey()
Folder Path Full	document.location.href.substring(0,document.location.href.lastIndexOf("/")+1);
getElementsByClassName	the use of this
Loops	for, for/in, for/of, while, do/while
IIFE & XMLHttpRequest	IIFE Immediately Invoked Function Expression & Fetch data from PHP with HttpRequest
Maximize Browser Window	Open Browser window to Maximum
Number	Number converts the object argument to a number that represents the objects's value. If the value cannot be converted to a legal number, NaN is returned.
Reload page	this.location.reload(true);
Scrollable Table	onscroll
Select List Item	obj.options[obj.selectedIndex].text
String	Strings are used for storing and manipulating text
Table	Making Table dynamically
Title of Page	document.title = "title";
URL get	window.location.href;
Window open	window.open('?url=pims.master','_blank');
Tutorial 01	Basic