[자바스크립트] 변수

2023. 6. 16. 15:26·JavaScript
목차
  1. 1. 변수
  2. 1.2 변수 선언
  3. 2. 상수
  4. 2.1 상수의 특징
  5. 3. 실습 - 나이 계산 프로그램
  6. 3.1 태어난 연도를 입력 받고 나이를 출력하는 프로그램
728x90
반응형

1. 변수

자바스크립트에서 변수는 값을 보유하는 명명된 컨테이너입니다. 변수는 프로그램 실행 중에 데이터를 저장하고 조작하는 데 사용됩니다. 자바스크립트의 변수는 동적으로 유형이 지정됩니다. 즉, 동일한 변수에 다른 유형의 값을 할당할 수 있습니다.

 

1.2 변수 선언

자바스크립트에서 변수를 선언하려면 var, let 또는 const 키워드와 변수 이름을 사용합니다.

소스와 함께 살펴보자면

위의 예에서 age, name 및 PI는 변수 이름입니다. 나중에 코드에서 값을 할당할 수 있습니다.

var 키워드는 전통적으로 변수 선언을 위해 자바스크립트에서 사용되었지만 let 및 const는 ECMAScript 6(ES6)에서 도입되어

블록 범위와 더 나은 변수 관리를 제공합니다.

 

2. 상수

상수는 변수와 유사하지만 한 번 할당이 되면 변경될 수 없다는 특징을 가지고 있습니다.

상수는 const 키워드를 사용해서 선언하고 프로그램 전체에서 값을 일정하게 유지하려고 할 때 유용하게 사용됩니다.

 

2.1 상수의 특징

  • 상수는 선언 시 값을 할당해야 하며 이후에는 이 값을 수정할 수 없습니다.
  • 상수는 블록 범위이므로 정의된 블록 내에서만 액세스할 수 있습니다.
  • 상수는 실수로 변경해서는 안 되는 값을 선언하여 코드 가독성을 높이고 의도하지 않은 수정으로 인한 버그를 방지하는 데 유용합니다.

3. 실습 - 나이 계산 프로그램

우선 소스를 살펴보자면 올해 연도를 저장할 변수를 currentYear로 선언하고 태어난 연도를 저장할 변수를 birthYear,

계산된 나이를 저장할 변수는 age로 선언하였습니다.

나이 계산 프로그램

age 변수에 값을 저장하기 위해서 태어난 연도를 대충 2002년으로 가정한다면 currentYear은 현재 연도이니 2023을 넣어주고

birthYear에는 태어난 연도인 2002를 넣어줬습니다. 

 

변수 age에는 올해 연도에서 태어난 연도를 빼고 1을 더한 식을 저장하게 되면 현재 나이가 age 변수에 저장되게 됩니다.

 

소스 코드를 실행해보면 아래 사진처럼 창이 나오게 되고 나이 계산 시작하기 버튼을 클릭하면

실행 결과
실행 결과

"당신의 나이는 22세입니다." 라는 출력 결과를 확인하실 수 있습니다.

 

3.1 태어난 연도를 입력 받고 나이를 출력하는 프로그램

prompt() 함수를 사용하면 사용자가 값을 입력할 수 있기 때문에 prompt() 함수를 사용해서 위 실습 소스를 응용해보겠습니다.

사용자의 태어난 연도를 입력받고 나이 계산하는 프로그램

기존 소스에서 16행에 prompt() 함수를 사용해서 소스 코드를 바꿔보았습니다.

해당 소스 코드를 실행하면 결과는 아래 사진처럼 나오게 됩니다.

실행 결과

이번에는 2000년에 태어났다고 가정을 하고 2000을 입력해보겠습니다.

실행 결과

"당신의 나이는 24세입니다." 라는 문장이 출력되면서
프로그램이 정상적으로 실행되는 것을 확인할 수 있습니다.

728x90
반응형

'JavaScript' 카테고리의 다른 글

