Lesson 1 of 14

Lesson 01 — JavaScript basics for QA automation

Title: Variables, Types, Strings, Numbers, and Type Coercion

Description: In this lesson, you will learn the basic parts of JavaScript: variables, numbers, strings, and simple expressions. These are the same building blocks used in Playwright tests, assertions, and API responses.

Why it matters for QA: QA tests often fail when data types are mixed or used incorrectly. If you understand let and const, strings vs numbers, and undefined vs null, you can find bugs faster and write more reliable tests.

How to practice: Paste each snippet into the browser DevTools Console or a small Node file. In the console, use console.log(...) instead of alert(...).

1. Variables with `let`

You declare a name, then you can assign a value. With let, you can change the value later.

javascriptjavascript

// Declare, then assign
let ticketCount;
ticketCount = 5;
console.log(ticketCount);

// Declare and assign in one line
let priority = "high";
console.log(priority);

Several variables in one statement:

javascriptjavascript

let passed = 10, failed = 2, skipped = 1;
console.log(passed, failed, skipped);

// Or declare first, assign after
let a, b, c;
a = 1;
b = 2;
c = 3;
console.log(a + b + c);

Reassignment is normal for counters or state you update:

javascriptjavascript

let status = "pending";
console.log(status);
status = "done";
console.log(status);

2. Numbers and math operators

javascriptjavascript

let total = 7 + 8;
let doubled = 4 * 3;
let half = 9 / 3;

let x = 2;
let y = 5;
console.log(x + y);

let sum = x + y;
console.log(sum);

Precedence (multiplication/division before addition/subtraction, unless you use parentheses):

javascriptjavascript

console.log(4 + 4 * 3);   // 16, not 24
console.log((4 + 4) * 3); // 24

console.log(20 / 4 / 2);  // 2.5 (left to right for same precedence)

console.log(3 * (1 + 4)); // 15

console.log(0.25 + 0.75); // 1

let debt = -50;
console.log(debt);

let balance = 100;
console.log(-balance);

Remainder and power:

javascriptjavascript

console.log(17 % 5);   // 2
console.log(2 ** 8);   // 256
console.log(2 * 3 ** 2);  // 18 (exponent before multiply)
console.log((2 * 3) ** 2); // 36

3. Strings

Text in JavaScript is a string. You can use double or single quotes; pick one style and stay consistent in a project.

javascriptjavascript

let suite = "smoke";
console.log(suite);

let path = "api" + "/users";
console.log(path);

let part1 = "login";
let part2 = "form";
console.log(part1 + "_" + part2);

console.log("expected" + "!!!" + "actual");

let label = "count";
console.log(label + " " + "value");

console.log("Button text: 'Submit'"); // double quotes outside, single quotes inside
console.log('Error message: "Access denied"'); // single quotes outside, double quotes inside
console.log('User can\'t log in'); // escape apostrophe inside a single-quoted string
console.log("Expected title: \"Dashboard\""); // escape double quotes inside a double-quoted string

Length (useful when you assert on string size or trim logic):

javascriptjavascript

let selector = "#submit-button";
console.log(selector.length);

Template literals (backticks) — embed expressions with ${}:

javascriptjavascript

let env = "staging";
console.log(`Running on ${env}`);

let multi = `line one
line two`;
console.log(multi);

4. `undefined`, `null`, booleans

javascriptjavascript

let notSetYet;
console.log(notSetYet); // undefined — declared, never assigned

let emptyOnPurpose = null; // intentional "no value"
console.log(emptyOnPurpose);

let isVisible = true;
let hasError = false;
console.log(isVisible, hasError);

5. `NaN` and division by zero

javascriptjavascript

console.log("qty" * 3); // NaN — Not a Number

console.log(1 / 0);   // Infinity
console.log(-1 / 0);  // -Infinity

Reference error (typo or variable never declared — your test would throw the same way):

javascriptjavascript

// console.log(undefinedVariable); // ReferenceError in real run

6. Constants with `const`

Use const when the binding must not be reassigned (URLs, timeouts, role names).

javascriptjavascript

const DEFAULT_TIMEOUT = 30_000;
// DEFAULT_TIMEOUT = 10_000; // TypeError: invalid assignment

7. Type coercion — strings vs numbers

The + operator prefers string concatenation if either side is a string. Other operators (-, *, /, %) try to convert strings to numbers.

javascriptjavascript

console.log("7" + "3");   // "73" — string concat
console.log("7" + 3);   // "73"
console.log(7 + "3");   // "73"
console.log(7 + 3);     // 10

console.log("7" * "3"); // 21
console.log("7" - "3"); // 4
console.log("8" / "2"); // 4
console.log("9" % "4"); // 1

console.log("7x" * "2"); // NaN
console.log("7x" + "2"); // "7x2"

console.log("4" * 1 + "1" * 1); // 5 (numeric 4 + 1)
console.log("" + 2 + 9); // "29" — starts as string, then concat

console.log(Number("4") + Number("6")); // 10
console.log(4 + Number("6"));           // 10

Unary + turns a value into a number (handy for short conversions):

javascriptjavascript

let u = +"9";
let v = +"1";
console.log(u + v); // 10

Parsing text that contains digits and units (common in UI):

javascriptjavascript

console.log(parseInt("24px", 10));    // 24
console.log(parseFloat("9.5rem"));  // 9.5

