2023- 05 - 13 형 변환 (데이터타입 변환), 연산자
오늘 할일
자바스크립트 1주차 강의 듣기.
개인과제 복습하기.
오늘 배운 것
1. 형변환 2.연산자
형 변환 : 형태를 바꾼다. 문자열을 숫자열로, 숫자열을 문자열로 등등.
1. 암시적 형 변환 : 개발자가 의도하지 않았고, 자동적으로 바뀌는 형 변환
2. 명시적 형 변환 : 개발자가 의도한 형 변환
암시적 형변환
(1) 문자열과 다른 데이터타입(숫자열, null, 객체, underined 등)이 더하기되면 문자열이 된다.
let result = 1+"2";
console.log(result); // 12
console.log(typeof result); // string
(숫자열 + 문자열 = 문자열(string))
let result = "1" + true;
console.log(result); // 1true
console.log(typeof result); // string
(문자열 + 불리언 = 문자열(string))
(2) 빼기, 곱하기, 나누기는 항상 숫자열로 변환된다. (문자열끼리 해도 숫자열이 된다.)
let result = 1 - "3";
console.log(result); // -2
console.log(typeof result); // number
(숫자열 - 문자열 = 숫자열(number))
let result = "4" * "4";
console.log(result); // 16
console.log(typeof result); // number
(문자열 * 문자열 = 숫자열(number))
명시적 형 변환
(변환시킬 타입(변환할 타입)) ->여기서 변환시킬 타입 앞글자는 대문자로 써야함. (String, Number, Boolean)
1. Boolean 형변환
boolean 값이 false로 나오는 경우
console.log(Boolean(0)); => 숫자열 0을 boolean타입으로 변환시킨다.
console.log(Boolean("")); => 값이 없는 문자열("")을 boolean타입으로 변환시킨다.
console.log(Boolean(null)); => null을 boolean타입으로 변환시킨다.
console.log(Boolean(undefined)); => undefined을 boolean타입으로 변환시킨다.
console.log(Boolean(NaN)); => NaN을 boolean타입으로 변환시킨다.
// false 라는 불리언 값으로 나옴.
boolean 값이 true로 나오는 경우
console.log(Boolean("false")); => 값이 있는 문자열 "false"을 boolean 타입으로 변환시킨다
console.log(Boolean()); => 빈 객체를 boolean타입을 변환시킨다.
// true 라는 불리언 값으로 나옴
2. 문자열 형변환
let result = String(123)
console.log(result);
console.log(typeof result); => 123, string
let result = String(true)
console.log(result);
console.log(typeof result); => true, string
let result = String(null)
console.log(result);
console.log(typeof result); => null, string
let result = String(undefined)
console.log(result);
console.log(typeof result); => undefined, string
여기서 123, true, null, undefined는 다 문자열(string)타입으로 출력된다.
3. 숫자열 형변환
let result = Number("abc")
console.log(result)
console.log(typeof result) // NaN, number
(result만 출력하면 NaN이지만 typeof하면 문자열"abc"가 숫자열로 변형됨)
let result = Number("123")
console.log(result)
console.log(typeof result) //123, number
연산자
1. 더하기 연산자 (문자열 우선시)
console.log(1 + 1); // 2
console.log(1 + "1"); // 11
2. 빼기 연산자 (숫자열 우선시)
console.log(1 - "2"); // -1
console.log(1 - 2); // -1
3. 곱하기 연산자 (숫자열 우선시)
console.log(2 * 3); // 6
console.log("2" * 3); // 6
4. 나누기 연산자 (숫자열 우선시)
console.log("4" / 2); // 2
console.log(4 / 2); // 2
5. 나누기 연산자(/) vs 나머지 (나누고 나서 몫을 뺀 나머지) 연산자(%)
console.log(5 / 2); // 2.5
console.log(5 % 2); // 1 (5를 2로 나누고 남은 나머지값 1)
6. 할당 연산자 (assignment) =
6-1. 등호 연산자 (=)
let x = 10; // 등호 "=" 연산자가 곧 할당 연산자.
console.log(x); // 10
6-2. 더하기 등호연산자 (+=)
let x = 10;
x += 5;
console.log(x); // 15
6-3. 빼기 등호연산자 (-=)
let x = 15;
x -= 5;
console.log(x); // 10
6-4. 곱하기 등호연산자 (*=)
let a = 10;
a *= 2;
console.log(a); // 20
비교 연산자 (결과값의 참과 거짓에 따라 true또는 false를 반환하는 연산자)
1. 일치 연산자 (===) : 데이터타입까지 일치한 연산자 and
console.log(2 === 2); // true
console.log("2" === 2); // false
2. 불일치 연산자 (!==) : 거꾸로. 데이터타입까지 일치해야 false를 반환하는 연산자. 불일치하면 true를 반환함.
console.log(2 !== 2); // false
console.log("2" !== 2); // true
3. 작다 연산자 (<) , 작거나 같다 연산자 (<=)
console.log(2 < 3); // true
console.log(2 <= 3); // true
console.log(3 <= 3); // true
console.log(4 <= 3); // false
4. 논리 연산자
4-1. 논리곱 연산자 (&&) : 모두 true일 때만 true 반환. &&는 and(둘다)의 의미
조건1 && 조건2 = 조건1, 조건2 둘다 만족시켜야만 true
console.log(true && true); // true
console.log(true && false); // false
console.log(false && true); // false
console.log(false && false); // false
4-2. 논리합 연산자 (||) : 두 값중 하나라도 true인 경우 true 반환. ||는 or(또는)의 의미
조건1 || 조건2 = 조건1, 조건2 중 하나라도 만족시키면 true
console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false
4-3. 논리부정 연산자 (!) : true값을 false로 바꿈. 사용빈도가 가장 높다!
console.log(!true); // false
let a = true;
console.log(!a); // false
5. 삼항 연산자 (활용빈도 상당히 높다) 조건에 따라 값을 선택한다.
조건 ? 조건이true인 경우 : 조건이 false인 경우
let a = 10;
let result = (a > 5) ? "크다" : "작다";
console.log(result);
// "크다"
위에서
삼항 (항이 3개: 첫번째항 : (a > 5), 두번째항 "크다", 세번째항 "작다"
첫번째 항이 조건이고, 조건이 true이면 result값에 두번째항 "크다"를 할당, false면 result값에 세번째항 "작다"를 할당
연습문제: 3항 연산자를 이용해서 y가 10보다 작은경우 작다를, 10보다 큰경우 크다를 출력해주세요.
let y = 20;
let answer = (y < 10) ? "크다" : "작다";
console.log(answer);
// "작다"
06. 타입 연산자 (typeof)
console.log(typeof "5"); // string 문자열 타입
console.log(typeof 5); // number 숫자열 타입