[자바스크립트] 연산자(2)  (0) 2023.07.05
[자바스크립트] 연산자(1)  (0) 2023.07.04
[자바스크립트] 자료형  (5) 2023.06.21
[자바스크립트] 자바스크립트의 개념과 특징  (0) 2023.05.29
[프론트엔드] 네트워크, 인터넷, 웹, 자바스크립트  (0) 2023.02.16
  1. 1. 변수
  2. 1.2 변수 선언
  3. 2. 상수
  4. 2.1 상수의 특징
  5. 3. 실습 - 나이 계산 프로그램
  6. 3.1 태어난 연도를 입력 받고 나이를 출력하는 프로그램
'JavaScript' 카테고리의 다른 글
  • [자바스크립트] 연산자(1)
  • [자바스크립트] 자료형
  • [자바스크립트] 자바스크립트의 개념과 특징
  • [프론트엔드] 네트워크, 인터넷, 웹, 자바스크립트
P_Piano
P_Piano
Apple 생태계 개발자가 되기 위한 학습과 경험의 기록

P_Piano님의
글이 좋았다면 응원을 보내주세요!

응원하기
응원은 창작의 힘

이 글이 도움이 됐다면, 응원 댓글을 써보세요. 블로거에게 지급되는 응원금은 새로운 창작의 큰 힘이 됩니다.

카카오 계정으로 누구나

응원 댓글은 만 14세 이상 카카오계정 이용자라면 누구나 편하게 작성, 결제할 수 있습니다.

응원 댓글 강조

글 본문, 댓글 목록 등을 통해 응원한 팬과 응원 댓글, 응원금을 강조해 보여줍니다.

쉬운 결제

응원금은 앱에서는 인앱결제, 웹에서는 카카오페이 및 신용카드로 결제할 수 있습니다.

응원 수익은 창작자에게 큰 힘이 됩니다.
응원 금액
응원 댓글
  • 창작 활동에 대한 감사와 격려의 의미로 창작자를 응원합니다.
  • '응원하기'는 자발적 결제이므로 청약철회(환불) 불가능합니다.
  • '응원하기'는 만 14세 이상 인증 사용자만 이용할 수 있습니다. 만 19세 미만 미성년 회원의 경우, 법정대리인이 응원하기 결제 이용에 동의하지 않으면 미성년자 본인 또는 법정대리인이 그 결제 내용을 취소할 수 있습니다.
  • '응원하기' 이용을 위한 자세한 내용은 티스토리 이용약관 및 카카오 유료서비스 이용약관을 따릅니다.
(주) 카카오 대표이사 정신아
사업자 등록 번호 120-81-47521
통신판매업신고번호 제2015-제주아라-0032호
주소 제주특별자치도 제주시 첨단로 242(영평동)
호스팅사업자 (주)카카오
고객센터 1577-3754
이메일 help.notice@kakaocorp.com
피피아노의 개발 일지
IT 분야 크리에이터
Apple 생태계 개발자가 되기 위한 학습과 경험의 기록
    반응형
    250x250
  • P_Piano
    피피아노의 개발 일지
    P_Piano
  • 전체
    오늘
    어제
    • 분류 전체보기 (201) N
      • Apple (119) N
        • iOS (22)
        • visionOS (4)
        • Swift (65) N
        • UIKit (2)
        • SwiftUI (20)
        • RxSwift (2)
        • Xcode (4)
      • C언어 (5)
      • C++ (8)
      • Dart (1)
      • Python (3)
      • JavaScript (17)
      • Git (1)
      • CS (39)
        • 디자인 패턴 (6)
        • 네트워크 (20)
        • 운영체제 (8)
        • Database (5)
        • 자료구조 (0)
      • IT 지식 (2)
      • IT 뉴스 (4)
      • 출처 표기 (1)
  • 블로그 메뉴

    • 홈
    • 태그
    • 방명록
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    visionOS
    티스토리챌린지
    swiftUI
    코딩테스트
    클래스
    Optional
    스위프트
    제어문
    Vision Pro
    자바스크립트
    Initializers
    운영체제
    프로세스
    combine
    이니셜라이저
    네트워크
    변수
    함수
    프로퍼티 래퍼
    옵셔널
    오블완
    디자인패턴
    UIKit
    비동기
    배열
    연산자
    ios
    메서드
    Xcode
    SWIFT
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.1
P_Piano
[자바스크립트] 변수

개인정보

  • 티스토리 홈
  • 포럼
  • 로그인
상단으로

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.