코딩하는 고릴라

모던 자바스크립트 튜토리얼 - 1. 자바스크립트 기본 본문

Javascript

모던 자바스크립트 튜토리얼 - 1. 자바스크립트 기본

코릴라입니다 2024. 11. 11. 23:36

 

 

내용은 지속적으로 업데이트할 예정입니다.

 

엄격 모드

 

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 이 할당된다.

 

반응형