Jin's Dev Story

[JavaScript] 자료와 변수 본문

Programming Language/JavaScript

[JavaScript] 자료와 변수

woojin._. 2023. 8. 31. 21:04

기본 자료형

문자열 자료형

  • 큰 따옴표를 사용하거나 작은 따옴표를 사용한다.
  • 이스케이프 문자
    • \n : 줄바꿈
    • \t : 탭
    • \ : 역슬래시()
  • 문자열 연산자
    • 덧셈 기호(+) 사용 → 덧셈 기호를 문자열 연결 연산자라고 함
    • 문자열 + 문자열 → 문자열 연결 연산자
        > '가나다' + '라마' + '바사아' + '자차카타' + '파하'
        "가나다라마바사아자차카타파하"
  • 문자 선택 연산자
    • 문자열[숫자]
    • 위치를 나타내는 숫자 → 인덱스
            > '안녕하세요'[0]
            "안"
  • 문자열 길이 구하기
        > "안녕하세요".length
        5

 

 

숫자 자료형

  • 사칙 연산 가능 (+, -, *, /)
  • 나머지 연산자(%)

 

불 자료형

  • true, false
  • 비교 연산자 사용 가능연산자설명 
    === 양쪽이 같다
    !== 양쪽이 다르다
    > 왼쪽이 더 크다
    < 오른쪽이 더 크다
    왼쪽이 더 크거나 같다
    오른쪽이 더 크거나 같다
    <script>
        if(273 < 52) {
            alert('273은 53보다 작습니다.')
        }
        if(273 > 52) {
            alert('273은 53보다 큽니다.')
        }
    </script>
  • 불 부정 연산자 (!)
  • 논리합(||) & 논리곱(&&) 연산자

자료형 검사 - typeof

  • typeof(자료)
> typeof('문자열')
"string"
> typeof(273)
"number"

템플릿 문자열

  • 백틱 기호 (`)
  • ${...} 기호 사용
> console.log('표현식 273 + 53의 값은 ' + (273 + 52) + '입니다...!')
표현식 273 + 52의 값은 325입니다...!

> console.log('표현식 273 + 53의 값은 ${273 + 52}입니다...!')
표현식 273 + 52의 값은 325입니다...!

상수와 변수

상수

  • 값에 이름을 한 번 붙이면 값을 수정할 수 없다
  • const 키워드
  • const 이름 = 값
> const pi = 3.141592
undefined
> pi
3.141592

> const r = 10
undefined

> 2 * pi * r   // 반지름으로 원의 둘레 구하기
62.83184
> pi * r * r   // 반지름으로 원의 넓이 구하기
314.1592

변수

  • 변할 수 있는 수로 값을 수정할 수 있다
  • let 키워드
> let pi = 3.141592
undefined
> pi
3.141592

> let = 10
undefined

> 2 * pi * r   // 반지름으로 원의 둘레 구하기
62.83184
> pi * r * r   // 반지름으로 원의 넓이 구하기
314.1592
  • 복합 대입 연산자복합 대입 연산자설명사용 예의미
    += 기존 변수의 값에 값을 더한다 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
    <script>
        let list = ''
    
        list += '<ul>'
        list += '   <li>Hello</li>'
        list += '   <li>JavaScript..!</li>'
        list += '</ul>'
    
        document.write(list)
    </script>

  • 증감 연산자증감 연산자설명
    변수++ 기존의 변수 값에 1을 더한다(후위)
    ++변수 기존의 변수 값에 1을 더한다(전위)
    변수— 기존의 변수 값에 1을 뺀다(후위)
    —변수 기존의 변수 값에 1을 뺀다(전위)

자료형 변환

문자열 입력 - prompt()

prompt(메시지 문자열, 기본 입력 문자열)

<script>
	const input = prompt('message', '_default')
	
	alert(input)
</script>

불 입력 - confirm()

confirm(메시지 문자열)

<script>
    const input = confirm('수락하시겠습니까?')

    alert(input)
</script>

숫자 자료형으로 변환하기 - Number()

Number(자료)

> Number("273")
273

> typeof(Number("273"))
"number"
  • NaN : 다른 문자가 들어있어서 숫자로 변환할 수 없는 문자열의 경우

문자열 자료형으로 변환하기 - String()

String(자료)

> String(52.273)
"52.273"

> String(true)
"true"

불 자료형으로 변환하기 - Boolean()

Boolean(자료)

> Boolean(0)
false

> Boolean(NaN)
false

'Programming Language > JavaScript' 카테고리의 다른 글

[JavaScript] 자료의 비파괴와 파괴  (0) 2023.10.13
[JavaScript] 배열  (0) 2023.10.13
[JavaScript] 함수  (0) 2023.09.07
[JavaScript] 조건문  (0) 2023.09.03
[JavaScript] 자바스크립트란?  (0) 2023.08.31