JavaScript

About the Guide

This guide was created as an effort by NUS Hackers to make knowledge easily available for various technical topics!

About this Section

This section of the guide will cover JavaScript, from its syntax and constructs to its use in frontend web development. Below are the slides containing an abridged version of the guide (originally intended to accompany a live workshop), along with a link to a repository that holds some sample code as well as sample solutions to exercises posed throughout this guide.

Slides

JavaScript_HTML_CSS Notes for Orbital 2024.pdf

Code

Code

What is JavaScript?

is a high-level programming language that is often combined with HTML and CSS to enhance the frontend of a browser-based application. Its main uses are interactive elements, frontend input validation and fetch requests.

JavaScript as a language has influenced web development (and programming as a whole) a lot since its inception, with other languages being developed to add functionality to it (such as TypeScript, which is a typed version of JavaScript).

What makes JavaScript rather unique is that it does not have its own compiler interpreter. Java has the JVM, Python has its installable interpreter and C has the clang compiler. But JavaScript instead relies on a web browser for execution.

Another feature is non-mandatory semi-colons at the end of each line: you can either omit or leave in a semi-colon at the end of each line in JavaScript. The browser will still be able to understand it either way. However by convention it is recommended to place semi-colons at the end of every line, as this guide will follow.

Getting started

Do you have a web browser that is not Internet Explorer? Do you have an IDE (or other text/code editor) installed on your computer? If you answered yes to both questions, then you are ready to started coding! If not, then install a browser as well as a text editor or IDE of your choice. The browser of choice is Mozilla Firefox, but feel free to use any browser you like.

Next steps

Next, we will look at how the Browser Developer Tools will aid us throughout the development cycle when using JavaScript, HTML and CSS (to be covered in brief in this guide).