[Javascript] 자료형, 정적타입, 동적타입, 문자열, 부수효과,이스케이프

JS의 특징 1. 동적타입을 가진 언어이다.

정적 타입과 달리 유동적으로 자료형을 바꿀 수 있다.

• 특정 값이 할당된 변수에, 그와 다른 자료형의 값을 넣는 것이 가능
• 자유롭지만 그만큼 자료형 관련 오류들에 취약함
• 오늘날 TS가 뜬 이유

참고로, 자료형 확인은 typeof 명령어를 사용하면 된다.

 

I. 기본 표기방법

작은따옴표 - ' ~ '

큰따옴표 - " ~ "

 

 

📌 자주 사용되는 이스케이프 표현

이스케이프 표현대체

\'	작은따옴표
\"	큰따옴표
\n	줄바꿈
\t	탭
\\	백슬래시

let word = '안녕하세요~\t\t반갑습니다!\n저는 \\홍길동\\입니다.';

console.log(word);

👉 이스케이프 표현 MDN 문서 보기

긴 문자열을 여러 줄에 표현

const longstr =

' aaaaaaaaaaaaaaaaaa \

 bbbbbbbbbbbbbbbbbb \

 cccccccccccccccccccc \

ddddddddddddddddd';

II. 백틱 - ` ~ `

let word = `헬로헬로~ 🤩`;

console.log(word);

⭐️ 문자열 안에 탭과 줄바꿈 그대로 사용 가능!

let word = `안녕하세요~ 반갑습니다!

저는 \\홍길동\\입니다.`;

console.log(word);

템플릿 리터럴

👉 MDN 문서 보기

const NAME = '홍길동';

let age = 20;

let married = false;

​

console.log(

`제 이름은 ${NAME}, 나이는 ${age}세구요, \

${married ? '기혼' : '미혼'}입니다.`

);

• ${}안에 상수나 변수, 표현식 등을 삽입 가능
• 다른 자료형도 사용할 수 있음

 

I. 비교

연산자의미 - ⭐️ 반환하는 여부비고

x == y	값이 같다.
x === y	자료형도 값도 같다.	권장
x != y	값이 다르다.
x !== y	자료형 또는 값이 다르다.	권장
x < y	사전순상 x가 먼저 온다.
x <= y	사전순상 x가 먼저 오거나 같다.
x > y	사전순상 y 먼저 온다.
x >= y	사전순상 y 먼저 오거나 같다.

 

표기방식 구분하지 않음(  '  '  === "  " ) 

대소문자 구분

==, != - 자료형 구분하지 않음 ⭐️ 암묵적 타입 변환

===, !== - 자료형 구분

 

<, <=, >, >= - 사전순 비교

대 < 소문자, a < z, 하 <가, 2글자 < 3글자,

문자('100')와 숫자  비교시 숫자로 변환

 

 

II. 연결

연산자의미부수효과

x + y	x와 y를 이어붙인 값을 반환
x += y	x에 y를 이어붙이고 그 결과를 반환	✅

 

 

할당 연산자 (+=) : 부수 효과

 

let str1 = '헬로';
str1 += ' 월드';

// 값 반환
let str2 = str1 += '~~~';


// 부수효과
console.log(str1); //헬로 월드~~~

// ⚠️ 오류. 왼쪽 값은 부수효과의 대상(변수)이어야 함
let str = '헬로' += '월드';

+= 연산자 사용시 왼쪽에 오른쪽 값이 추가됨

 

다수의 문자열 이어붙이기

const lyric1 = '노는 게 제일 좋아'
+ '\n친구들 모여라'
+ '\n언제나 즐거워'
+ '\n개구쟁이 뽀로로';

console.log(lyric1);

let lyric2 = '눈 덮인 숲 속 마을';
lyric2 += '\n꼬마펭귄 나가신다';
lyric2 += '\n언제나 즐거워';
lyric2 += '\n뽀롱뽀롱뽀롱뽀롱 뽀로로';

console.log(lyric2);

 

💡 다른 자료형과 더하면 문자열 반환

 

let result = '안녕' + 1 + true;
console.log(result); // 안녕1true
console.log(typeof result); // string