BMI 계산기 핵심 로직: 체질량지수·정상 체중 범위·BMR 계산 구현
몸무게 숫자만 보는 것보다, BMI + 체중 분류 + 정상 체중 범위 + BMR를 함께 보는 편이 감량/증량 계획에 훨씬 실용적입니다.
이번 글은 직전 추가한 BMI 계산기의 핵심 로직을 실제 구현 코드 기준으로 정리한 노트입니다.
- 바로 사용: BMI 계산기
문제: BMI 숫자만 계산하면 실사용에서 부족한 이유
1) 숫자 해석이 어려움
BMI 값 하나만 나오면 사용자는 “그래서 정상인가?”를 다시 찾아봐야 합니다.
2) 목표 설정 정보가 부족함
BMI만으로는 현재 키 기준 정상 체중이 얼마인지 바로 알기 어렵습니다.
3) 부가 정보(BMR) 요구가 큼
체중 관리 사용자 대부분이 “하루 기초대사량”도 함께 확인하길 원합니다.
원리: 단순 공식 + 실사용 보강
핵심 계산은 고전 BMI 공식입니다.
const m = h / 100;
const bmi = w / (m * m);
여기에 실사용을 위해 아래를 덧붙였습니다.
- BMI 구간 자동 분류
- 키 기준 정상 체중 범위(아시아 성인 기준 18.5~22.9)
- 선택 입력(나이/성별) 시 BMR 계산
핵심 코드 1: BMI 분류와 정상 체중 범위 계산
const classify = (bmi) => {
if (bmi < 18.5) return '저체중';
if (bmi < 23) return '정상';
if (bmi < 25) return '과체중';
if (bmi < 30) return '비만';
return '고도비만';
};
const m = h / 100;
const bmi = w / (m * m);
const normalMin = 18.5 * m * m;
const normalMax = 22.9 * m * m;
이렇게 하면 결과 카드에서 “현재 상태”와 “목표 범위”를 동시에 제공합니다.
핵심 코드 2: BMR(기초대사량) 계산 조건부 처리
BMR은 나이/성별이 있어야 정확성이 높기 때문에 선택 입력으로 처리했습니다.
const calcBmr = ({ w, h, a, sx }) => {
if (!(a > 0) || !sx) return null;
if (sx === 'male') return 10 * w + 6.25 * h - 5 * a + 5;
if (sx === 'female') return 10 * w + 6.25 * h - 5 * a - 161;
return null;
};
입력이 없으면 강제로 0을 보여주지 않고, 안내 문구를 보여 UX 혼동을 줄였습니다.
예외 처리: 입력 검증·범위 제한·복사 폴백
입력 누락/범위 오류 방어
키·몸무게가 없거나 비정상 범위면 계산 대신 상태 메시지를 노출합니다.
const RANGE = {
height: { min: 50, max: 260 },
weight: { min: 10, max: 400 },
age: { min: 1, max: 120 }
};
나이 예외 처리
나이가 비어 있으면 BMR 미계산(정상 안내), 범위 밖이면 경고 메시지를 출력합니다.
클립보드 실패 폴백
브라우저 권한 이슈로 navigator.clipboard가 실패해도 textarea + execCommand('copy')로 복사를 유지합니다.
내부 링크: 같이 쓰면 좋은 계산기
요약
BMI 계산기 구현의 핵심은 다음 5가지입니다.
- BMI 공식 자체는 단순하게 유지
- 결과 해석(저체중~고도비만) 자동화
- 키 기반 정상 체중 범위를 함께 제시
- 나이/성별 선택 입력 시 BMR 조건부 계산
- 입력 검증 및 복사 폴백으로 안정성 강화
덕분에 “숫자 하나”가 아니라, 바로 실행 가능한 체중 관리 의사결정 정보를 제공할 수 있습니다.
FAQ
Q1. BMI가 같아도 체형이 다른 이유는 뭔가요?
BMI는 키·몸무게 기반 지표라 근육량/체지방률을 직접 반영하지 않습니다. 참고 지표로 보고, 필요하면 체성분 데이터와 함께 해석하는 것이 좋습니다.
Q2. 정상 체중 범위는 어떤 기준인가요?
이 도구는 아시아 성인 기준 BMI 18.5~22.9를 사용해 키별 정상 체중 범위를 계산합니다.
Q3. 나이/성별을 안 넣으면 계산이 틀리나요?
BMI 계산은 정상 동작합니다. 다만 BMR은 나이/성별이 필요하므로 해당 값은 안내 문구로 대체됩니다.