Search

반응형

'자바스크립트'에 해당되는 글 38건

  1. 2021.11.07 [왕초보]자바스크립트의 데이터 타입, 문자열 타입 이해하기.
  2. 2021.09.20 [왕초보]자바스크립트의 데이터 타입 ,원시 타입 중 숫자 타입(number) 이해하기.
반응형

안녕하세요. 신기한 연구소입니다.

여러 가지 책을 보니 시간이 많이 부족하다는 생각이 드네요.

그래도 읽을 책이 많다는 건 행복한 일이 아닐까 싶네요.

오랜만에 자바스크립트 책을 펴 봅니다.

이제 하나씩 끝장을 내야지 짬짬 펴서 읽으니 기억이 가물거리네요.

이번 포스팅은 자바스크립트의 문자열 타입에 대해 알아봅니다.

보통 프로그래밍 언어는 문자열을 다룰 수 있습니다.

자바스크립트도 문자열을 당연히~ 다루겠지요?

어떻게 잘 다루면 되는지 같이 살펴보겠나이다.

 

문자열이란? 바로 여러분이 생각하는 바로 그 글자들입니다.

한글, 영어, 한자어 등등 다양한 언어들과

숫자, 기호 등 문자로 표현할 수 있는 모든 것일 말하는 것이랍니다.

유니코드 문자로 웬만한 문자는 모두 표현이 가능합니다. ( UTF-16)

 

문자열 샘플을 같이 볼께요.

 

1
2
3
4
5
var str1 = "My name is Double quotation String\n";
var str2 = 'My name is Single quotation String\n';
var str3 = `My name is Backtick String`;
 
alert(str1 + str2 + str3);
cs

문자열은 무엇으로 감싸줘야 합니다.

보통 Doublic Quitation (")을 사용하지만

자바스크립트는 무려 3가지를 지원합니다.

", ', `로 Doublic Quotation, Single Quotation, BackTick 이 세 가지입니다.

 

이렇게 문자열을 감싸지 않고 변수에 할당을 하면

그 문자열을 변수로 인식하고 할당되지 않았다면 오류가 발생됩니다.

 

다음 예제로 확인해 봅니다.

경고 라인이 나타나 마우스를 올려보니

'str' 이름을 찾을 수 없습니다. 'str1'을(를) 사용하시겠습니까? 

라는 문구가 보입니다.

 

그렇다면 실제로 다음과 같은 출력을 문자열에 넣고 싶다면

어떻게 해야 할까요?

그는 어제 "난 엄청 배가 고프다고"라고 말했다.

또는, 

그녀는 방금 '이 상황을 어찌 해결할까'라고 생각했다.

 

이렇게 문자열 안에 " 또는 '를 넣고 싶다면

다음과 같이 사용하면 된다.

 

1
2
3
4
var str1 = '그는 어제 "난 엄청 배가 고프다고" 라고 말했다.\n';
var str2 = "그녀는 방금 '이 상황을 어찌 해결 할까?'라고 생각했다\n";
 
alert(str1 + str2);
cs

주의할 점은 " " 안에는 ''로 ' ' 안에는 " "로 써야 오류가 발생하지 않는다.

당연한 거 아닌가?

사실 자바는 문자열을 String이라는 객체 형태로 사용하지만

자바스크립트의 문자열은 원시형 타입니다.

또한 값을 바꿀 수 없는 타입이다.

무슨 의미일까?

반응형
반응형

안녕하세요. 신기한 연구소입니다.

이번 포스팅은 자바스크립트에서 원시 타입 중 숫자에 대해 같이 알아보도록 하겠습니다.

자바스크립트에서는 원시 타입과 객체 타입이 있습니다. 

자바스크립트에서는 총 6가지의 원시 타입이 있습니다.

ES6에서 나타난 심벌타입은 다음에 따로 확인하겠습니다.

그래서 이번 포스팅에서는 5가지의 원시 타입 중 숫자 타입에 대해 알아봅니다.

 

자바스크립트에서 숫자 타입(number)는 정수, 실수를 구분하지 않습니다.

그냥 하나의 number 타입으로 사용합니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
var int = 100;
var minusInt = -100
var dbl = 200.25;
 
var bi = 0b100;
var otc = 0O100;
var hex =0xa;
var hex2 =0x100;
 
console.log(int);
console.log(typeof int);
console.log(minusInt);
console.log(typeof minusInt);
console.log(dbl);
console.log(typeof dbl);
 
console.log(bi);
console.log(typeof bi);
console.log(otc);
console.log(typeof otc);
console.log(hex);
console.log(typeof hex);
console.log(hex2);
cs

결과

1
2
3
4
5
6
7
8
9
10
11
12
13
100
number
-100
number
200.25
number
4
number
64
number
10
number
256
cs

정수, 음의 정수, 실수, 2진수, 8진수, 16진수 모두 typeof로 확인한 결과 number로 나옵니다.

다음은 Infinity에 대해 알아봅니다.

1
2
3
4
5
6
7
8
9
10
var a = 10000000000000000;
 
console.log(a);
console.log(a ** 2);
console.log(a ** a);
 
 
console.log(a === Infinity);
console.log((a ** 2=== Infinity);
console.log((a ** a) === Infinity);
cs

 

a에 엄청 큰 숫자를 할당했습니다.

6가지 로그를 출력했는데 어떤 결과가 나올까요?

1
2
3
4
5
6
10000000000000000
1e+32
Infinity
false
false
true
cs

 

3번 라인을 출력하면 a값 그대로 출력됩니다.

4번 라인은 너무 큰 값이 되어서 e의 32로 표현됩니다.

5번 라인은 측정할 가치가 없을 정도로 너무 커서 Infinity(무한)으로 표기됩니다.

10번 라인의 경우 Infinity로 비교했을 때 true가 됩니다.

 

1
2
3
4
5
6
7
8
var b = '3';
 
console.log(b * 3);
console.log(b * 'a');
 
console.log(typeof b);
console.log(typeof (b * 3));
console.log(typeof (b * 'a'));
cs

위 예제를 보겠습니다.

b에 문자 '3'을 할당했습니다.

결과를 보겠습니다.

1
2
3
4
5
9
NaN
string
number
number
cs

3라인은 문자 '3'에 3을 곱하니 결과 1라인의 9가 나왔습니다.

문자 '3'이 형변환 되었네요.

4라인은 '3'에 'a'를 곱하니 NaN이 나왔습니다.

NaN은 Not a Number의 약자로 숫자가 아니라는 의미입니다.

'3'의 타입을 확인하니 3라인의 string으로 출력됩니다.

'3' * 3은 9가 나오고 number 타입이며

'3' * 'a'는 NaN이 나오는데 역시 number 타입입니다.

즉, NaN은 number라는 의미입니다. 잘 기억하세요.

지금까지 숫자 타입(number)에 대해 알아봤습니다.

자바스크립트에서는 숫자가 정수, 실수 구분 없이 사용되며

문자열로 된 숫자도 계산이 가능하고

숫자 형식으로 사용할 수 없으면 NaN으로 나타납니다.

NaN도 타입은 number입니다.

코딩의 즐거움은 직접 만들어가는 겁니다.

즐코딩 하세요~

반응형