JavaScript Modulo (%): Remainder Operator Explained
Contents
- Basic examples
- Common uses
- Even or odd
- Do something every Nth time
- Wrap around an array (carousels, cycling)
- Convert seconds to minutes and seconds
- Negative numbers: remainder vs modulo
- The difference
- A true modulo function
- Things to watch out for
- Floating-point results
- The %= shorthand and BigInt
- CSS has mod() and rem() too
- FAQ
The % operator returns the remainder left over when one number is divided by another:
10 % 3 is 1, because 3 goes into 10 three times (9), with 1 left over.
People call it “modulo”, but in JavaScript it’s technically the remainder operator, and the difference shows up with negative numbers. More on that below.
Basic examples
10 % 3; // 1
10 % 5; // 0 (divides evenly)
3 % 10; // 3 (smaller than the divisor: the number itself)
7.5 % 2; // 1.5 (works with decimals)
10 % 0; // NaNCommon uses
Even or odd
A number is even when dividing by 2 leaves nothing. Compare against 0 rather than 1, so negative odd numbers (which give -1) are handled too.
const isEven = (n) => n % 2 === 0;
const isOdd = (n) => n % 2 !== 0;
isEven(4); // true
isOdd(-3); // true (-3 % 2 is -1, not 1)Do something every Nth time
Add a separator every 3 items, highlight every 5th row, run something every 10th iteration.
items.forEach((item, i) => {
if ((i + 1) % 3 === 0) {
console.log('3 more items done');
}
});Wrap around an array (carousels, cycling)
Going past the last index jumps back to the first. The + length in the “previous” version keeps the result positive when going below 0.
const slides = ['a', 'b', 'c', 'd'];
let i = 0;
const next = () => (i = (i + 1) % slides.length);
const prev = () => (i = (i - 1 + slides.length) % slides.length);
next(); next(); next(); next(); // back to 0
prev(); // 3, not -1Convert seconds to minutes and seconds
Divide for the bigger unit, take the remainder for what’s left. The same pattern converts cents to dollars or minutes to hours.
function formatTime(totalSeconds) {
const minutes = Math.floor(totalSeconds / 60);
const seconds = totalSeconds % 60;
return `${minutes}:${String(seconds).padStart(2, '0')}`;
}
formatTime(125); // "2:05"Negative numbers: remainder vs modulo
In JavaScript, the result of % takes the sign of the left number (the dividend). Mathematical modulo, and % in Python, always returns a result with the sign of the divisor.
The difference
// JavaScript
-7 % 3; // -1
7 % -3; // 1
// Python
// -7 % 3 → 2A true modulo function
When you need a result that’s always between 0 and the divisor (like wrapping an index or an angle), add the divisor and take the remainder again.
const mod = (n, m) => ((n % m) + m) % m;
mod(-7, 3); // 2
mod(-1, 4); // 3 → last index of a 4-item array
mod(370, 360); // 10 → normalize an angleThings to watch out for
Floating-point results
Decimals are stored in binary, so some remainders come out slightly off. Round the result, or work in whole numbers (cents instead of dollars).
0.3 % 0.1; // 0.09999999999999998
Math.round((0.3 % 0.1) * 1e10) / 1e10; // 0.1 (still not 0!)
// Work in integers instead
30 % 10; // 0The %= shorthand and BigInt
%= assigns the remainder back to the variable. % also works on BigInt values, but both sides must be BigInts.
let n = 17;
n %= 5; // 2
10n % 3n; // 1n
10n % 3; // TypeError: Cannot mix BigInt and other typesCSS has mod() and rem() too
Modern CSS includes the same math as functions: rem() works like JavaScript’s %, and mod() is the true modulo. They sit alongside calc(), min() and clamp().
.item {
rotate: mod(var(--angle), 360deg);
}FAQ
What does % mean in JavaScript?
It’s the remainder operator: a % b returns what’s left after dividing a by b as many whole times as possible.
Is % modulo or remainder in JavaScript?
Remainder. It matches modulo for positive numbers, but for negative numbers the result keeps the sign of the left operand. Use ((n % m) + m) % m for a true modulo.
How do I check if a number is divisible by another?
a % b === 0. For example, 15 % 5 === 0 is true.
What is 0 % n?
0, for any non-zero n. And n % 0 is NaN.
