(5)JavaScript - 자료형 (숫자형과 문자열)

숫자형

<script>
    console.log(6 + 7); //덧셈
    console.log(6 - 7); //뺼셈
    console.log(6 * 7); //곱셈
    console.log(5 / 7); //나눗셈
</script>

 

우리가 아는 기본적인 사칙연산 코드이다. 

실행해보면 콘솔창에 결과값이 출력된다.

 

이렇게 자바스크립트는 숫자 형태의 값에 기본적인 사칙연산이 가능하다.

 

▼나머지 연산(%)

<script>
    console.log(7 % 3); // 나머지 : 몫 :2 나머지: 1
</script>

 

7을 3으로 나눈 나머지 값이므로 결과값이 1 로 출력된다.

 

▼거듭제곱

곱셈에서 별표를 하나 사용하면 곱하기를 의미하는데 별이 두 개면 거듭제곱을 의미한다.

<script>
    console.log(2 ** 3); //거듭제곱 2의3제곱
</script>

해당 거듭제곱은 2의 3제곱(2를 3번 곱하다)이므로 결과값은 8로 출력된다.

 

▼사칙연산의 우선순위

<script>
    console.log(2 + 3 * 2);
    console.log((2 + 3) * 2);
</script>

자바스크립트에서도 일반적인 사칙연산의 우선순위 규칙을 따른다.

2+3*2는 곱셈이 먼저 계산되기 때문에 결과값은 8이며

(2+3)*2는 괄호 내의 연산이 먼저 계산되기 때문에 결과값은 10이다.

 

이렇게 자바스크립트는 숫자 형태의 값을 계산할 때 

계산하는 방식이나 우선순위가 기본적인 사칙연산을 따른다.

 

---

문자열

자바스크립트에서 숫자를 표현하고 싶으면 그냥 숫자를 사용하면 된다.

마찬가지로 소수점도 소수점으로 쓰면 된다.

그렇다면 똑같이 문자도 그냥 쓰면 될까?

<script>
    console.log(7);
    console.log(3.14);
    console.log(섭이);
</script>

어림도없지

 

자바스크립트에서 문자를 표현하고자 할 땐 '문자열'이라는 걸 써야 한다.

문자열은 우리가 사용하는 글자들을 값으로 표현할 때 쓰는 자료형이다.

자바스크립트에서 따옴표 (' ') (" ") 로 둘러싸여 있는 것들은 모두 문자열이라고 볼 수 있다.

 

이렇게 섭이라는 문자에 따옴표를 써주면

<script>
    console.log(7);
    console.log(3.14);
    console.log('섭이');
</script>

 

이렇게 문자열이란 형태의 값으로 인식되어 오류 없이 잘 출력된다.

 

이러한 문자열을 사용해 여러 가지 활용을 해보자

 

▼ 큰따옴표(" ") 작은따옴표 (' ')를 같이 쓰는 용도

예를 들어 영문법에서 I am을 줄이면 I'm인데 작은따옴표로 인해 I 만 문자열로 인식해 버리고

뒤에는 인식을 하지 못해 오류가 발생한다.

<script>
    console.log('I'm SeopE');
</script>

 

▶ 이럴 땐 바깥쪽 따옴표를 큰 따옴표를 사용하면 작은따옴표 하나를 문자열로 인식하여 정상적으로 출력된다.

<script>
    console.log("I'm SeopE");
</script>

 

▼ 문자열 안에 큰따옴표(" ") 작은 따옴표 (' ')를 같이 써야 할 때 용도

1. 역슬래시 ( \ ) 를 사용

<script>
    console.log("He said "I'm SeopE");
</script>

에서 오류가 발생하므로

<script>
    console.log("He said \"I'm SeopE\"");
</script>

처럼

이렇게 양 끝에 감싸는 따옴표와 중복되는 따옴표 앞에 써주면 된다

이것을 문자열 안의 기호라고 이해하면 되는데 큰 따옴표가 양 끝을 감싼다면 안쪽에 있는 큰 따옴표 앞에,

그리고 작은따옴표가 양쪽을 감싼다면, 안쪽에 있는 작은 따옴표 앞에 역슬래시( \ )를 사용해 주면 된다.

헷갈리면 그냥 내부에 있는 따옴표들 앞에 다 역슬래시를 써주면 된다.

 

좀 더 가독성을 높여주기 위해 이러한 방법을 사용하기도 한다.

양 끝을 따옴표가 아닌 백틱 ( ` ) 으로 바꿔주면 되는데 대부분 따옴표 보다 정말 많이 사용한다. 

<script>
   console.log(`He said I'm SeopE`);
</script>

 

이렇게 좀 더 깔끔하게 문자를 잘 출력할 수 있다.

 

▼ 문자열 연산

숫자는 기본적으로 사칙연산을 따른다고 했을 때, 자바스크립트에서 문자열은 더하기가 가능하다.

문자열 덧셈은 문자열을 연결하라는 뜻이며 + 기호를 사용하여 연결한다.

<script>
   console.log('hello' + 'Seope');
</script>

 

실행해 보면 두 문자열을 연결한 helloSeop이 출력된다.

 

문자열은 따옴표를 사용한다고 했을 때,

만약 아래 코드와 같이 숫자에 따옴표를 사용하면 문자열로 인식하기 때문에 3이 아닌 12가 출력이 될 것이다.

<script>
   console.log('1' + '2');
</script>

 

즉 최종 출력값은 문자열 1과 문자열 2이다.