javascript
examples
examples.js⚡javascript
/**
* 14.1 Number Fundamentals - Examples
*
* JavaScript numbers are IEEE 754 double-precision floating-point values.
* This module covers number creation, special values, methods, and precision.
*/
// ============================================
// 1. CREATING NUMBERS
// ============================================
console.log('=== Creating Numbers ===');
// Integer literals
const integer = 42;
const negative = -17;
const zero = 0;
// Floating-point literals
const float = 3.14159;
const smallFloat = 0.001;
const noLeadingZero = 0.5; // Same as 0.5
// Scientific notation
const scientific = 2.998e8; // 299,800,000 (speed of light in m/s)
const tiny = 1.6e-19; // 0.00000000000000000016
console.log('Scientific notation:', scientific); // 299800000
console.log('Tiny number:', tiny);
// Different bases
const binary = 0b1010; // 10 in binary
const octal = 0o755; // 493 in octal (Unix permissions)
const hex = 0xff; // 255 in hexadecimal
console.log('Binary 0b1010:', binary); // 10
console.log('Octal 0o755:', octal); // 493
console.log('Hex 0xFF:', hex); // 255
// Numeric separators (ES2021) - improves readability
const billion = 1_000_000_000;
const creditCard = 1234_5678_9012_3456n; // BigInt with separators
const hexColor = 0xff_ff_ff;
console.log('Billion with separators:', billion); // 1000000000
// Number constructor
const fromString = Number('42'); // 42
const fromFloat = Number('3.14'); // 3.14
const fromBool = Number(true); // 1
const fromNull = Number(null); // 0
const fromUndefined = Number(undefined); // NaN
console.log("Number('42'):", fromString);
console.log('Number(true):', fromBool);
console.log('Number(undefined):', fromUndefined);
// ============================================
// 2. SPECIAL NUMBER VALUES
// ============================================
console.log('\n=== Special Number Values ===');
// Infinity
console.log('1 / 0:', 1 / 0); // Infinity
console.log('-1 / 0:', -1 / 0); // -Infinity
console.log('Infinity + 1:', Infinity + 1); // Infinity
console.log('Infinity * -1:', Infinity * -1); // -Infinity
console.log('Infinity - Infinity:', Infinity - Infinity); // NaN
console.log('Infinity / Infinity:', Infinity / Infinity); // NaN
// Checking for Infinity
console.log('isFinite(42):', isFinite(42)); // true
console.log('isFinite(Infinity):', isFinite(Infinity)); // false
console.log('Number.isFinite(42):', Number.isFinite(42)); // true
// NaN (Not a Number)
console.log('\n--- NaN ---');
console.log('0 / 0:', 0 / 0); // NaN
console.log("'hello' * 2:", 'hello' * 2); // NaN
console.log('Math.sqrt(-1):', Math.sqrt(-1)); // NaN
console.log("parseInt('abc'):", parseInt('abc')); // NaN
// NaN quirks - it's not equal to anything, including itself!
console.log('NaN === NaN:', NaN === NaN); // false (!)
console.log('typeof NaN:', typeof NaN); // "number" (!)
// Checking for NaN - use Number.isNaN(), not isNaN()
console.log('\n--- Checking NaN ---');
console.log('isNaN(NaN):', isNaN(NaN)); // true
console.log("isNaN('hello'):", isNaN('hello')); // true (coerces first!)
console.log("Number.isNaN('hello'):", Number.isNaN('hello')); // false (no coercion)
console.log('Number.isNaN(NaN):', Number.isNaN(NaN)); // true
// ============================================
// 3. NUMBER METHODS
// ============================================
console.log('\n=== Number Methods ===');
// --- Checking Methods ---
console.log('--- Checking Methods ---');
// Number.isNaN() - strict NaN check
console.log('Number.isNaN(NaN):', Number.isNaN(NaN)); // true
console.log('Number.isNaN(123):', Number.isNaN(123)); // false
console.log("Number.isNaN('NaN'):", Number.isNaN('NaN')); // false
// Number.isFinite() - checks for finite number
console.log('\nNumber.isFinite(42):', Number.isFinite(42)); // true
console.log('Number.isFinite(Infinity):', Number.isFinite(Infinity)); // false
console.log('Number.isFinite(NaN):', Number.isFinite(NaN)); // false
console.log("Number.isFinite('42'):", Number.isFinite('42')); // false (no coercion)
// Number.isInteger() - checks for integer
console.log('\nNumber.isInteger(5):', Number.isInteger(5)); // true
console.log('Number.isInteger(5.0):', Number.isInteger(5.0)); // true (5.0 === 5)
console.log('Number.isInteger(5.5):', Number.isInteger(5.5)); // false
console.log("Number.isInteger('5'):", Number.isInteger('5')); // false
// Number.isSafeInteger() - checks safe integer range
console.log('\nNumber.isSafeInteger(42):', Number.isSafeInteger(42)); // true
console.log(
'Number.isSafeInteger(2**53 - 1):',
Number.isSafeInteger(2 ** 53 - 1)
); // true
console.log('Number.isSafeInteger(2**53):', Number.isSafeInteger(2 ** 53)); // false
// --- Conversion Methods ---
console.log('\n--- Conversion Methods ---');
const num = 255;
// toString() - convert to string with optional radix
console.log('(255).toString():', num.toString()); // "255"
console.log('(255).toString(2):', num.toString(2)); // "11111111" (binary)
console.log('(255).toString(8):', num.toString(8)); // "377" (octal)
console.log('(255).toString(16):', num.toString(16)); // "ff" (hex)
console.log('(255).toString(36):', num.toString(36)); // "73" (base 36)
// toFixed() - fixed decimal places (returns string)
const pi = 3.14159265;
console.log('\npi.toFixed(2):', pi.toFixed(2)); // "3.14"
console.log('pi.toFixed(4):', pi.toFixed(4)); // "3.1416" (rounded)
console.log('pi.toFixed(0):', pi.toFixed(0)); // "3"
console.log('(1.005).toFixed(2):', (1.005).toFixed(2)); // "1.00" (!)
// toPrecision() - total significant digits
const big = 123456.789;
console.log('\nbig.toPrecision(4):', big.toPrecision(4)); // "1.235e+5"
console.log('big.toPrecision(6):', big.toPrecision(6)); // "123457"
console.log('big.toPrecision(10):', big.toPrecision(10)); // "123456.7890"
// toExponential() - scientific notation
const sci = 123456;
console.log('\nsci.toExponential():', sci.toExponential()); // "1.23456e+5"
console.log('sci.toExponential(2):', sci.toExponential(2)); // "1.23e+5"
console.log('sci.toExponential(4):', sci.toExponential(4)); // "1.2346e+5"
// ============================================
// 4. PARSING NUMBERS
// ============================================
console.log('\n=== Parsing Numbers ===');
// parseInt() - parses integers
console.log('--- parseInt ---');
console.log("parseInt('42'):", parseInt('42')); // 42
console.log("parseInt('42.9'):", parseInt('42.9')); // 42 (ignores decimal)
console.log("parseInt('42px'):", parseInt('42px')); // 42 (stops at non-digit)
console.log("parseInt('px42'):", parseInt('px42')); // NaN (must start with digit)
console.log("parseInt(' 42 '):", parseInt(' 42 ')); // 42 (trims whitespace)
// parseInt with radix
console.log('\n--- parseInt with radix ---');
console.log("parseInt('0xFF'):", parseInt('0xFF')); // 255 (auto-detects hex)
console.log("parseInt('ff', 16):", parseInt('ff', 16)); // 255
console.log("parseInt('1010', 2):", parseInt('1010', 2)); // 10 (binary)
console.log("parseInt('777', 8):", parseInt('777', 8)); // 511 (octal)
console.log("parseInt('zz', 36):", parseInt('zz', 36)); // 1295 (base 36)
// parseFloat() - parses floating-point
console.log('\n--- parseFloat ---');
console.log("parseFloat('3.14'):", parseFloat('3.14')); // 3.14
console.log("parseFloat('3.14.15'):", parseFloat('3.14.15')); // 3.14
console.log("parseFloat(' 3.14 '):", parseFloat(' 3.14 ')); // 3.14
console.log("parseFloat('3.14e2'):", parseFloat('3.14e2')); // 314
console.log("parseFloat('.5'):", parseFloat('.5')); // 0.5
// Number() vs parseInt/parseFloat
console.log('\n--- Number() vs parseInt ---');
console.log("Number('42px'):", Number('42px')); // NaN (strict)
console.log("parseInt('42px'):", parseInt('42px')); // 42 (lenient)
console.log("Number(''):", Number('')); // 0
console.log("parseInt(''):", parseInt('')); // NaN
console.log('Number(null):', Number(null)); // 0
console.log('parseInt(null):', parseInt(null)); // NaN
console.log('Number(true):', Number(true)); // 1
console.log('parseInt(true):', parseInt(true)); // NaN
// ============================================
// 5. FLOATING-POINT PRECISION
// ============================================
console.log('\n=== Floating-Point Precision ===');
// The classic problem
console.log('0.1 + 0.2:', 0.1 + 0.2); // 0.30000000000000004
console.log('0.1 + 0.2 === 0.3:', 0.1 + 0.2 === 0.3); // false (!)
// More examples
console.log('0.1 + 0.7:', 0.1 + 0.7); // 0.7999999999999999
console.log('1.1 + 1.3:', 1.1 + 1.3); // 2.4000000000000004
// Solution 1: Epsilon comparison
function almostEqual(a, b, epsilon = Number.EPSILON) {
return Math.abs(a - b) < epsilon;
}
console.log('\nalmostEqual(0.1 + 0.2, 0.3):', almostEqual(0.1 + 0.2, 0.3)); // true
// Solution 2: Round to fixed decimals
function roundTo(num, decimals) {
const factor = Math.pow(10, decimals);
return Math.round(num * factor) / factor;
}
console.log('roundTo(0.1 + 0.2, 10):', roundTo(0.1 + 0.2, 10)); // 0.3
// Solution 3: toFixed for display
console.log('(0.1 + 0.2).toFixed(1):', (0.1 + 0.2).toFixed(1)); // "0.3"
// Solution 4: Integer arithmetic for money
console.log('\n--- Integer Arithmetic for Money ---');
const priceInCents = 199 + 299; // Work in cents
console.log('Price in cents:', priceInCents); // 498
console.log('Price in dollars:', priceInCents / 100); // 4.98
// ============================================
// 6. BIGINT FOR LARGE INTEGERS
// ============================================
console.log('\n=== BigInt ===');
// Safe integer limits
console.log('MAX_SAFE_INTEGER:', Number.MAX_SAFE_INTEGER); // 9007199254740991
console.log('Beyond safe range:', Number.MAX_SAFE_INTEGER + 1); // 9007199254740992
console.log('Same as +2:', Number.MAX_SAFE_INTEGER + 2); // 9007199254740992 (!)
// BigInt literals
const bigNum = 9007199254740991n;
const alsoBig = BigInt('9007199254740992');
console.log('\nBigInt literal:', bigNum);
console.log('BigInt from string:', alsoBig);
// BigInt operations
console.log('\nbigNum + 1n:', bigNum + 1n);
console.log('bigNum * 2n:', bigNum * 2n);
console.log('bigNum / 3n:', bigNum / 3n); // Truncates, no decimals
// Cannot mix BigInt and Number directly
// console.log(bigNum + 1); // TypeError!
// Must convert explicitly
console.log('bigNum + BigInt(1):', bigNum + BigInt(1));
console.log('Number(bigNum) + 1:', Number(bigNum) + 1);
// Comparisons work between BigInt and Number
console.log('\nbigNum > 1000:', bigNum > 1000); // true
console.log('bigNum === 9007199254740991n:', bigNum === 9007199254740991n); // true
console.log('bigNum == 9007199254740991:', bigNum == 9007199254740991); // true (loose)
// ============================================
// 7. NUMBER CONSTANTS
// ============================================
console.log('\n=== Number Constants ===');
console.log('Number.MAX_VALUE:', Number.MAX_VALUE);
console.log('Number.MIN_VALUE:', Number.MIN_VALUE);
console.log('Number.MAX_SAFE_INTEGER:', Number.MAX_SAFE_INTEGER);
console.log('Number.MIN_SAFE_INTEGER:', Number.MIN_SAFE_INTEGER);
console.log('Number.POSITIVE_INFINITY:', Number.POSITIVE_INFINITY);
console.log('Number.NEGATIVE_INFINITY:', Number.NEGATIVE_INFINITY);
console.log('Number.NaN:', Number.NaN);
console.log('Number.EPSILON:', Number.EPSILON);
// ============================================
// 8. PRACTICAL PATTERNS
// ============================================
console.log('\n=== Practical Patterns ===');
// Clamp a number to a range
function clamp(num, min, max) {
return Math.min(Math.max(num, min), max);
}
console.log('clamp(150, 0, 100):', clamp(150, 0, 100)); // 100
console.log('clamp(-50, 0, 100):', clamp(-50, 0, 100)); // 0
console.log('clamp(50, 0, 100):', clamp(50, 0, 100)); // 50
// Check if a value is numeric
function isNumeric(value) {
return !isNaN(parseFloat(value)) && isFinite(value);
}
console.log("\nisNumeric('42'):", isNumeric('42')); // true
console.log("isNumeric('42px'):", isNumeric('42px')); // true (parseFloat works)
console.log("isNumeric('hello'):", isNumeric('hello')); // false
// Format number with commas (locale-aware)
function formatWithCommas(num) {
return num.toLocaleString();
}
console.log('\nformatWithCommas(1234567):', formatWithCommas(1234567));
// Currency formatting
function formatCurrency(amount, currency = 'USD', locale = 'en-US') {
return new Intl.NumberFormat(locale, {
style: 'currency',
currency: currency,
}).format(amount);
}
console.log('formatCurrency(1234.56):', formatCurrency(1234.56));
console.log(
"formatCurrency(1234.56, 'EUR', 'de-DE'):",
formatCurrency(1234.56, 'EUR', 'de-DE')
);
// Percentage formatting
function formatPercent(decimal, minimumFractionDigits = 1) {
return new Intl.NumberFormat('en-US', {
style: 'percent',
minimumFractionDigits: minimumFractionDigits,
}).format(decimal);
}
console.log('\nformatPercent(0.1234):', formatPercent(0.1234)); // "12.3%"
console.log('formatPercent(0.5):', formatPercent(0.5)); // "50.0%"
// Random integer in range
function randomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
console.log('\nRandom int 1-10:', randomInt(1, 10));
// Round to nearest multiple
function roundToNearest(num, multiple) {
return Math.round(num / multiple) * multiple;
}
console.log('\nroundToNearest(17, 5):', roundToNearest(17, 5)); // 15
console.log('roundToNearest(23, 5):', roundToNearest(23, 5)); // 25
// ============================================
// 9. EDGE CASES AND GOTCHAS
// ============================================
console.log('\n=== Edge Cases and Gotchas ===');
// +0 and -0
console.log('+0 === -0:', +0 === -0); // true
console.log('1 / +0:', 1 / +0); // Infinity
console.log('1 / -0:', 1 / -0); // -Infinity
console.log('Object.is(+0, -0):', Object.is(+0, -0)); // false
// Octal gotcha in older JavaScript
// parseInt('08') was 0 in older JS, now it's 8
console.log("parseInt('08'):", parseInt('08')); // 8
// toFixed rounding issues
console.log('(1.005).toFixed(2):', (1.005).toFixed(2)); // "1.00" not "1.01"!
// Solution: use Math.round
console.log('Math.round(1.005 * 100) / 100:', Math.round(1.005 * 100) / 100);
// Very large or very small
console.log('\nNumber.MAX_VALUE * 2:', Number.MAX_VALUE * 2); // Infinity
console.log('Number.MIN_VALUE / 2:', Number.MIN_VALUE / 2); // 0
console.log('\n=== Examples Complete ===');