Chapter 02
02장
🌷02-1 기본 자료형
- 자료(data) : 프로그래밍에서 프로그램이 처리할 수 있는 모든것
- 자료형(data type) : 자료 형태에 따라 나눠 놓은 것
자바스크립트 기본 자료형
- 숫자 : 소수점이 있는 숫자와 없는 숫자를 같은 자료형으로 인식함
- 사칙 연산자(+, -, *, /)와 나머지 연산자(%)를 사용함 - 문자열 : 문자 하나 혹은 문자들의 집합. 큰따옴표 혹은 작은 따옴표 안에 문자를 넣어 문자열을 만든다.
- 문자열 연결 연산자(+), 문자 선택 연산자([])를 사용함 - 불 : 참과 거짓값을 표현하 자료형, true와 false를 입력하여 만듦
- 비교 연산자(===, !==, >, <, >=, <=), 불 부정 연산자(!), 논리 연산자(&&, ||)를 사용함 - undefined : 값이 없는 변수
- null : 빈 값
- 문자열 자료형
문자열에 적용할 수 있는 처리
이스케이프 문자(escape character) : 문자열 내부에서 특수한 기능을 수행하는 문자.
\(역슬래시)기호를 사용함
- \" : 문자열에서 따옴표 문자 그대로 사용할 수 있음
- \n : 줄바꿈을 의미
- \t : 탭을 의미
- \\ : 역슬래시 문자 그대로 사용할 수 있음
1. 문자열 연결 연산 : 문자열 + 문자열
2. 문자 선택 연산 : 문자열 [인덱스] → 문자 하나
인덱스(index) : 문자열 같은 자료형에서 선택할 문자의 위치를 나타내는 숫자
자바스크립트는 인덱스를 0부터 센다
| 안 | 녕 | 하 | 세 | 요 |
| [0] | [1] | [2] | [3] | [4] |
3. 문자열의 길이 : 문자열.Length → 문자 개수
- 숫자 자료형
| 연산자 | 설명 | 연산자 | 설명 |
| + | 더하기 연산자 | * | 곱하기 연산자 |
| - | 빼기 연산자 | / | 나누기 연산자 |
| % | 나머지 연산자 |
- 볼 자료형
#볼을 만드는 법
1. true 또는 false를 그대로 입력
2. 비교 연산자를 사용
| 연산자 | 설명 |
| === | 양쪽이 같다 |
| !== | 양쪽이 다르다 |
| > | 왼쪽이 더 크다 |
| < | 오른쪽이 더 크다 |
| >= | 왼쪽이 더 크거나 같다 |
| <= | 오른쪽이 더 크거나 같다 |
볼 논리합/논리곱 연산자
| 연산자 | 설명 |
| && | 논리곱 연산자 : 양쪽 변의 값이 모두 true일 때만 ture |
| || | 논리합 연산자 : 양쪽 변의 값중 하나만 true여도 true |
- 자료형 검사
typeof(자료)
+템플릿 문자열(template string)
문자열 내부에 표현식을 삽입할 때 문자열 연결 연산자(+)를 사용하지 않고 간단하게 문자열과 표현식을 함께 사용할 수 있는 기호.
문자열 내부에 `${...}` 기호를 사용하여 괄호 안에 표현식을 넣어 사용함
+ ==연산자와 !=연산자
===연산자와 !==연산자는 '값과 자료형이 같은지'를 비교하는 연산자
== 연산자와 !== 연산자는 '값이 같은지'를 비교하는 연산자
🌷02-2 상수와 변수
- 상수(constant) : 값을 저장하는 식별자
'항상 값은 값'으로 이름을 한 번 붙이면 값을 수정할 수 없음
상수를 만들 때는 const 키워드를 사용함
- 선언 : 식별자가 어떤 데이터를 가지는지 알려주는 것을 '선언한다'라고 함
const 이름 = 값
- 변수(variable) : 값을 저장하는 식별자
'변할 수 있는 값'
let 이름 = 값
- 변수에 적용할 수 있는 연산자
- 복합대입 연산자 : 대입 연산자와 다른 연산자를 함께 사용하는 연산자
| 복합 대입 연산자 | 설명 | 사용 예 | 의미 |
| += | 기존 변수의 값에 값을 더함 | a += 1 | a = a+1 |
| -= | 기존 변수의 값에 값을 뺌 | a -= 1 | a = a-1 |
| *= | 기존 변수의 값에 값을 곱함 | a *= 1 | a = a*1 |
| /= | 기존 변수의 값에 값을 나눔 | a /= 1 | a = a/1 |
| %= | 기존 변수의 값에 나머지를 구함 | a %= 1 | a = a%1 |
- 증감 연산자
| 증감 연산자 | 설명 |
| 변수++ | 기존의 변수 값에 1을 더함(후위) |
| ++변수 | 기존의 변수 값에 1을 더함(전위) |
| 변수-- | 기존의 변수 값에 1을 뺌(후위) |
| --변수 | 기존의 변수 값에 1을 뺌(전위) |
- undefined 자료형
1. 상수와 변수로 선언하지 않는 식별자
2. 값이 없는 변수
🌷02-3 자료형 변환
- 문자열 입력
문자열 자료형을 입력할 때 사용하는 함수는 prompt()
prompt(메시지 문자열, 기본 입력 문자열)
<코드>
<script>
//상수 선언
const input = prompt('message', '_default')
//출력
alert(input)
</script><결과>
- 볼 입력
문자열 외에 볼 자료형도 값으로 입력받을 수 있음
이때는 confirm() 함수를 사용
confirm(메시지 문자열)
사용자가 [확인] 버튼을 클릭하면 true를 리턴
[취소]버튼을 클릭하면 false를 리턴
- 숫자 자료형으로 변환하기
Number(자료)
- 문자열 자료형으로 변환하기
String(자료)
-볼 자료형으로 변환하기
Boolean(자료)
+ 볼 자료형 변환시 대부분의 자료는 true로 변환되지만
0, NaN, 빈 문자열, null, undefined는 false로 변환함
< inch를 cm 단위로 변경하기>
<코드>
<!DOCTYPE html>
<html lang="en">
<head>
<title>inch를 cm 단위로 변경하기</title>
<script>
//프로그램(program = pr[미리] + gram[작성된것])
//입력 : prompt() inch 단위 숫자
const input = Number(prompt('inch 단위의 숫자를 입력해주세요.'))
//처리 :1inch => 2.54cm
const output = input * 2.54
//출력 : cm 단위의 숫자
alert(`${input}inch = ${output}cm입니다.`)
</script>
</head>
<body>
</body>
</html><실행 화면>
