자바스크립트 책을 읽으며 생소한 개념이 있어 정리해보려고 한다.
레이블 문 (label statement)
a: console.log('a');
위의 코드는 a 라는 레이블 식별자가 붙은 레이블 문이다.
이 레이블 문은 프로그램의 실행 순서를 제어하는데 사용하고,
이 레이블 문을 탈출하려면 break 문에 레이블 식별자를 지정해주면 된다.
a : {
console.log(1);
break a;
console.log(2);
}
console.log('Done! ^~^');
위 코드의 실행 결과는 아래와 같다.
console.log(1); 이 실행 된 이후 break a; 문을 통해 a 레이블을 탈출하게 되어
아래의 console.log(2); 는 실행되지 않는 것을 확인할 수 있다.
이러한 레이블 문은 중첩된 반복문을 탈출할 때 유용하게 쓰일 수 있다.
중첩된 for 문 내부 for 문에서 break 를 실행하면 내부 for 를 탈출하여 외부 for 문으로 진입한다.
만약 내부 for 가 아닌 외부 for 를 탈출하고 싶다면 레이블을 사용하여 탈출하면 된다.
아래 코드처럼 말이다.
out: for (var i =0; i < 10; i++) {
for (var j =0; j < 30; j++) {
if (i + j == 15) break out;
}
}
사실 이러한 레이블 문은 중첩 for 문 밖으로 탈출할 때 유용하게 쓰이지만,
이 외의 경우에는 일반적으로 권장하고 있지는 않다.
가독성이 나빠지고 흐름을 이해하기 힘들어지기 때문이다.
타입 변환
타입 변환이란, 말 그대로 타입이 변하는 것이다.
여기서 개발자가 의도적으로 값의 타입을 바꾸는 것을 명시적 타입변환 혹은 타입캐스팅이라고 한다.
개발자가 의도하지 않았는데 표현식을 평가하는 도중 자바스크립트 엔진이 암묵적으로 타입을 자동변환시키는 것을
암묵적 타입 변환 혹은 타입 강제 변환이라고 한다.
// 명시적 타입 변환
var a = 1;
var str = a.toString();
console.log(typeof str, str); // string 1
// 암묵적 타입 변환
var b = 1;
var str = a + '';
console.log(typeof str, str); // string 1
명시적 타입 변환이나 암묵적 타입 변환이 기존 원시값을 직접 변경하는 것은 아니다.
원시 값은 변경할 수 없고 타입 변환을 통해 기존 원시 값을 이용하여
새로운 타입의 새로운 원시 값을 생성하는 것에 불과한 것이다.
암묵적 타입 변환
위의 코드 실행 결과들은 전부 암묵적 타입 변환이 이루어진 값이다.
첫번째 케이스는 + 연산자가 하나 이상의 문자열인 피연산자를 인식하여 뒤의 1 을 문자열로 암묵적 타입변환을 한 것이다.
비슷한 맥락으로 두번재 케이스는 * 연산자가 숫자 타입인 5를 인식하여 뒤의 '5' 를 암묵적 타입변환을 행했다.
! 연산자는 단항연산자로 뒤의 값을 boolean 값으로 암묵적 타입 변환을 행한다.
ES6에서 도입된 템플릿 리터럴의 표현식 삽입은 표현식의 평가 겨로가를 문자열 타입으로 변환시킨다.
5+5 연산의 값인 10 이 문자열로 반환되는 것을 확인할 수 있다.
내가 조금 생소한 부분에 대해서 조금 더 적어보자면,
암묵적 타입변환에서 특히 불리언 타입으로 변환하는 부분이 조금 생소하다.
false 로 평가되는 Falsy 값에는 아래 값들이 있다.
- false
- undefined
- null
- 0, -0
- NaN
- ''
나는 여기서 왜 빈 문자열은 Falsy 로 취급하는데, 빈 배열은 Falsy한 값으로 변환될 수 없는걸까?
라는 의문을 가졌다.
파이썬에서 빈배열은 False 인데,,,, 왜 빈 문자열은 되는데 배열은,,,?
배열이 비어있을때 false 로 처리하려면, 배열.length 를 이용해 길이로 접근해서 조건문을 작성하면 된다.
만약 길이가 0이라면 자연스럽게 false로 처리되기 때문이다.
'Archive > Develop' 카테고리의 다른 글
[ 모던 자바스크립트 스터디 ] 암묵적 타입 변환 & 명시적 타입 변환 (0) | 2022.09.14 |
---|---|
[ Python ] Dictionary , Set Hash 이용해보자 (0) | 2022.09.12 |
[ 모던 자바스크립트 스터디 ] 자바스크립트 개요, 변수 호이스팅 (0) | 2022.09.07 |
[ NestJS ] TypeORM 기존 테이블 -> entity 생성 (0) | 2022.08.19 |
[ Flask ] migrate 오류 해결 (0) | 2022.07.24 |