JavaScritp: Lexical Structure

☺ Whitespace & Line Breaks

JavaScript ignores extra spaces, tabs, and new lines. Code is easier to read with proper indentation.

let longString = "This is a very long string that we want to break \
into multiple lines for better readability and to avoid horizontal scrolling.";

console.log(longString);

let longText = `This is a very long string that 
spans multiple lines without needing any escape character.
This method keeps the code clean and readable.`;

console.log(longText);

let message = "This is a long string " + 
              "that is broken into " + 
              "multiple lines using the + operator.";

console.log(message);

☺ Unicode

You can use Unicode characters as variable names, and use them in strings and comments.

let 你好 = "Hello";
let π = 3.14159;
let 변수 = "Korean variable";
let गणित = "Mathematics";

console.log(你好); // Hello
console.log(π); // 3.14159
console.log(변수); // Korean variable
console.log(गणित); // Mathematics

let \u03C0 = 3.14159;  // π (Pi)
console.log(\u03C0);   // 3.14159
let π = 3.14;   // Unicode character for Pi
let 你好 = "Hello";  // Unicode variable names

let text = "你好, JavaScript! 🚀";
console.log(text);  // ✅ 你好, JavaScript! 🚀
let text = "\u4F60\u597D, JavaScript!";  
console.log(text);  // ✅ 你好, JavaScript!
let emoji = "\u{1F680}"; // 🚀 (Rocket emoji)
console.log(emoji);  // ✅ 🚀

let encoded = encodeURIComponent("你好");
console.log(encoded);  // ✅ %E4%BD%A0%E5%A5%BD
console.log(decodeURIComponent(encoded));  // ✅ 你好

☺ Token

Tokens are the smallest building blocks of JavaScript code. The main types of tokens include:

• Identifiers (variable names, function names)
• Keywords (let, const, if, return)
• Literals (123, 'hello', true, undefined, null)
• Operators (+, -, &&)
• Punctuation ({}, (), ;)

☺Identifiers

Identifiers (names for variables, functions, and objects) must:

• Start with a letter (a-z, A-Z), underscore (_) or dollar sign ($)
• Followed by letters, digits (0-9), _, or $
• Be case-sensitive
• Cannot be a reserved keyword

let myVar = 5;
let _hidden = true;
let $money = 100;

☺ Comments

JavaScript supports single-line and multi-line comments.

// Single-line comment

/* 
   Multi-line comment
   Spans multiple lines
*/

☺ Reserved Words

Here is the complete list of JavaScript reserved keywords:

Category	Keywords
Control Statements	break, case, catch, continue, debugger, default, do, else, finally, for, if, return, switch, throw, try, while
Variable & Function Declarations	var, let, const, function, class
Object-Oriented Programming	extends, super, this, new
Data & Type-Related	typeof, instanceof, void, delete, in
Modules & Imports	import, export
Asynchronous & Generators	async, await, yield
Built-in Literals	true, false, null, undefined
Special Contexts	with, enum, implements, interface, package, private, protected, public, static

☺ Optional Semicolons (Automatic Semicolon Insertion – ASI)

In JavaScript, semicolons (;) are optional in most cases because of a feature called Automatic Semicolon Insertion (ASI). This means JavaScript automatically inserts semicolons where it thinks they are needed.

JavaScript automatically inserts semicolons at the end of a line when:

• A line break (\n) is found where a statement should logically end.
• A statement is syntactically complete without needing a semicolon.
• A closing bracket (}) is encountered, such as at the end of a block.

//These cases work fine without semicolons:
console.log("Hello")  // No semicolon needed
console.log("World")  // ASI inserts semicolons automatically

//Functions work without semicolons too:
function sayHello() {
  console.log("Hello")
}

//Loop and if-statements are fine too:
if (true) console.log("Yes")  // Works
for (let i = 0; i < 3; i++) console.log(i)  // Works

❌ Buggy Code:
function getValue() {
  return  // 🚨 ASI inserts a semicolon here!
  {
    value: 10
  }
}
console.log(getValue())  // ❌ Returns undefined, NOT { value: 10 }

✅ Fix:
function getValue() {
  return {
    value: 10
  }  // ✅ Now it works correctly
}
console.log(getValue())  // { value: 10 }

❌ Buggy Code:
let a = 10
let b = 20
let sum = a 
(b + 5)  // 🚨 ASI thinks this is a function call: a(b + 5)
console.log(sum)  // ❌ Throws an error

✅ Fix:
let a = 10
let b = 20
let sum = a;  // ✅ Explicit semicolon prevents ASI confusion
(b + 5)
console.log(sum)  // ✅ Works fine

❌ Buggy Code:
let num = 5
[num]  // 🚨 ASI might think this is `let num = 5[num]`
console.log(num)  // ❌ Throws an error

✅ Fix:
let num = 5;
[num]  // ✅ Works fine
console.log(num)

Best Practice: To avoid ASI pitfalls, it’s recommended to always use semicolons (;) at the end of statements.

☺ Escape Characters

Some characters need an escape sequence:

let text = "This is a \"quote\" inside a string";
let newLine = "Hello\nWorld";  // New line