일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 구현
- REACT
- 토이 프로젝트
- poiemaweb
- 오블완
- 자바
- 자료 구조
- 해시를 사용한 집합과 맵
- 브루트포스
- 자바스크립트
- State
- 엔트리포인트
- three.js
- react-three/fiber
- 코딩일기
- 개발 회고
- HTML5
- 프론트엔드
- styled-components
- 모던 자바스크립트 튜토리얼
- 티스토리챌린지
- 회고
- 기본 문법
- 백준
- 시뮬레이션
- js
- 수학
- Next.js
- 세그먼트 트리
- JavaScript
- Today
- Total
코딩하는 고릴라
모던 자바스크립트 튜토리얼 - 1. 자바스크립트 기본 본문
내용은 지속적으로 업데이트할 예정입니다.
엄격 모드
ko.javascript.info
🦍 1. 엄격 모드
- 엄격모드란?
ES5 등장 후, 변경된 기존 기능의 안정적인 동작을 위해 변경된 기능을 사용할 수 있게 하는 모드.
엄격 모드가 아닌 기본 모드에서는 ES5 이전의 기능을 활용할 수 있다.
- 요즘 지원되는 일반적 브라우저 콘솔 환경에서는 기본적으로 'use strict'가 적용되어 있을까?
일반적으로 엄격 모드가 적용되어 있지 않다. 따라서 브라우저 콘솔에서 엄격 모드 활용을 위해서는 'use strict'를 입력 후, shift+enter를 입력해 줄 바꿈 후 코드를 작성해야 한다.
- 'use strict'를 명시하지 않아도 엄격 모드가 적용되는 경우
- 클래스를 활용하는 경우
- 모듈을 활용하는 경우
형 변환
ko.javascript.info
🐕 2. 형 변환
- 숫자 이외의 글자가 포함된 문자열을 숫자형으로 변환했을 때의 결과는?
NaN (Not a Number)
- undefined / null / true / false를 숫자형으로 변환했을 때의 결과는?
undefined : NaN
null : 0
true : 1
false : 0
- 문자열을 숫자형으로 변환 시 변환 과정
1. 문자열 양 끝의 공백 제거
2. 공백 제거 후 남아 있는 문자열이 있는지 체크
-> 없다면 0 반환
3. 남아있는 문자열이 있다면, 해당 문자열에서 숫자를 읽어 나감
-> 숫자로 무사히 변환에 성공했을 경우 : 변환된 숫자 반환
-> 숫자가 아닌 문자가 포함되어 있을 경우 : NaN 반환
- 0과 "0"을 불린형으로 변환했을 때의 결과
0 : 숫자 0을 불린형으로 변환시 false 반환
"0" : 문자열 0을 불린형으로 변환시 true 반환
- 문자열은 빈 문자열만이 false로 변환된다.
- 빈 문자열("")과 공백(" ")을 불린형으로 변환했을 때의 결과
빈 문자열("") : console.log(Boolean('')); // false
공백(" ") : console.log(Boolean(' ')); // true
- console.log(' ' == false)와 console.log(Boolean(' ') == false)의 결과
console.log(' ' == false) // true
- == 연산자를 통한 비교를 위해 양쪽 값의 형 변환이 이루어진다.
- 공백(' ')은 숫자 0으로, false도 숫자 0으로 변환되어 결과적으로 0 == 0을 비교하게 되어 true를 반환한다.
console.log(Boolean(' ') == false) // false
- 공백(' ')을 불린형으로 명시적 형 변환 시 true를 반환한다.
- 따라서 true == false 이기에 false를 반환한다.
기본 연산자와 수학
ko.javascript.info
🐈 3. 기본 연산자와 수학
- 문자열과 숫자를 이항 연산자 +를 사용해 연산 시 반환값의 타입
문자열.
피연산자 중 하나라도 문자열이 포함되어 있다면 그 연산 결과로는 문자열을 반환한다.
- [ 2 + 2 + '1' ] 의 연산 결과
'41'
피연산자에 문자열을 포함하고 있으므로 연산 결과의 타입은 문자열일 것이다.
연산은 좌측에서부터 이루어지므로 숫자형끼리의 연산 (2+2=4)가 우선적으로 일어난 후, 그 결과인 4와 '1' 을 더해 '41'을 반환한다.
- [ let a = (1 + 2, 3 + 4) ] 와 같이 쉼표 연산자가 포함된 표현식의 반환값
7
괄호 내에 두개의 표현식 (1 + 2), (3 + 4)가 존재한다.
이 때 쉼표 연산자로 이어진 여러 표현식의 결과 중, 가장 뒤쪽의 표현식에 대한 결과만 반환하게 된다.
- [ let a = 1 + 2, 3 + 4] 에서 a에 할당된 값
3
쉼표 연산자의 연산자 우선순위는 할당 연산자(=) 보다 낮다.
따라서 위 문은 다음과 같은 과정을 통해 연산이 이루어진다.
let a = 1 + 2, 3 + 4
let a = 3, 7
-> 이는 두 개의 표현식으로 나누어진다. let a = 3 과 7
-> 쉼표 앞쪽 표현식인 let a = 3 에 의해 a 에는 3 이 할당된다.
'Javascript' 카테고리의 다른 글
모던 자바스크립트 튜토리얼 - 3. 자료구조와 자료형 (0) | 2024.11.14 |
---|---|
모던 자바스크립트 튜토리얼 - 2. 객체: 기본 (0) | 2024.11.12 |
[JS] 문자열을 정렬시킬 수 있을까? (0) | 2024.08.04 |
[Javascript] 코드로 보는 비동기 작업 이해하기 (0) | 2024.06.19 |
[Javascript] 데이터 타입과 변수 (0) | 2023.12.01 |