Think of a subroutine as a little machine. A vending machine is useless if it can only ever hand you one fixed can of drink — you want to tell it which button you pressed, and get back whatever you chose. A subroutine works the same way: you feed data in, it does its job, and it passes a result back out.
Those two channels have names, and they are the whole of this page:
Together they turn a subroutine from a one-trick gadget into a reusable tool: one subroutine that works for many different inputs. Write it once, call it a thousand times with a thousand different values.
Here is a subroutine that finds the area of a rectangle — but only one rectangle, because
the numbers
Now give it two parameters, w and h. The values are no
longer fixed — they arrive when the subroutine is called. Press Run and
watch one subroutine handle three completely different rectangles:
The bit in the definition, (w: number, h: number), is the parameter
list: two named boxes that will hold whatever numbers get passed in. The
: number after each name is its type — it promises this box will
hold a number — and the : number after the brackets promises the subroutine
returns a number too.
People use these two words loosely, but in an exam they mean precise, different things — and it's easy marks to get them the right way round:
w and h above) — the empty slot;4 and 3) — the thing that fills the slot.A neat way to remember it: the parameter is part of the plan (the definition), and the argument is the actual value you argue for at call time. When the call runs, each argument is copied into its matching parameter, left to right.
In the definition function celsiusToFahrenheit(c: number), the name
c is the parameter. When you write the call
celsiusToFahrenheit(20), the value 20 is the
argument. As the subroutine runs, c is
celsiusToFahrenheit(100) and the very same parameter c now holds
A parameter carries data in; return carries a value out. The moment
a return runs, the subroutine stops and hands its value back to the
line that called it — where it can be printed, stored in a variable, or used in a bigger sum.
This celsiusToFahrenheit subroutine takes a temperature in Celsius and returns it in
Fahrenheit, using console.log:
A returned value doesn't have to be a number. Here isPositive takes a number and
returns a boolean — true or false — which is perfect
for asking a yes/no question:
The real power shows when the returned value of one call feeds straight into another piece of
logic. Below, isPositive is called inside a loop — the same tiny subroutine
reused on a whole list of numbers, each time with a different argument:
Five different arguments, one subroutine. That is the whole point of parameters and return values: you describe how to solve the problem once, then let the data vary.
1. Forgetting to return. A subroutine that never runs a
return statement doesn't hand back nothing-in-particular — it hands back the special
value undefined. This trips up beginners constantly, because the code looks
like it works: it does the calculation, it just never gives the answer back.
The fix is one line — return area; — and TypeScript will actually warn you here,
because you promised to return a number but never did. If a call seems to give back
nothing useful, check that every path through the subroutine ends in a return.
2. Argument order matters. Arguments fill the parameters left to right, so swapping two arguments swaps their meaning. For a subtraction or a division, that changes the answer completely:
divide(10, 2) is not the same as divide(2, 10). The
computer will never guess what you meant — it just pours the first argument into the first
parameter. Get the order right, every time.