여러 개의 변수를 한꺼번에 선언할 때 아래처럼 , 로 구분하면 var를 한번만 쓰고도 여러 변수를 만들 수 있다.
마지막 끝낼때는 ; 로 끝내기
변수
변수는 변하는 값을 저장할 수 있는 메모리 공간. 데이터를 담을 수 있는 그릇이라고 할 수 있다.
변수에는 데이터가 오직 한 개만 저장된다. 만약 새로운 데이터가 들어오면 기존에 있던 데이터는 사라지고 마지막에 들어온 데이터만 남는다.
변수에 담을 수 있는 데이터의 종류로는 문자형(String), 숫자형(Number), 논리형(Boolean), 그리고 빈(Null)데이터와 undefined 데이터가 있다.
변수 선언
변수를 사용할 준비를 하는 과정을 '변수 선언'이라고 함. 변수를 선언할 때에는 var 키워드를 변수명 앞에 붙여준다.
변수명에는 한글을 사용할 수 없으며, 영문과 숫자, 일부 특수문자( _,$ )만 포함할 수 있다.
변수명은 의미에 맞게 만드는 것이 좋다.
예를 들어 사용자의 이름을 넣을 변수라면 var userName = '김땡땡'; 이런 식으로 짓는 것이 좋다.
만약 변수명이 단어와 단어의 조합으로 되어있다면 두번째 단어의 첫 글자는 대문자로 써준다. ex) userName
이런 코딩 컨벤션(코딩규칙)을 낙타의 등 모양과 닮았다하여 '카멜 표기법' '낙타 표기법'이라함.
낙타표기법 / 카멜 표기법:
두개의 단어를 합쳐서 이름을 만들때 두번째 단어의 첫글자를 대문자로 쓰는 방식
ex) firstName, lastName, masterCard, interCity.
userName 또는 user_name 이런 식으로 지어도 된다.
변수이름을 지을 때는 약자를 되도록이면 쓰지 않아야한다. 이름이 겹쳐지면 위에 있는 변수가 취소되기 때문이다.
[기본형]
1. var 변수명 = 값; -> 변수 안에 초기값을 넣어 초기화한 상태 / 변수에 어떤 값을 넣으면 초기화 상태다.
2. var 변수명; -> 변수를 만든 상태
(undefined가 할당된 상태. 변수만 만들어진 상태인데 그 안에 undefined가 들어가있는 것 )
document.write("데이터")
: 브라우저에 ('')안에 있는 문자를 표시할 때 사용하는 문법.
document : html 문서를 뜻한다.
'브라우저 화면에 써라 "hello world"를 -' 이라는 뜻이다.
console.log(데이터)
: 브라우저 개발자 도구에 '콘솔창'이라는 것이 있다.
이 콘솔 창에서는 자바스크립트 코드의 진행같은 것을 간단하게 출력해 볼 수 있다.
콘솔창에 데이터 결과를 확인하고 싶을 때 consol.log()를 사용한다.
var num = 3; -> 변수 이름이 num이라는 뜻이다.
console.log( ) 이 가로 사이에 (num)처럼 변수 이름을 불러온다. 이때 (" ") 가로 안에 따옴표를 쓰면 안된다.
이렇게 불러오면 개발자도구 콘솔 창에 내가 쓴 값이 뜨게 된다.
따옴표를 쓰게 되면 문자형 데이터가 된다. '3'은 문자형 숫자라 연산을 할 수 없다.
처음에 변수를 3으로 줬는데 변수값을 변경하고 싶다면,
변수 이름으로 불러와서 값을 다시 써준다. ex) num = 10; 이렇게.
num을 전에 설정해놨으니 num만 불러와서 값을 바꿔주면 되는 것이다.
var num=10; 으로 다시 불러오면 값을 변경 시키는 게 아니라 전의 변수가 취소되니 조심해야 한다. **
값을 변경하고 다시 console.log( 변수이름 ) 적어주면 다시 콘솔창에 출력된다.
3이 사라지고 10으로 변경된 상태/ 오직 하나만 담을 수 있다.
<title>변수</title>
</head>
<body>
<!-- <script> : 자바스크립트 선언문 -->
<script>
"use strict"; //엄격한 자바스크립트 ES6문법을 사용하겠다는 의미.
html에 내부 자바스크립트로 script 를 쓸 때 엄격한 ES6 문법을 따르고 싶다면 아래에 "use strict"; 를 선언해주면 된다.
'자바스크립트 > 변수' 카테고리의 다른 글
[자바스크립트] - 변수 let / 함수레벨의 스코프(함수영역) , 블록레벨의 스코프(블록영역) (1) | 2024.07.25 |
---|---|
[자바스크립트] -스코프 / 지역변수(로컬변수) / 전역변수(글로벌변수) (0) | 2024.07.25 |
[자바스크립트] - var를 이용한 변수의 특징 - 호이스팅 hoisting을 한다 (0) | 2024.07.25 |
[자바스크립트] - 변수 이름 지을 때 규칙 (코딩 컨벤션) (0) | 2024.07.05 |
[자바스크립트] - 변수에 담을 수 있는 자료형 / 문자형(String), 숫자형(Number), 논리형(Boolean), 빈 데이터(Null, undefined) //문자형 숫자를 다시 숫자형 데이터로 변환하고 싶을때 (0) | 2024.07.05 |