Explicit string conversion:

javascriptjavascript

let id = 4;
let run = 2;
console.log(String(id) + String(run)); // "42"

let n = 98765;
console.log(n.length);           // undefined — numbers have no .length
console.log(String(n).length); // 5
console.log(String(false));    // "false"

8. Characters and immutability

Strings behave like read-only arrays of characters. You can read by index; assigning to an index does not change the string.

javascriptjavascript

let text = "hello";
console.log(text[0]); // "h"
console.log(text[1]); // "e"

text[0] = "H";
console.log(text); // still "hello" — primitives are immutable

console.log(text[text.length - 1]); // last character: "o"

let digits = "98";
console.log(digits[0] + digits[1]); // "98" (string concat!)

let fromNumber = String(9876);
console.log(fromNumber[0]); // "9"

9. Compound assignment and increment

javascriptjavascript

let retries = 1;
retries += 2;
console.log(retries); // 3

let retryCounter = 1;
retryCounter = retryCounter + 2;
retryCounter = retryCounter + 1;
console.log(retryCounter); // 4

let score = 5;
score -= 2;
console.log(score); // 3

let load = 6;
load /= 2;
console.log(load); // 3

Postfix vs prefix (++):

javascriptjavascript

let step = 0;
step += 1;
console.log(step); // 1

let i = 0;
console.log(i++); // prints 0, then i becomes 1
console.log(i);     // 1

let j = 0;
console.log(++j); // 1 — increment first, then use value

10. Floating point and display

Binary floating point cannot represent every decimal exactly—same as in other languages. For display only, you can round:

javascriptjavascript

let tax = 0.1 + 0.2;
console.log(tax);           // 0.30000000000000004
console.log(tax.toFixed(2)); // string "0.30"

For money or strict comparisons in real projects, use integers (cents) or a decimal library—not toFixed alone for business logic.

11. JavaScript has 8 data types: 7 primitive and 1 non-primitive.

Primitive Types

Type	Description	Example
string	Text data	"java", 'script', `template`
number	Integers, floats	31, 3.14159, -9, NaN, Infinity, -Infinity
bigint	Arbitrarily large integers	703241n
boolean	Logical	true, false
undefined	Variable declared but not assigned	undefined
null	Intentional absence of value	null
symbol	Unique, immutable identifier	Symbol("id")

Non-Primitive Type

Type	Description	Example
object	Collections of key-value pairs	{}, [], function

Checking Types

typeof "javascript" // "string"
typeof 31 // "number"
typeof true // "boolean"
typeof undefined // "undefined"
typeof null // "object" ← famous bug, null is NOT really an object
typeof Symbol('id') // "symbol"
typeof 10n // "bigint"
typeof {} // "object"
typeof [] // "object" ← arrays are objects
typeof function(){} // "object" ← functions are objects

Official docs

Quick recap

Topic	Takeaway for QA automation
`let` / `const`	Mutable state vs fixed config
`+` with strings	Easy to accidentally concatenate instead of add
`Number`, `+`	Normalize text from DOM/API before math
`undefined`	Often means “forgot to assign” or missing optional field
`null`	Intentionally empty
Template strings	Readable messages and dynamic locators when safe

Suggested exercises

Declare browserName, version, and log them in one line using a template literal.
Given let raw = " 42 items"; strip spaces, parse the number, and add 1 (watch for NaN if parsing fails).
Predict then run: console.log("1" + 2 + 3) vs console.log(1 + 2 + "3").
Explain in one sentence why "" + 1 + 0 is "10" and not 1.

Homework

Short tasks (about 10–15 minutes). Click a task title to reveal the prompt.

Task 1: run banner

Declare const project = "smoke" and let run = 1. Increment run by one, then log a single line with a template literal so the output looks like: Project smoke, run #2 (the run number must come from the variable).

Task 2: predict coercion

Without running code, write down the results of "5" - 2 and "5" + 2. Run both in the console and explain the difference in one sentence.

Task 3: unary plus

Use unary + to turn "12" and "8" into numbers and log their sum as 20.

Task 4: floating display

Set let x = 0.1 + 0.2 and log x raw, then log x.toFixed(2). In one sentence, say what type toFixed returns.

Task 5: digits count

Given let ticketId = 40402, log how many characters the number has when written in decimal (hint: String(...).length).

Task 6: compound assignment

Start with let retries = 0. Use += twice (add 1, then add 2) and log retries. Predict the value before you run it.

Task 7: safe numeric addition

Create let rawA = "15" and let rawB = "5". Convert both to numbers explicitly, then log their sum.

Task 8: increment operator behavior

Set let value = 3. Log value++ and then value on the next line. In one sentence, explain why the two logs differ.

Lesson 01 — JavaScript basics for QA automation

1. Variables with let

2. Numbers and math operators

3. Strings

4. undefined, null, booleans

5. NaN and division by zero

6. Constants with const

7. Type coercion — strings vs numbers

8. Characters and immutability

9. Compound assignment and increment

10. Floating point and display

11. JavaScript has 8 data types: 7 primitive and 1 non-primitive.

Official docs

Quick recap

Suggested exercises

Homework

1. Variables with `let`

4. `undefined`, `null`, booleans

5. `NaN` and division by zero

6. Constants with `const`