#1 변수

2026. 1. 6. 16:30·JavaScript/기초
반응형

변수?

어떤 정보에 이름을 붙여서 저장하고 싶을 때 사용한다.

name = "Mike";
age = 30;
class = "수업"   //error 발생
  • 세미콜론( ; ): 한 줄이 끝났다는 것을 의미. 생략이 가능하지만 적어주는 게 좋다
  • 문자는 항상 따옴표로 감싸준다. (큰따옴표, 작은따옴표 상관 X)
  • 클래스같은 경우는 자바스크립트에서 이미 사용하는 변수명이기 때문에 사용할 수 없다
  • → 이런 단어들을 예약어(Reserved Words)라고 한다

변수를 위와 같이 사용하면 위험하다

 

이유: 개인프로젝트라면 괜찮지만, 여러 사람과 함께 하는 프로젝트라면 다른 개발자가 name이나 age 같은 변수를 사용하면?
→ 마지막으로 선언된 내용으로 덮어씌워 지게 된다

 

따라서 let, const 를 사용해야 함


let 과 const

let

  • 이미 변수가 사용 중 일 때 에러를 발생시켜 확인할 수 있게 해준다
let name = "Mike";

// 1000 lines .

let name = "yeonseok";

 

const

  • 절대 바뀌지 않는 상수를 입력할 때 사용
  • const로 선언된 변수를 바꾸려고 하면 에러가 발생
  • 보통 바뀌지 않는 π, 생일, 날짜 등을 입력할 때 사용하며, 대문자로 선언하는 게 좋다.
const PI = 3.14;
const BIRTH_DAY = '2002-01-24';
//개발자들에게 이게 상수다 라고 알리는 것

 

요약

  • 변하지 않는 값은 const
  • 변할 수 있는 값은 let 선언

팁, 

전부 const로 선언 후 변할 것 같은 값을 let으로 수정


변수 접근

alert()

  • 창을 띄우는 함수
const name = "Mike";
const age = 30;

alert(name);

 

console.log()

  • 로그를 찍는 함수
const name = "Mike";
const age = 30;

console.log(30);


변수 규칙

  1. 변수는 문자와 숫자, $ , _ 만 사용
  2. 첫 글자는 숫자 안됨
    EX) const 2_day = ‘A’; (x)
  3. 예약어는 사용 X
    EX) class = 클래스;
  4. 가급적 상수는 대문자
  5. 변수명은 읽기 쉽고 이해할 수 있게 선언
    EX) let a = 1; (x), let userNumber = 1; (o)
반응형

'JavaScript > 기초' 카테고리의 다른 글

#6 비교 연산자와 조건문  (0) 2026.01.06
#5 연산자  (0) 2026.01.06
#4 형 변환  (0) 2026.01.06
#3 alert, prompt, confirm  (0) 2026.01.06
#2 자료형  (0) 2026.01.06
'JavaScript/기초' 카테고리의 다른 글
  • #5 연산자
  • #4 형 변환
  • #3 alert, prompt, confirm
  • #2 자료형
y3onbug5
y3onbug5
y3onbug5 님의 블로그 입니다.
  • y3onbug5
    y3onbug5 님의 블로그
    y3onbug5
  • 전체
    오늘
    어제
    • 분류 전체보기 (167) N
      • Alpacahack (19) N
      • Dreamhack 워게임 (49)
        • Lv.1 (40)
        • Lv.0 (4)
        • LV.2 (3)
        • LV.3 (2)
      • [Dreamhack] Web Beginner (3)
      • [Dreamhack] Web Hacking (17)
        • 웹 기초 지식 (4)
        • Cookie & Session (2)
        • Cross-Site Scripting(XSS) (1)
        • Cross-Site Request Forgery (1)
        • SQL Injection (4)
        • NoSQL Injection (2)
        • Command Injection (1)
        • File Vulnerability (1)
        • Server-Side Request Forgery (1)
      • [Dreamhack] Web Hacking Client-Side (10)
        • XSS Filtering Bypass (2)
        • Content Security Policy (CSP) (2)
        • CSRF,CORS Bypass (2)
        • Client-Side Template Injection (CSTI) (1)
        • CSS Injection (1)
        • Relative Path Overwrite (RPO) (1)
        • DOM Vulnerability (1)
      • [Dreamhack] Web Hacking Server-Side (15)
        • SQL Injection Advanced (4)
        • SQL Injection Advanced - Fingerprinting (2)
        • NoSQL Injection Advanced (3)
        • Command Injection Advanced - Web Servers (3)
        • File Vulnerability Advanced - Web Server (3)
      • [Dreamhack]Black-Box Penetration Testing (15)
        • DreamCommunity Penetration Testing (11)
      • [Dreamhack] LLM (2)
        • [Dreamhack] LLM과 프롬프트 엔지니어링 (2)
      • Web 공부 (4)
      • Web Study (15)
      • JavaScript (17)
        • 기초 (12)
        • 중급 (4)
      • 웹 개발(Flask) (0)
      • [Security First] web 기초교육 (1) N
  • 블로그 메뉴

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

  • 공지사항

  • 인기 글

  • 태그

    webstudy
    xss
    alpacahack
    JS
    cve
    hacking
    CSRF
    LLM
    webhacking
    web
    JavaScript
    DreamHack
    드림핵
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.5
y3onbug5
#1 변수
상단으로

티스토리툴바