Free tools Windows power users keep installed
One-click scans. No signup required.
JavaScript variables give values names, operators combine or compare values, and functions package reusable behavior. Learn how they work by predicting each example before reading its result.
How do JavaScript variables, operators, and functions work?
Variables are named bindings: they let your code refer to a value. Operators build expressions that calculate or compare values, and functions group statements so you can run the same task with different inputs. MDN summarizes the declaration choices: “Variables in JavaScript are declared using one of three keywords: let, const, or var.” MDN’s declarations guide explains the distinction.
As an Amazon Associate I earn from qualifying purchases.
Declare variables with const and let
Declaration versus initialization
A declaration introduces a binding; initialization gives it an initial value. In let score = 0;, let declares the name and = 0 initializes it. A let binding can also be declared without an initializer, in which case its value is undefined until assigned. A const binding must be initialized when declared.
let score;
console.log(score); // undefined
score = 0;
const player = "Mina";Choose based on reassignment
Use const when you do not plan to assign a different value to the binding; use let when reassignment is part of the logic. const does not make an object immutable: it prevents replacing the binding, not changing the object’s properties.
#1 Best Overall
const settings = {};
settings.theme = "dark"; // allowed
// settings = {}; // TypeError: cannot reassign a const binding
let attempts = 0;
attempts = attempts + 1; // allowedPredict the value of settings.theme after the assignment. It is "dark": the object changed, while the binding still points to the same object.
Block scope and the difference from var
A block is code enclosed in braces, such as an if body. Bindings declared with let or const inside a block are not available outside it. var is scoped to its containing function, or to the global scope when declared at the top level, rather than to the nearest block.
if (true) {
let message = "inside";
var count = 1;
}
// console.log(message); // ReferenceError: message is block-scoped
console.log(count); // 1There is also a timing difference. A let or const binding cannot be used before its declaration has been processed in that block; trying to do so throws a ReferenceError. A var declaration is hoisted and starts as undefined, but its assignment stays where it appears.
Rank #2
console.log(total); // undefined
var total = 5;
// console.log(rate); // ReferenceError
let rate = 2;For beginner code, prefer const and let so the scope and reassignment behavior are explicit. MDN’s guide to variable scope has further detail.
Use operators to calculate and compare
Arithmetic, assignment, and precedence
An expression is code that evaluates to a value. Arithmetic operators include +, -, *, /, % (remainder), and ** (exponentiation). The assignment operator = stores a value in a binding; it does not test whether two values are equal. Compound assignment such as += updates a binding using its current value.
let points = 10;
points += 3; // points is now 13
const result = 1 + 2 * 3; // 7
const grouped = (1 + 2) * 3; // 9Predict both results before checking the comments. Multiplication takes precedence over addition, so result is 7. Parentheses make the addition happen first, so grouped is 9. Use parentheses when they make the intended grouping easier to read. See MDN’s expressions and operators guide.
+ can add or join strings
The plus operator adds when it is working with numbers, but it can concatenate (join) strings. Evaluation proceeds from left to right, so the point at which a string enters the expression matters.
The Tool Desk
Outbyte Driver Updater FREEFix the driver behind crashes, sound loss and screen glitchesFind Drivers →Outbyte PC Repair FREEClear out junk files and repair common Windows errorsFree Scan →const first = "3" + 4 + 5; // "345"
const second = 3 + 4 + "5"; // "75"In the first expression, the initial string causes the following values to be joined as text. In the second, 3 + 4 is calculated as 7 first; then that number is joined to the string "5". When you intend arithmetic, make sure the values are numbers.
Prefer strict comparisons in introductory examples
Use === to test equality without converting values of different types, and !== for strict inequality. This is a clear default while learning; it is not a claim that every JavaScript codebase must use the same style in every case.
Rank #4
console.log(123 == "123"); // true
console.log(123 === "123"); // falseThe loose comparison == converts the string in this example before comparing. Strict equality keeps the number and string distinct, which avoids many surprises. MDN’s equality-operator reference describes the comparison operators.
Define a function, call it, and return a result
A function is a reusable set of statements that performs a task or calculates a value. A function declaration names the function and specifies its parameters and body. Declaring it describes what it will do; calling it runs the body.
function double(number) {
return number * 2;
}
const result = double(4); // 8Here, number is the parameter—the name the function uses for an input. The value 4 is the argument passed when calling double(4). The return statement supplies the calculated result to the caller, so result becomes 8. If a function finishes without an explicit return value, its result is undefined.
Function declarations can be called before their textual declaration because declarations are hoisted. A function expression assigned to a const does not work that way: the binding must be initialized before it is called. For a first example, keeping the declaration above the call makes the execution order easy to follow. Read more in MDN’s functions guide.
Mini-exercise: calculate a price total
Predict the output before reading the comment. This example uses a function to calculate a total, a parameter for its input, an operator to multiply, and a const binding for the result.
function priceWithTax(price, taxRate) {
return price * (1 + taxRate);
}
const total = priceWithTax(20, 0.1);
console.log(total); // 22The expression 1 + taxRate is 1.1; multiplying it by 20 gives 22. The function returns that value, and the call stores it in total. For optional deeper practice, the official site offers Eloquent JavaScript, 4th edition, including chapters on operators and functions; it is available to read online and as a paperback.
Quick wins for a faster PC:
Scan for outdated or missing drivers - takes under a minuteDriver Scan →Repair Windows errors before they cause bigger problemsFix Now →Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
