항해 99 / 자바스크립트 언어의 특성 알아보기 .... 1
자바스크립트의 자료형과 특성은 무엇일까?
- 느슨한 타입(loosely typed)의 동적(dynamic) 언어
JS는 총 7가지 데이터타입으로 볼 수 있다
Boolean/ Null / Undefined / Number / String / Symbol / 객체 자료형
JS의 변수는 어떤 특정한 타입이 연결되지 않으며, 모든 타입으로 할당 및 재할당이 가능하다.
한 마디로 변수 선언이 다른 언어에 비해 유연하다.
let foo = 42 // foo가 숫자
foo = 'bar' // foo가 이제 문자열
foo = true // foo가 이제 불리언
- JavaScript 형변환
형 변환(타입 변환)
자바스크립트는 타입 검사가 매우 유연한 언어이다.
자바스크립트의 변수는 타입이 정해져 있지 않으며, 같은 변수에 다른 타입의 값을 다시 대입할 수도 있다.
묵시적 타입 변환
자바스크립트는 특정 타입의 값을 기대하는 곳에 다른 타입의 값이 오면, 자동으로 타입을 변환하여 사용한다.
즉, 문자열 값이 오길 기대하는 곳에 숫자가 오더라도 자바스크립트는 알아서 숫자를 문자열로 변환하여 사용한다.
10 + "문자열"; // 문자열 연결을 위해 숫자 10이 문자열로 변환됨.
"3" * "5"; // 곱셈 연산을 위해 두 문자열이 모두 숫자로 변환됨.
1 - "문자열"; // NaN
명시적 타입 변환(explicit type conversion)
자바스크립트에서는 묵시적 타입 변환을 많이 사용하지만, 명시적으로 타입을 변환할 방법도 제공한다.
명시적 타입 변환을 위해 자바스크립트가 제공하는 전역 함수는 다음과 같다.
Number()
String()
Boolean()
Object()
parseInt()
parseFloat()
Number("10"); // 숫자 10
String(true); // 문자열 "true"
Boolean(0); // 불리언 false
Object(3); // new Number(3)와 동일한 결과로 숫자 3
숫자를 문자열로 변환
숫자를 문자열로 변환하는 가장 간단한 방법은 String() 함수를 사용하는 것이다. 또한, null과 undefined를 제외한 모든 타입의 값이 가지고 있는 toString() 메소드를 사용할 수도 있다.
숫자(Number) 객체는 숫자를 문자열로 변환하는 다음과 같은 메소드를 별도로 제공한다.
toExponential()
toFixed()
toPrecision()
메소드설명
| toExponential() | 정수 부분은 1자리, 소수 부분은 입력받은 수만큼 e 표기법을 사용하여 숫자를 문자열로 변환함. |
| toFixed() | 소수 부분을 입력받은 수만큼 사용하여 숫자를 문자열로 변환함. |
| toPrecision() | 입력받은 수만큼 유효 자릿수를 사용하여 숫자를 문자열로 변환함. |
메소드(method)란 객체의 프로퍼티 값으로 함수를 갖는 프로퍼티를 의미한다.
불리언 값을 문자열로 변환
불리언 값을 문자열로 변환하는 방법에는 String() 함수와 toString() 메소드를 사용하는 방법이 있다.
String(true); // 문자열 "true"
false.toString(); // 문자열 "false"숫자를 문자열로 변환
숫자를 문자열로 변환하는 가장 간단한 방법은 String() 함수를 사용하는 것이다. 또한, null과 undefined를 제외한 모든 타입의 값이 가지고 있는 toString() 메소드를 사용할 수도 있다.
숫자(Number) 객체는 숫자를 문자열로 변환하는 다음과 같은 메소드를 별도로 제공한다.
toExponential()
toFixed()
toPrecision()
메소드설명
| toExponential() | 정수 부분은 1자리, 소수 부분은 입력받은 수만큼 e 표기법을 사용하여 숫자를 문자열로 변환함. |
| toFixed() | 소수 부분을 입력받은 수만큼 사용하여 숫자를 문자열로 변환함. |
| toPrecision() | 입력받은 수만큼 유효 자릿수를 사용하여 숫자를 문자열로 변환함. |
메소드(method)란 객체의 프로퍼티 값으로 함수를 갖는 프로퍼티를 의미한다.
불리언 값을 문자열로 변환
불리언 값을 문자열로 변환하는 방법에는 String() 함수와 toString() 메소드를 사용하는 방법이 있다.
String(true); // 문자열 "true"
false.toString(); // 문자열 "false"
- ==, ===
== 연산자와 ===연산자 둘 다 값을 비교하기 위해 사용한다.
그 중 == 연산자는 타입을 제외하고 변수에 선언된 값만으로 비교한다.
그리고 ===연산자는 연산자의 타입을 변환하지 않고 비교하기 때문에
값이 같고 타입이 다르면 false이다 그리고 한 가지 특징은
값에 NaN이 있을 경우는 항상 false이다
따라서 NaN === NaN값도 false라고 판단한다.
- 느슨한 타입(loosely typed)의 동적(dynamic) 언어의 문제점은 무엇이고 보완할 수 있는 방법에는 무엇이 있을지 생각해보세요.
실행 도중에 변수에 예상치 못한 자료형이 들어와 TypeError를 발생할 수 있다.
그리고 동적타입 언어는 런타임('크롬, 사파리,node.js' 와 같은 웹 브라우저로 언어가 구동되는 환경) 시
확인할 수 밖에 없기 때문에, 코드가 길고 복잡해질 경우 타입 에러를 찾기가 어려워진다.
이러한 문제를 보완할 수 있는 방법은 변수 선언이 꼼꼼하게 이루어지지 않는 한
혼자만의 작업이 아닐 경우도 많고 양이 많은 코드를 작성시에는
막기 어려울 것이라고 생각한다
문제점을 보완하기 위해 자바스크립트의 언어를 기반으로 타입 안정성을 보완한 타임스크립트를 이용해서
보완할 수 있다. 정적 타입 언이이기때문에
변수에 타입을 직접 지정할 수 있게 해주는게 도움이 된다.
-예시-
let name: string = "hello";
console.log(name.toUpperCase()); // HELLO 출력
name = 1; // 에러 발생
console.log(name.toUpperCase()); // 에러 발생
- undefined와 null의 미세한 차이들을 비교해보세요.
undefined는 변수를 선언하고 값을 할당하지 않은 상태
null은 변수를 선언하고 빈값을 할당한 상태(빈 객체)이다.
즉, undefined는 자료형이 없는 상태이다. 따라서 typeof를 통해 자료형을 확인해보면
null은 object로, undefined는 undefined가 출력되는 것을 확인할 수 있다.
typeof null // 'object'
typeof undefined // 'undefined'
null === undefined // false
null == undefined // true
null === null // true
null == null // true
!null // true
isNaN(1 + null) // false
isNaN(1 + undefined) // true