변수와 상수

정세형·2022년 7월 27일
0

javascript

목록 보기
2/30

변수

변수(variable)는 데이터를 저장할 때 쓰이는 ‘저장소’ 입니다.
let을 사용해 변수를 생성합니다.

let user = 'John';
let age = 25;
let message = 'Hello';

다음과 같이도 표현할 수 있다.

  let user = 'John',
  age = 25,
  message = 'Hello';

let 대신 var

var는 let과 거의 동일하게 동작합니다.
하지만 var는 ‘오래된’ 방식입니다.
let을 쓰세요.

대·소문자 구별

apple와 AppLE은 서로 다른 변수입니다.

변수 명명 규칙

자바스크립트에선 변수 명명 시 두 가지 제약 사항이 있습니다.

1.변수명에는 오직 문자숫자기호 $_ 만 들어갈 수 있습니다.
2. 첫 글자는 숫자가 될 수 없습니다.
다음은 유효한 변수명의 예시입니다.

let userName;
let test123;

달러 기호 $ 와 밑줄 _ 관한 유효한 변수명에 관한 예시

let $ = 1; // '$'라는 이름의 변수를 선언합니다.
let _ = 2; // '_'라는 이름의 변수를 선언합니다.

alert($ + _); // 3

잘못된 변수명에 관한 예시

let 1a; // 변수명은 숫자로 시작해선 안 됩니다.

let my-name; // 하이픈 '-'은 변수명에 올 수 없습니다.

여러 단어를 조합할 때 카멜 표기법(camelCase)를 사용해보세요. 단어를 차례대로 나열 하면서 첫 단어를 제외한 각 단어의 첫글자를 대문자로 작성하는 것입니다. myVeryLongName같이 말이죠.

예약어

예약어(reserved name) 목록에 있는 단어는 변수명으로 사용할 수 없습니다. 이 단어들은 자바스크립트 내부에서 이미 사용 중입니다.

예약어 예시: let, class, return, function

아래 코드는 문법 에러를 발생시킵니다.

let let = 5; // 'let'을 변수명으로 사용할 수 없으므로 에러!
let return = 5; // 'return'을 변수명으로 사용할 수 없으므로 에러!

use strict

use strict은 발생가능한 에러를 예방합니다. 변수는 대개 정의되어 있어야 사용할 수 있습니다. 예전에는 let 없이도 값을 할당해 변수를 생성할 수 있었습니다. use strict를 쓰지 않으면 과거 스크립트와의 호환성을 유지할 수 있습니다.

// 참고: 이 예제에는 "use strict"가 없습니다.

num = 5; // 변수 'num'이 정의되어있지 않더라도, 단순 할당만으로 변수가 생성됩니다.

alert(num); // 5

이렇게 변수를 생성하는 것은 나쁜 관습입니다. use strict 모드에서 에러가 발생합니다.

"use strict";

num = 5; // error: num is not defined

상수

변화하지 않는 변수를 선언할 땐, let 대신 const를 사용합니다.

const myBirthday = '18.04.1982';

const로 선언한 변수를 '상수(constant)'라고 부릅니다. 상수는 재할당할 수 없으므로 상수를 변경하려고 하면 에러가 발생합니다.

const myBirthday = '18.04.1982';

myBirthday = '01.01.2001'; // error, can't reassign the constant!

변하지 않는 값을 선언하고 싶으면 이 변수는 상수라는 것을 알리기 위해 const를 사용합시다.

대문자 상수

기억하기 힘든 값을 변수에 할당해 별칭으로 사용하는 것은 널리 사용되는 관습입니다.

이런 상수는 대문자와 밑줄로 구성된 이름으로 명명합니다.

예시로 웹에서 사용하는 색상 표기법인 16진수 컬러 코드에 대한 상수를 한번 만들어보겠습니다.

const COLOR_RED = "#F00";
const COLOR_GREEN = "#0F0";
const COLOR_BLUE = "#00F";
const COLOR_ORANGE = "#FF7F00";

// 색상을 고르고 싶을 때 별칭을 사용할 수 있게 되었습니다.
let color = COLOR_ORANGE;
alert(color); // #FF7F00

대문자로 상수를 만들어 사용시 장점

COLOR_ORANGE는 "#FF7F00"보다 기억하기가 쉽다.
COLOR_ORANGE를 사용하면 "#FF7F00"보다 오타 확률이 낮다.
COLOR_ORANGE가 #FF7F00보다 코드 가독성이 좋다.

profile
👨‍💻github.com/pos1504 💌pos1504@gmail.com 🙋‍♂️https://www.linkedin.com/in/%EC%84%B8%ED%98%95-%EC%A0%95-68067b287/

0개의 댓글