Javascript_계산기

김덕근·2023년 2월 25일
0

JAVASCRIPT

목록 보기
5/18

button태그에서

매개변수(파라미터) 전달값을 +,-,*,/,%

const n1 = Number(num1.value);
const n2 = Number(num2.value);
const result = document.getElementById("result");

function calc(op) {
    // op 에는 +,-,*,/,% 중 하나가 전달 됨
	// 숫자형으로 형변환
    const n1 = Number(num1.value);
    const n2 = Number(num2.value);

    switch(op) {
        case '+' : result.innerText = n1 + n2; break;
        case '-' : result.innerText = n1 - n2; break;
        case '*' : result.innerText = n1 * n2; break;
        case '/' : result.innerText = n1 / n2; break;
        case '%' : result.innerText = n1 % n2; break;
    }
}

button태그에서

매개변수(파라미터) 전달값을 this로

const result = document.getElementById("result");

function calc(btn) {
    // op 에는 +,-,*,/,% 중 하나가 전달 됨

    console.log(btn);

    const n1 = Number(num1.value);
    const n2 = Number(num2.value);

    const op = btn.innerText; // 클릭된 버튼에 작성된 내용을 얻어옴
                            // + - * / %

    switch(op) {
        case '+' : result.innerText = n1 + n2; break;
        case '-' : result.innerText = n1 - n2; break;
        case '*' : result.innerText = n1 * n2; break;
        case '/' : result.innerText = n1 / n2; break;
        case '%' : result.innerText = n1 % n2; break;
    }
}

switch()문 대신 사용 가능한 것

eval("코드 형식의 문자열")
-> 매개변수의 문자열을 JS 코드로 해석/수행하는 함수
-> 속도가 느림 + 보안 이슈로 인해 사용 지양(사용하지말것)
result.innerText = eval(n1 + op + n2);

new Function() 사용

result.innerText = new Function("return " + n1 + op + n2)();
주의 사항!!! return 뒤에 스페이스 한칸 꼭 해줄 것!!!

profile
안녕하세요!

0개의 댓글