Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- 부트캠프 #개발일지 #TIL #Position #위치
- querySelector
- 부트캠프 #개발일지 #TIL #FlexboxFroggy #displayflex #flexbox
- 의사클래스
- 템플릿스트링
- React
- 결합선택자
- js
- Til
- CSS
- 부트캠프 #개발일지 #TIL #CSS속성 #float #clear
- 부트캠프 #개발일지 #TIL #그리드 #CSS
- useState
- 부트캠프
- 리액트
- ㅜㄹㄹ
- textContent
- 알고리즘
- 부트캠프 #CSS #개발일지 #TIL #박스모델
- 부트캠프 #CSS #개발일지 #TIL
- 특성선택자
- appendChild
- JS예제
- 깃허브오류
- 개발일지 #TIL #프론트엔드 #HTML
- 부트캠프 #스파르타코딩클럽 #개발일지# #html
- 부트캠프 #스파르타코딩클럽 #개발일지# #TIL #Javascript #confirm #location.href
- 개발일지
- useEffect
- 부트캠프 #코딩 #개발일지 #프론트엔드 #CSS #TIL
Archives
- Today
- Total
나의 개발일지
[Javascript] 3. 연산자 본문
1. 산술연산자
// 1-1. 더하기 연산자
console.log(2 + 3); // 5
console.log("2" + "3"); // "23"
console.log("2" + 3); // "23"
console.log(2 + "3"); // "23"
// --> 숫자와 문자열을 함께 사용할 경우, 자동으로 문자열로 변환한다
// 1-2. 빼기 연산자
console.log(5 - 2); // 3
console.log("5" - "2"); // 3
console.log("5" - 2); // 3
console.log(5 - "2"); // 3
console.log("five" - 2); // NaN
// --> 숫자와 문자열을 함께 사용할 경우, 자동으로 숫자로 변환한다
// 1-3. 곱하기 연산자(*)
console.log(5 * 2); // 10
console.log("5" * "2"); // 10
console.log("5" * 2); // 10
console.log(5 * "2"); // 10
console.log("five" * 2); // NaN
// --> 숫자와 문자열을 함께 사용할 경우, 자동으로 숫자로 변환한다
// 1-4. 나누기 연산자(/)
console.log(6 / 3); // 2
console.log("6" / "3"); // 2
console.log("6" / 3); // 2
console.log(6 / "3"); // 2
console.log("six" / 3); // NaN
// --> 숫자와 문자열을 함께 사용할 경우, 자동으로 숫자로 변환한다
// 1-5. 나누기 연산자(%)
console.log(7 % 3); // 1
console.log("7" % "3"); // 1
console.log("7" % 3); // 1
console.log(7 % "3"); // 1
console.log("seven" % 3); // NaN
// --> 숫자와 문자열을 함께 사용할 경우, 자동으로 숫자로 변환한다
2. 할당연산자
// 2-1. 등호연산자(=)
let x = 10;
console.log(x); // 10
x = 5;
console.log(x); // 5
// --> 변수에 값을 할당한다.
// --> = 기준 오른쪽 값을 왼쪽 변수에 넣는다는 것으로 생각해야 함!
// 2-2. 더하기 등호 연산자(+=)
let x = 10;
console.log(x); // 10
x += 5;
console.log(x); // 15
// --> 변수에 값을 더한다.
// 2-3. 빼기 등호 연산자(-=)
let x = 10;
console.log(x); // 10
x -= 5;
console.log(x); // 5
// --> 변수에서 값을 뺀다.
// 2-4. 곱하기 등호 연산자(*=)
let x = 10;
console.log(x); // 10
x *= 5;
console.log(x); // 50
// --> 변수에 값을 곱한다.
// 2-5. 나누기 등호 연산자(/=)
let x = 10;
console.log(x); // 10
x /= 5;
console.log(x); // 2
// --> 변수에 값을 나눈다.
// 2-6. 나누기 등호 연산자(%=)
let x = 10;
console.log(x); // 10
x %= 3;
console.log(x); // 1
// --> 변수에서 값을 나눈 나머지 값을 구한다.
3. 비교 연산자
// 3-1. 일치 연산자(===)
console.log(2 === 2); // true
console.log("2" === 2); // false / 문자형과 숫자를 비교했을 때 같은 자료형이 아니기 때문에 불일치
console.log(2 === "2"); // false / 문자형과 숫자를 비교했을 때 같은 자료형이 아니기 때문에 불일치
// --> 두 값이 같은지 비교할 수 있다.
// --> 자료형까지 비교한다.
// 3-2. 불일치 연산자(!==)
console.log(2 !== 2); // false / 두 값이 일치하지만 불일치 연산자에서는 일치하면 안되기 때문에 false
console.log("2" !== 2); // true / 비교했을 때 두 값이 불일치하기 때문에 true (문자 vs 숫자)
console.log(2 !== "2"); // true / 비교했을 때 두 값이 불일치하기 때문에 true (문자 vs 숫자)
// --> 두 값이 다른 지 비교할 수 있다.
// --> 자료형까지 비교한다.
// 3-3. 작다(<) 연산자
console.log(2 < 3); // true
console.log(2 < "3"); // true
console.log("2" < 3); // true
// --> 두 값을 비교하여 더 작은 값을 구할 수 있다.
// --> 문자열이랑 숫자랑 비교할 경우 문자열은 숫자로 자동 변환!
// 3-4 작거나 같다(<=) 연산자
console.log(2 <= 3); // true
console.log(2 <= "3"); // true
console.log("2" <= 3); // true
console.log(2 <= 2); // true
// --> 두 값을 비교하여 같거나 더 작은 값을 구할 수 있다.
// --> 문자열이랑 숫자랑 비교할 경우 문자열은 숫자로 자동 변환!
4. 논리 연산자
// 4-1. 논리곱(&&) 연산자
console.log(true && true); // true
console.log(true && false); // false
console.log(false && true); // false
console.log(false && false); // false
let a = 10 > 5; // true
let b = 10 < 5; // false
let c = 5 == '5' // true
console.log(a && b); // false / a, b 중 하나만 맞으므로 false
console.log(a && c); // true / a, c 둘 다 맞으므로 true
// --> 두 값을 비교, 두 값이 모두 true일 경우에만 true를 반환한다.
5. 삼항 연산자(?:)
let x = 10;
let result = (x > 5) ? "크다" : "작다";
console.log(result); // "크다"
let result = (x > 5) ? "크다" : "작다";
true false
6. 타입 연산자
typeof 연산자
console.log(typeof 123); // "number" 숫자
console.log(typeof "123"); // "string" 문자열
console.log(typeof true); // "boolean" true / false
console.log(typeof undefined); // "undefined"
console.log(typeof null); // "object"
console.log(typeof {}); // "object"
console.log(typeof []); // "object"
console.log(typeof function(){}); // "function"
'JavaScript > Sparta' 카테고리의 다른 글
[Javascript] 6. 함수 - for문 / for 중첩 (1) | 2023.10.18 |
---|---|
[Javascript] 5. 함수 - 조건문 / if / else if / else / if중첩문 / switch (0) | 2023.10.17 |
[Javascript] 4. 함수 - 함수선언식/함수표현식/스코프/화살표함수/arguments (0) | 2023.10.16 |
[Javascript] 2. 데이터 타입 (0) | 2023.10.14 |
[Javascript] 1. 변수와 상수 (0) | 2023.10.13 |