Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
0% found this document useful (0 votes)
8 views

THM - JavaScript Essentials

Uploaded by

huwi4183
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
8 views

THM - JavaScript Essentials

Uploaded by

huwi4183
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 5

Hsu Wai Lwin Hnin ʚɞ

THM - JavaScript Essentials


Essential Concepts
Variables

Variables are containers for storing data values. In JavaScript, they can be declared using var,
let, or const:

var: Function-scoped.
let and const: Block-scoped, offering better control over visibility.

Data Types

JavaScript supports several data types, including:

String: Text values.


Number: Numeric values.
Boolean: true or false.
Null: Represents "nothing."
Undefined: Variable declared but not assigned a value.
Object: Complex data types like arrays and objects.

Functions

Functions are blocks of code designed to perform specific tasks. Example:

function PrintResult(rollNum) {

alert("User with roll number " + rollNum + " has passed the exam.");

Functions can be reused to avoid repetitive code, such as printing results for multiple
students.

Loops

Loops execute a code block repeatedly while a condition is true. Common types include for,
while, and do...while. Example:

for (let i = 0; i < 100; i++) {

PrintResult(rollNumbers[i]);

}
Request-Response Cycle

In web development, the browser (client) sends a request to the web server, which responds
with the requested data, such as a webpage or resource.

JavaScript Overview
JavaScript (JS) is an interpreted language executed directly in the browser, making it ideal for
creating dynamic web apps. Below is an example covering key concepts:

// Hello, World! program

console.log("Hello, World!");

// Variable and Data Type

let age = 25; // Number type

// Control Flow Statement

if (age >= 18) {

console.log("You are an adult.");

} else {

console.log("You are a minor.");

// Function

function greet(name) {

console.log("Hello, " + name + "!");

// Calling the function

greet("Bob");

Key Points:

Variables: Store data (let age = 25).


Control Flow: Use conditions (if-else) for decision-making.
Functions: Group reusable code (greet(name)).
Execution: JS runs client-side, easily inspected and tested using tools like the Google
Chrome Console.

Integrating JavaScript in HTML


JavaScript (JS) can be integrated into HTML in two main ways: internally and externally.

Internal JS: The script is embedded directly within the HTML document using <script>
tags, placed either in the <head> (for pre-loading) or <body> (for interaction during page
load). Example: adding two numbers and displaying the result using
document.getElementById().innerHTML.
External JS: The JS code is written in a separate .js file and linked to the HTML using the
<script> tag with the src attribute. This keeps the code organised and easier to maintain,
especially for larger projects.

Abusing Dialogue Functions


JavaScript provides dialogue functions like alert, prompt, and confirm for user interaction:

Alert: Displays a message with an "OK" button (e.g., alert("Hello")).


Prompt: Asks for user input, returning the value or null if canceled (e.g., prompt("Enter
your name")).
Confirm: Asks for confirmation, returning true for "OK" and false for "Cancel" (e.g.,
confirm("Are you sure?")).

Abuse Example: Malicious JS can exploit these, such as repetitive alerts disrupting the user
experience. Always run JS from trusted sources to prevent potential attacks like XSS.

Bypassing Control Flow Statements


Control Flow in JavaScript: Control flow determines the execution order of code. Common
structures include if-else for decisions and loops like for, while, and do...while for repetition.

Example - Conditional Statements:


An age verification script uses an if-else statement:

<!DOCTYPE html>

<html lang="en">

<head>

<title>Age Verification</title>

</head>
<body>

<h1>Age Verification</h1>

<p id="message"></p>

<script>

age = prompt("What is your age")

if (age >= 18) {

document.getElementById("message").innerHTML = "You are an adult.";

} else {

document.getElementById("message").innerHTML = "You are a minor.";

</script>

</body>

</html>

Bypassing Login Forms: JavaScript-based authentication can be insecure, as attackers may


manipulate or bypass client-side validation. Always implement authentication securely on the
server side.

Exploring Minified Files


https://codebeautify.org/javascript-obfuscator

https://deobfuscate.io

Best Practices
JavaScript Best Practices:

1. Use Server-Side Validation: Avoid relying solely on client-side validation, as users can
manipulate or disable JavaScript.
2. Avoid Untrusted Libraries: Include only trusted JS libraries to prevent introducing
malicious scripts.
3. Do Not Hardcode Secrets: Never store sensitive information (e.g., API keys) directly in JS
code.
4. Minify and Obfuscate Code: Minify and obfuscate JS in production to improve
performance and make reverse engineering harder.

You might also like