use strict - 엄격 모드
자바스크립트는 꽤 오랫동안 호환성 이슈 없이 발전해왔다.
기존의 기능을 변경하지 않으면서 새로운 기능이 추가되어왔다.
덕분에 기존에 작성한 코드는 절대 망가지지 않는다는 장점이 있었다.
하지만 자바스크립트 창시자들이 했던 실수나, 불완정한 결정이 언어안에 영원히 박제된다는 단점도 생겼다.
이런 상황은 ECMAScript(ES5)가 등장하기 전인 2009년도까지 지속되었다.
그런데 새롭게 제정된 ES5에는 새로운 기능이 추가되고, 기존 기능 중 일부가 변경되었다.
기존 기능을 변경하였기 때문에 하휘 호환성 문제가 생길 가능성이 생겼다.
그래서 변경사항 대부분은 ES5의 기본모드에선 활성화되지 않도록 설계되었다.
" 대신 useStrict 라는 특별한 지시자를 사용해
엄격모드를 활성화했을 때만 이 변경사항이 활성화되게 해놓았다. "
주의
엄격모드는 대게 스크립트 전체에 적용한다.
단, use strict 스크립트 최상단이 아닌
함수 본문 맨 앞에 올 수도 있다.
이렇게 하면 오직 해당 함수만 엄격 모드로 실행된다.
또한 use strict를 취소할 방법은 없다.
자바스크립트 엔진을 이전 방식으로 되돌리는지시자는 존재하지 않는다.
use strict 꼭 사용해야할까?
모던 자바스크립트는 '클래스'와 '모듈'이라 불리는 진일보한 구조를 제공한다.
이 둘을 사용하면 use strict가 자동으로 적용된다.
따라서 이 둘을 사용하고있다면 스크립트에 use strict를 붙일 필요는 없다.
변수와 상수
변수
변수는 데이터를 저장할 때 쓰이는 '이름이 붙은 저장소' 다.
var과 let은 거의 동일하게 동작한다.
var도 let처럼 변수를 선언하는 데 쓰인다.
하지만 var는 오래된 방식이다.
JavaScript 변수 선언 키워드 차이점
const:
- 재할당 불가능한 상수
- 재선언 불가능
- 선언과 동시에 초기화 필요
- 블록 스코프
let:
- 재할당 가능
- 재선언 불가능
- 초기화 없이 선언 가능
- 블록 스코프
var:
- 재할당 가능
- 재선언 가능
- 초기화 없이 선언 가능
- 함수 스코프
- 호이스팅 발생
var은 호이스팅되며 undefined로 초기화된다.
let과 const는 호이스팅되지만 TDZ에 있어 초기화 전 접근 불가
변수의 재사용 아니면 새로만들기?
변수를 재사용하면 변수 선언에 쏟는 노력을 좀 덜 순 있겠지만, 디버깅에 열 배 더 많은 시간을 쏟아야한다.
변수를 추가하는 것은 좋은 습관이다.
모던 자바스크립트 압축기(minifier)와 브라우저는 코드 최적화를 잘해준다. 변수를 추가한다고 해서 성능 이슈가 생기지 않는다. 값이 달느 경우 변수를 다르게 선언해 주면 코드 최적화에 도움이 될 수 있다.
자료형
자바스크립트에서 값은 항상 문자열이나 숫자형 같은 특정한 자료형에 속한다.
자바스크립트에는 여덟 가지 기본 자료형이 있다.
또한 변수에 저장되는 값의 타입이 언제든지 바꿀 수 있는 언어를 '동적타입'언어라고 부른다.
숫자형
숫자형은 정수 및 부동소수점 숫자를 나타낸다.
숫자형에는 Infinity, -Infinity, NaN같은 특수 숫자 값이 포함된다.
NaN은 계산 중에 에러가 발생했다는 것을 나타내주는 값이다. 부정확하거나 정의되지 않은 수학 연산을 사용하면, 계산 중에 에러가 발생하는데, 이때 NaN이 반환된다.
NaN에 어떤 추가 연산을 해도 결국 NaN이 반환된다.
즉 연산 과정 어디에선가 NaN이 반환되었다면 이는 모든 결과에 영향을 미친다.
BigInt
표준으로 채택된지 얼마 안 된 자료형으로, 길이에 상관없이 정수를 나타낼 수 있다.
끝에 'n'이 붙으면 BigInt자료형이다.
const bigInt = 123456789012345678901234567890n
주의 : IE에서는 BigInt지원하지 않음
null
null은 그 어떤 자료형에도 속하지 않는 값이다.
null값은 오로지 null만 포함하는 별도의 자료형을 만든다.
null은 존재하지 않는 값, 비어있는 값, 알수 없는 값을 나타내는데 사용한다.
ex) let age = null; 나이를 알 수 없거나 그 값이 비어있음을 보여줌
undefined
undefined도 자신만의 자료형을 형성한다.
값이 할당되지 않은 상태를 사용한다.
변수는 선언했지만, 값을 할당하지 않았다면 해당 변수에는 undefined가 자동으로 할당된다.
ex) let age = 100;
age = undefined;
위의 방식처럼 undefined를 직접 할당할 수는 있지만 권장하지 않는다.
비어있거나 알 수 없는 상태를 나타내려면 null을 사용해야한다.
undefined는 값이 할당되지 않은 변수의 초기값을 위해 예약어로 남겨둬야한다.
prompt
브라우저에서 제공하는 propmt함수는 두 개의 인수를 받는다.
사용자에게 보여줄 문자열, 초깃값(선택)
사용자는 프롬프트 대화상자의 입력 필드에 원하는 값을 입력하고 확인을 누를 수 있다.
propmt함수는 사용자가 입력 필드에 기재한 문자열을 반환한다.
사용자가 입력을 취소한 경우는 null이 반환된다.
confirm
confirm 함수는 매개변수로 받은 질문과 확인 및 취소버튼이 있는 모달창을 보여준다.
확인 버튼을 누르면 true반환, 취소나 esc를 누르면 false를 반환
브라우저는 사용자와 상호작용할 수 있는 세 가지 함수를 제공한다.
alert, prompt, confirm
이 세 가지 함수에는 두 가지 제약사항이 있다.
1. 모달 창의 위치는 브라우저가 결정한다.
2. 모달 창의 모양은 브라우저마다 다르다. 개발자는 창의 모양을 수정할 수 없다.
피연산자
피연산자는 연산자가 연산을 수행하는 대상이다.
인수 라는 용어로 불리기도 한다.
피연산자를 하나만 받는 연산자는 단항 연산자라고 부른다.
두 개의 피연산자를 받는 연산자는 이항 연산자라고 부른다.
거듭제곱 연산자 **
alert( 2 ** 2 ); // 4 (2 * 2)
alert( 2 ** 3 ); // 8 (2 * 2 * 2)
alert( 2 ** 4 ); // 16 (2 * 2 * 2 * 2)비트 연산자
인수를 32비트 정수로 변환하여 이진 연산을 수행한다.
비트 AND ( & )
비트 OR ( | )
비트 XOR ( ^ )
비트 NOT ( ~ )
왼쪽 시프트(LEFT SHIFT) ( << )
오른쪽 시프트(RIGHT SHIFT) ( >> )
부호 없는 오른쪽 시프트(ZERO-FILL RIGHT SHIFT) ( >>> )
쉼표연산자
마지막 표현식의 평가 결과만 반환된다.
쉼표의 연산자 우선순위는 낮다.
- "" + 1 + 0 // 10
- "" - 1 + 0 //10 답:-1
- true + false //1
- 6 / "3" //2
- "2" * "3" //6
- 4 + 5 + "px" //45px 답: 9px
- "$" + 4 + 5 //$45
- "4" - 2 //2
- "4px" - 2 //2 답: NaN
- 7 / 0 //0 답: Infinity
- " -9 " + 5 //-4 답: "-9 5"
- " -9 " - 5 //-14
- null + 1 //1
- undefined + 1 //NaN
- " \t \n" - 2 //? 답: -2
오답: 2,6,9,10,11,15
틀린 문제 복습 필요
- 5 > 4 //true
- "apple" > "pineapple" //false
- "2" > "12" //false 답: true
- undefined == null //true
- undefined === null //false
- null == "\n0\n" //false
- null === +"\n0\n" //false
오답: 3
틀린 문제 복습 필요
