TryHackMe — JavaScript Essentials | Cyber Security 101 (THM)
Essential Concepts
- Variables: Containers for storing data in JavaScript. Declare with
var(function-scoped),let, orconst(both block-scoped) for controlled visibility. - Data Types: Define value types for variables, like string, number, boolean, null, undefined, and object (e.g., arrays).
- Functions: Code blocks for specific tasks. Instead of repeating code, use functions like
PrintResult(rollNum)to manage repeated actions. - Loops: Run code multiple times while a condition is true, using loops like
for,while, anddo...while. - Request-Response Cycle: A client sends a request, and the server responds with resources (e.g., a webpage).
Questions and Answers
- What term allows you to run a code block multiple times as long as it is a condition?
- Loop
JavaScript Overview
JavaScript (JS) is an interpreted language that runs directly in the browser. Here’s a breakdown of key concepts in a sample JS program:
- Hello, World!: A simple log to the console.
- Variables and Data Types: Define values, e.g.,
let age = 25;. - Control Flow: Uses
ifstatements to execute different code based on conditions. - Functions: Code blocks like
greet(name)that can be reused.
JS is client-side, so you can write and run it in the Chrome Console.
Example Program:
let x = 5;
let y = 10;
let result = x + y;
console.log("The result is: " + result);Questions and Answers
- What is the code output if the value of x is changed to 10?
- The result is: 20
- Is JavaScript a compiled or interpreted language?
- Interpreted
Integrating JavaScript in HTML
JavaScript can be added to HTML in two main ways:
- Internal JavaScript: Code is embedded directly within the HTML using
<script>tags. Ideal for small scripts and learning how JS interacts with HTML. - External JavaScript: Code is stored in a separate
.jsfile and linked in HTML with thesrcattribute in the<script>tag. Keeps HTML cleaner and makes it easier to reuse JS across multiple pages.
Verifying Internal or External JS: Check the page’s source code. Internal JS appears in <script> tags without src, while external JS has the src attribute in <script>.
Questions and Answers
- Which type of JavaScript integration places the code directly within the HTML document?
- Internal
- Which method is better for reusing JS across multiple web pages?
- External
- What is the name of the external JS file that is being called by external_test.html?
- thm_external.js
- What attribute links an external JS file in the
<script>tag?
- src
Abusing Dialogue Functions
JavaScript offers functions like alert, prompt, and confirm for user interaction:
- Alert: Shows a message with an “OK” button (e.g., alert(“Hello THM”);).
- Prompt: Displays a message asking for user input; returns the input or null (e.g., name = prompt(“What is your name?”);).
- Confirm: Shows a message with “OK” and “Cancel”; returns true or false based on user choice (e.g., confirm(“Do you want to proceed?”);).
Exploitation Example: A malicious HTML file could repeatedly use alert boxes to disrupt user experience. For instance, alert(“Hacked”); in a loop could force multiple pop-ups.
Questions and Answers
- In the file invoice.html, how many times does the code show the alert Hacked?
- 3
- Which of the JS interactive elements should be used to display a dialogue box that asks the user for input?
- prompt
- If the user enters Tesla, what value is stored in the carName= prompt(“What is your car name?”)? in the carName variable?
- Tesla
Bypassing Control Flow Statements
Control flow in JavaScript directs the sequence of code execution based on conditions. Structures like if-else statements allow decisions based on conditions, while loops (for, while) repeat actions as long as a condition is true.
Conditional Statements: For example, in an if-else statement, entering a value for age triggers different messages. If age is 18 or above, it displays “You are an adult”; otherwise, “You are a minor.”
Login Form Bypass: In some cases, developers implement simple JS-based login forms that require specific credentials. Testing these forms can help you understand basic JS authentication.
Questions and Answers
- What is the message displayed if you enter the age less than 18?
- You are a minor.
- What is the password for the user admin?
- ComplexPassword
Exploring Minified Files
Minification in JavaScript compresses files by removing unnecessary characters, which reduces file size and improves load times. Obfuscation further hides code by renaming variables and inserting junk code to make it hard to read, though the functionality remains intact.
Practical Example:
- Create an HTML file, hello.html, with JS code in hello.js. Running this shows an alert with “Welcome to THM.”
- Use an online tool to minify/obfuscate the code. It becomes unreadable but functions the same.
- Deobfuscation tools can help revert obfuscated code back to a more readable form.
Questions and Answers
- What is the alert message shown after running the file hello.html?
- Welcome to THM
- What is the value of the age variable in the following obfuscated code snippet?
- 21
Best Practices
When developing web applications with JavaScript, follow these practices to reduce vulnerabilities:
- Avoid Relying on Client-Side Validation Only: Always perform server-side validation since users can bypass or manipulate client-side JS validation.
- Refrain from Adding Untrusted Libraries: Only include libraries from trusted sources to avoid malicious code.
- Avoid Hardcoded Secrets: Never hardcode sensitive data (e.g., API keys) directly in JS, as it is easily accessible.
- Minify and Obfuscate Your JavaScript Code: Minifying and obfuscating code improves load time and adds a layer of protection by making the code harder to interpret.
Questions and Answers
- Is it a good practice to blindly include JS in your code from any source (yea/nay)?
- nay



