-
[모던 JS 딥다이브] 6장 데이터타입JavaScript/모던 자바스크립트 딥다이브 2023. 11. 25. 17:24
아래 정리한 문서는 티스토리에서 일부 지원되지 않는 마크다운 기능이 있어 서식이 정확하지 않습니다ㅜㅜ
정확한 정리 문서는 위에 깃허브 링크를 참고해주세요!6. 데이터 타입
값의 종류로 원시 타입과 객체 타입으로 나뉜다
- 원시 타입 : 숫자 타입, 문자열 타입, 불리언 타입, undefined 타입, null 타입, 심벌 타입
- 객체 타입 : 객체, 함수, 배열 등
6.1 숫자 타입
하나의 숫자 타입만 존재 → 정수(소수점x)와 실수(소수점o) 구분 없이 모든 수를
실수로 처리// 숫자 타입은 모두 실수로 처리 console.log(1 === 1.0); // true console.log(4 / 2); // 2 console.log(3 / 2); // 1.5- Infinity, -Infinity : 양의 무한대 / 음의 무한대
- NaN : 산술 연산 불가
console.log(10 / 0); // Infinity console.log(10 / -0); // -Infinity console.log(1 * 'String'); // NaN
6.2 문자열 타입
작은 따옴표, 큰 따옴표, 백틱(``)으로 텍스트 감싸며 보통 작은 따옴표 사용
- 원시타입으로 변경 불가능한 값 → 문자열이 생성되면 그 문자열을 변경할 수 없다는 것 의미 (ㄴ 11장 문자열과 불변성에서 나옴)
6.3 탬플릿 리터럴
`` 사용
- 일반 문자열은 줄바꿈 허용 안되지만(\사용해야 가능) 템플릿 리터럴은 줄바꿈 허용
- 표현식을 삽입하려면 ${ }으로 표현식을 감쌈 → 아래 코드 예시와 같이 표현식 평가 결과가 문자열이 아니더라도 문자열로 타입 강제 변환되어 삽입
console.log(`1 + 2 = ${1 + 2}`); // 1 + 2 = 3
6.4 불리언 타입
true, false으로 조건문에서 자주 사용
6.5 undefined 타입
- var로 선언한 변수는 undefined로 암묵적으로 초기화된다.
- 변수를 선언한 이후 값을 할당하지 않으면 undefined가 반환
var foo; console.log(foo); // undefined- 의도적으로 undefined를 변수에 할당하는 것은 권장 ❌ → 변수에 값이 없다라는 것 나타낼 때는
null사용 [ 🗒️선언과 정의 ] js에서 변수는 '선언한다', 함수는 '정의한다'고 표현
6.6 null 타입
변수에 값이 없다는 것을 의도적으로 명시할 때 사용
- 변수에 null 할당 → 이전에 참조하던 값 더이상 참조 x (이전에 할당되어 있던 값에 대한 참조를 제거)
- → js 엔진 누구도 참조하지 않는 메모리 공간에 대해 가비지 콜렉터를 수행
- 함수가 유효한 값을 반환할 수 없는 경우, 명시적으로 null 반환
var foo = 'Lee'; // 이전 참조 제거 // 유용하지는 않음 → 변수 스코프 좁게 만들어 변수 자체를 빨리 소멸시키는 방법이 나음 foo = null;- 아래 코드처럼 함수가 유효한 값 반환할 수 없는 경우도 null 반환
<!DOCTYPE html> <html> <body> <script> var element = document.querySelector(".myObj"); // HTML 문서에 myObj 클래스를 갖는 요소가 없다면 null을 반환 console.log(element); // null </script> </body> </html>
6.7 심벌타입
주로 이름이 충돌할 위험이 없는 객체의 유일한 프로퍼티 키를 만들기 위해 사용 (ㄴ33장에 나옴)
- Symbol 함수를 호출해 생성 → 생성된 심벌값은 외부에 노출되지 않으며 다른 값과 절대 중복되지 않는 유일무이한 값이다
var key = Symbol('key'); // 심벌값 생성 console.log(typeof key); // symbol
var obj = {};
obj[key] = 'value'; // 이름이 충돌할 위험이 없는 유일무이한 값인 심벌을 프로퍼티 키로 사용
console.log(obj[key]); // value```
6.8 객체타입
- 자바스크립트를 이루고 있는 거의 모든 것이 객체(ㄴ11장에 나옴)
6.9 데이터 타입의 필요성
- 1️⃣ 값을 저장할 때 확보해야 하는
메모리 공간의 크기를 결정하기 위해 - 2️⃣ 값을 참조할 때 한번에 읽어들여야 할
메모리 공간의 크기를 결정하기 위해 - 3️⃣ 메모리에서 읽어들인
2진수를 어떻게 해석할지 결정하기 위해
6.10 동적 타이핑
자바스크립트 변수는 선언이 아닌 할당에 의해 타입이 결정되며 재할당에 의해 변수의 타입은 언제든지 동적으로 변할 수 있음
자바스크립트 → 동적 타입 언어동적 타입 언어의 단점
- 변수 값은 언제든지 변경될 수 있기 때문에 복잡한 프로그램에서는 변화하는 변수 값 추적 어려움
- 값의 변경에 의해 타입도 언제든지 변경될 수 있기 때문에 값을 확인하기 전까지 타입을 확실할 수 없음
- js는 개발자 의도와 상관 없이 js 엔진에 의해 암묵적으로 타입이 자동 변환되기도 함 → 오류 발생
- ➡️ 동적 타입 언어는 유연성은 높지만 신뢰성은 떨어진다
[ 📓 변수 사용시 주의 사항 ]
- 변수는 꼭 필요할 경우에 한해 제한적으로 사용해라. -> 변수의 개수가 많으면 많을수록 오류가 발생할 확률도 높아짐
- 변수의 유효범위(스코프, scope)는 최대한 좁게 만들어 변수의 부작용을 억제해라. -> 스코프가 넓으면 넓을수록 변수로 인해 오류가 발생할 확률이 높아진다.
- 전역 변수는 최대한 사용을 피해라. -> 전역 변수는 프로그램의 복잡성을 증가시키고, 처리 흐름을 추적하기 어렵게 만들고, 오류가 발생할 경우 원인을 특정하기 어렵게 만든다.
- 변수보다 상수를 사용해 값의 변경을 억제해라.
- 변수 이름은 변수의 목적이나 의미를 파악할 수 있도록 네이밍해라. -> 의도가 명확한 네이밍은 코드를 이해하기 쉽게 만들고, 이는 협업과 생산성 향상에 도움을 준다.
``` 가독성이 좋은 코드가 좋은 코드다
'JavaScript > 모던 자바스크립트 딥다이브' 카테고리의 다른 글
[모던 JS 딥다이브] 9장 타입 변환과 단축 평가 (0) 2023.11.30 [모던 JS 딥다이브] 8장 제어문 (2) 2023.11.26 [모던 JS 딥다이브] 7장 연산자 (0) 2023.11.25 [모던 JS 딥다이브] 5장 표현식과 문 (0) 2023.11.23 [모던 JS 딥다이브] 4장 변수 (0) 2023.11.23