증감 연산자는 숫자형 데이터를 1씩 증가시키는 증가연산자(++) 1씩 감소 시키는 감소연산자(--)가 있습니다. 증감 연산자는 앞에서 배웠던 다른 연산자와 다르게 피연산자가 1개만 필요한 '단항연산자'입니다. 즉, 증감 연산자는 스스로 연산하는 연산자 입니다. 증감 연산자는 기호가 어디에 오느냐에 따라서 계산 방식이 달라집니다.
(기본형) 1. 변수--; 또는 --변수; 2. 변수++; 또는 ++변수;
전위 연산과 후위 연산
증감연산자에서 기호가 변수의 앞에 오면 '전위연산' 변수의 뒤에 오면 '후위연산' 이라고 부릅니다.
1. 전위 연산 : var A = ++B => 변수 B의 값을 먼저 1증가시킨 후 A에 대입됩니다. 2. 후위 연산 : var A = B++ => 변수 B의 값을 먼저 A애 대입시킨 후, B가 1증가합니다.
전위 연산과 후위 연산 사용해보기
전위 연산과 후위 연산 입력 예시
var num1 = 10;
var num2 = 20;
num1--;
document.write("num1은? ", num1, "<br>");
num1++;
document.write("num1은? ", num1, "<br>");
var result = num2++;
document.write("result는? ", result, "<br>");
document.write("num2은? ", num2, "<br>");
result = ++num2;
document.write("result는? ", result, "<br>");
비교 연산자
두 데이터를 '크다' , '작다', '같다'와 같이 비교할 때 사용합니다. 연산된 결과값은 true(참) 또는 false(거짓)으로 반환됩니다.
(기본형) 1 A > B : A는 B보다 크다. (=초과) 2. A < B : A는 B보다 작다. (=미만) 3. A >= B : A는 B보다 크거나 같다. (=이상) 4. A <=B : A는 B보다 작거나 같다. (=이하) 5. A == B : A는 B와 같다. => ==은 느슨한 비교입니다. 숫자를 비교할 경우 자료형은 숫자형이든 문자형이든 상관하지 않고 표기 된 숫자만 일치하면 true를 반환합니다. 예를 들어 "10" 과 10은 표기 된 숫자가 같으므로 true를 반환합니다. 6. A === B : A는 B와 같다. => ===은 엄격한 비교입니다. 숫자를 비교할 경우 표기 된 숫자와 자료형까지 모두 일치해야만 true를 반환합니다. 예를 들어 "10" 과 10은 표기 된 숫자는 같지만 자료형이 다르므로 false를 반환합니다. 7. A ! = B : A는 B와 다르다. => !=은 느슨한 비교입니다. 숫자를 비교할 경우 자료형은 숫자형이든 문자형이든 상관하지 않고 표기 된 숫자만 다르면 true를 반환합니다. 예를 들어 "10" 과 10은 표기 된 숫자가 같으므로 false를 반환합니다. 8. A !== B : A는 B와 다르다. => !==은 엄격한 비교입니다. 숫자를 비교할 경우 반드시 표기 된 숫자 또는 자료형이 일치하지 않을 때 true가 반환됩니다. 예를 들어 "10"와 10은 표기 된 숫자는 같지만 자료형이 다르므로 true를 반환합니다.
비교 연산자 사용해보기
비교 연산자 입력 예시
var k = 10;
var m = "10";
k == 10; // true
k = "10"; // true
m === 10; //false
m === "10"; //true
논리 연산자
논리 연산자에는 ||(or), &&(and), !(not) 연산자가 있습니다. 논리 연산자는 피연산자가 논리형 데이터인 true 또는 false로 나눠지는 데이터를 피연산자로 사용하고, 결과값은 논리형 데이터가 최종 반환됩니다. ||(or)연산자는 피연산자 중 하나라도 true가 있으면 true로 최종값을 반환하고, &&연산자는 피연산자 중 하나라도 false가 있으면 최종값을 false로 반환합니다. 즉 &&연산자는 모든 피연산자가 true여야만 true값을 최종 반환합니다. !(not)은 논리부정연산자로 단항 연산자이며. 최종 결과가 true면 false를 반환하고 false면 true를 반환합니다.
연산자 우선순위
연산자가 여러 개가 있을 경우 먼저 계산해야 하는 것을 연산자의 우선순위라고 합니다. 예를 들어 2+(1+3)*5 이런식이 있다고 할 때 ()다음 *를 계산하고, 마지막으로 +를 계산하듯, 연산자에도 우선순위가 있습니다. 1. () 2. 단항연산자(++, --, !) 3. 산술연산자(+, -, *, /, %) 4. 비교연산자(<, >, <=, >=, ==, !=, ===, !==) 5. 논리연산자(||, &&) 6. 대입(복합대입)연산자(=, +=, -=, *=, /=, %=)
논리 연산자 사용해보기
논리 연산자 입력 예시
var a = 10;
var b = 20;
var m = 30;
var n = 40;
var result;
result = a > b || b >= m || m > n; // false || false || false => false
document.write(result, "<br/>");
result = a > b || b >= m || m <= n; // false || false || true => true
document.write(result, "<br/>");
result = a <= b && b <= m && m <= n; // true && true && true => true
document.write(result, "<br/>");
result = !(a > b);
document.write(result, "<br/>"); // =>false를 부정하여 true를 반환합니다.
삼항 조건 연산자
삼항 조건 연산자는 조건식의 만족 여부(true 또는 false)에 따라 실행 결과가 달라지는 삼항 연산자로, 연산을 위해 피연산자가 3개가 필요합니다. 삼항 조건 연산자는 먼저 조건식이 true인지 false인지 먼저 계산합니다. 이후 true면 자바스크립트 코드1을 실행하고 종료 합니다. 만약 false면 자바스크립트 코드2를 실행하고 종료 합니다.
(기본형) 1. 조건식 ? 자바스크립트 코드1 : 자바스크립트 코드2; 2. 조건식1 ? 자바스크립트 코드1 : 조건식2 ? 자바스크립트 코드2: 자바스크립트3; => 1. 조건식1 검사 2. 조건식1이 true면 자바스크립트 코드1을 실행 후 종료 합니다. 3. 조건식1이 false면 조건식2 검사하고, true면 자바스크립트 코드2를 실행 후 종료 합니다. 4. 조건식2가 false면 자바스크립트 코드3을 실행 후 종료 합니다.
삼항 조건 연산자 사용해보기
삼항 조건 연산자 입력 예시
var a = 10;
var b = 3;
var result = a > b ? "javascript" : "hello world";
document.write(result + "세계에 오신것을 환영합니다.");
prompt() 메서드 : 질의 응답창
사용자에게 질문에 대한 답을 얻고자 할 때 사용하는 창입니다. prompt() 메서드에서 기본 답변은 placeholder처럼 사용자에게 힌트를 주기 위해 사용하는 부분으로, 생략이 가능합니다. 사용자로부터 전달받은 답변은 모두 문자형 데이터로 반환 됩니다.
(기본형) prompt("질문", "기본 답변")
지금까지 배운거 응용하기
적정 체중을 구하는 공식
적정 체중을 구하는 공식 입력 예시
/*적정 체중을 구하는 공식
---------------------------------
적정 체중 = (본인 키 -100) *0.9
나의 적정 체중 구하기
-------------------------
1. 키 : 157cm
2. 몸무게 : 37kg
3. 적정체중 : (157 - 100)*0.9
prompt() 메서드 : 질의 응답창
사용자에게 질문에 대한 답을 얻고자 할 때 사용하는 창입니다.
prompt() 메서드에서 기본 답변은 placeholder처럼 사용자에게 힌트를 주기 위해 사용하는 부분으로, 생략이 가능합니다. 사용자로부터 전달받은 답변은 모두 문자형 데이터로 반환 됩니다.
(기본형)
prompt("질문", "기본 답변")*/
var userHeight = 157; // 키
var userWeight = 37; // 몸무게
// 평균 체중 = (본인 키 - 100) *9
var normal_w = (userHeight - 100) * 0.9;
document.write(normal_w, "<br/>");
// 사용자의 평균체중 계산기
var userName = prompt("성함을 입력해주세요");
var height = prompt("당신의 키는 몇입니까?", "0");
var Weight = prompt("당신의 체중은 몇 kg입니까?", "0");
// document.write(userName, height, weight);
// 평균체중을 구해서 평균 체중이라면 사용자 이름은 000님은 '평균체중입니다'.
// 아니면 '평균체중이 아닙니다.'라고 브라우저에 출력해주세요.
normal_w = (height - 100) * 0.9; // 사용자의 평균 체중
// 오차 범위 +-5
var result = Weight >= normal_w - 5 && Weight <= normal_w + 5;
result = result
? userName + "님은 적정 체중입니다."
: userName + "님은 적정 체중이 아닙니다.";
document.write(result);
마무리
이번에 배운 건 저도 너무 어려워서 동영상이 좀 왔다 갔다 할 수 있지만 ...이해 부탁드립니다 ㅜ