✏️ Training — Syntax

📚 47 questions ⏱ 15-20 min 🏆 Instant feedback

✏️ JavaScript Syntax Rules

Learn the fundamental rules for writing correct JavaScript code

🎯 What You Will Learn in This Training

This interactive training will help you master JavaScript Syntax through:

✅ 50 interactive questions covering all code writing rules
✅ Understanding correct variable naming rules
✅ Mastering comments and multi-line comments
✅ Applying the DRY (Don't Repeat Yourself) principle in programming
✅ Using modern Template Literals
✅ Understanding case sensitivity and its effect on variables
✅ Writing statements and expressions correctly
✅ Adding JavaScript files to HTML pages
✅ Using escape characters correctly
✅ Ability to retake the training to improve your level and reinforce concepts

🏗️ What is JavaScript Syntax?

Syntax is the set of rules and principles that determine how to write JavaScript programs. Just as English has grammar rules that determine how to form sentences, JavaScript has rules that determine how to write commands and code correctly so the browser can understand them.

✅ Statements: How to write commands and instructions
✅ Comments: How to add explanatory notes to code
✅ Naming: Rules for choosing variable and function names
✅ Escape Characters: How to write special characters
✅ Code Blocks: Organizing code within {} braces
✅ Strings: Ways to write text correctly

📝 Statements in JavaScript

A Statement is an executable unit in JavaScript. Each statement tells the browser to execute a specific command. A statement can be simple like assigning a value to a variable, or complex like a loop.

 // Examples of statements in JavaScript

 let name = "Ahmed"; // assignment statement

 console.log("Hello"); // function call statement

 if (age > 18) { // conditional statement

 console.log("Adult");

 }

 for (let i = 0; i < 5; i++) { // loop statement

 console.log(i);

 }

Note: The semicolon (;) at the end of a statement is not mandatory in JavaScript but is highly recommended to avoid errors.

💬 Comments in JavaScript

Comments are explanatory notes for programmers that are ignored when the code is executed. They help in understanding and documenting code.

 // This is a single-line comment - uses //

 /*

  This is a multi-line comment

  It can span multiple lines

  Uses /* at the beginning and */ at the end

 */

 // Comments are used for:

 // 1. Explaining complex code logic

 // 2. Temporarily disabling parts of code for debugging

 // 3. Documenting functions and variables

 // 4. Reminding programmers of future tasks

DRY Principle: Don't Repeat Yourself - Don't Repeat Yourself. Use functions and reuse instead of writing the same code repeatedly.

🏷️ Naming Conventions

JavaScript follows specific rules for naming variables and functions (Identifiers):

Starts with a letter, $, or _
Cannot start with a number
Can contain letters, numbers, $, _
JavaScript is Case Sensitive
Cannot use Reserved Words

 // Valid variable names

 let name = "Ahmed";

 let _private = "private";

 let $element = document.getElementById("id");

 let firstName = "Mohammed"; // camelCase

 let user_age = 25; // snake_case (not common in JS)

 // Invalid variable names

 // let 1stName = "Ahmed"; // ❌ starts with a number

 // let user-name = "Mohammed"; // ❌ contains a hyphen

 // let let = "reserved word"; // ❌ reserved word

Preferred style in JavaScript: Use camelCase for variables and functions, and PascalCase for classes.

🔤 Strings in JavaScript

Strings in JavaScript can be written in three ways:

 // 1. Using 

double quotes

 let str1 = "Hello World";

 // 2. Using single quotes

 let str2 = 'Hello World';

 // 3. Using Template Literals - ES6+

 let name = "Ahmed";

 let str3 = `Hello ${name}!`; // merging variables

 let multiLine = `This is text

 on multiple

 lines`; // multi-line strings

 // Escape Characters

 let quote = "He said: \"Hello\""; // \" to write "

 let path = "C:\\Users\\Ahmad"; // \\ to write \

 let newLine = "First line\nSecond line"; // \n for a new line

⚡ Important JavaScript Syntax Properties

Case sensitivity (Case Sensitive): myVar and MyVar and MYVAR are three different variables
Whitespace Handling: JavaScript ignores extra spaces and blank lines (but they are important for readability)
Code Blocks: Curly braces {} are used to group a set of statements
Reserved Words: Cannot be used as variable names, such as: if, for, function, class, etc.
Expressions: Any code that produces a value, such as: 5 + 3 or x = 10

 // Example demonstrating different properties

 let age = 25; // camelCase

 let Age = 30; // different variable (Case Sensitive)

 // JavaScript ignores whitespace

 let x=5; // same as let x = 5;

 function greet() { // code block

 console.log("Hello");

 console.log("World");

 }

 // Expressions

 let sum = 5 + 3; // arithmetic expression

 let isAdult = age >= 18; // logical expression

✨ Principles of Writing Good JavaScript Code

Writing code correctly doesn't just mean the code works, but that it's easy to read and maintain. Here are the key principles:

Clarity over cleverness: Clear code is better than clever but complex code
Comments Smart: Explain why you wrote code, not what it does (what it does Must be clear from code same )
One function per task: Each function should do only one thing
Meaningful names: Use variable and function names that express their purpose
Consistent formatting: Use formatting brackets and the
Avoidrepetition: If found same code written in more from place, convert it to function
code simple: solution the simple the be best

 // ❌ Complex and unclear code

 function p(a,b,c){r=0;f=1;i=0;while(i<c){r+=a*f;f*=b;i++;}return r;}

 // ✅ Clear and meaningful code

 function calculateSeriesSum(firstTerm, ratio, termsCount) {

 let sum = 0;

 let currentTerm = firstTerm;

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

 sum += currentTerm;

 currentTerm *= ratio;

 }

 return sum;

 }

🚨 Common Syntax Mistakes and How to Avoid Them

Here are some common mistakes beginners make in JavaScript and how to avoid them:

 // 1. Forgetting the semicolon at the end of statements

 let x = 5 // ❌ It is preferred to adding ;

 let y = 10; // ✅

 // 2. Using mismatched quotes

 let name = 'Ahmed"; // ❌ quotes not matching

 let name = 'Ahmed'; // ✅ quotes matching

 let name = "Ahmed"; // ✅ quotes matching

 // 3. names Variables not valid

 let user-name = "Ahmed"; // ❌ contains a hyphen

 let userName = "Ahmed"; // ✅ camelCase

 let user_name = "Ahmed"; // ✅ snake_case (rare)

 // 4. Forgetting brackets in conditions

 if age > 18 // ❌ Forgetting brackets

 if (age > 18) { // ✅ brackets present

 // ...

 }

 // 5. Confusion between = and == and ===

 if (x = 5) { // ❌ assignment instead of comparison

 if (x == 5) { // ✅ comparison with value

 if (x === 5) { // ✅ comparison with value and type

text: Use a code editor like VS Code which shows syntax errors automatically .