[JS]04(2)_변수

2u·2023년 3월 20일

JavaScript

목록 보기
39/43
post-thumbnail

1.변수: let

(var는 오래된 키워드)
: '상자' 안에 데이터를 저장하는데 이 상자에 '변수명'이라는 특별한 이름표를 붙이고 문자열, 숫자 등을 담는다고 생각하자!

let message;
message = 'Hello';

-> let 키워드를 사용해 변수를 생성하고 message라고 박스 이름을 정해줬다.
-> hello라는 문자열이 message라는 박스(==메모리 영역)에 저장됬기 때문에 이제 message라는 변수명을 이용해 문자열에 접근할 수 있다.


let message;
message = 'Hello';
message = 'World'; //값이 Hello에서 World로 변경됐음
alert(message); 

-> 값이 변경되면 이전 데이터(Hello)는 제거되고 새로운 데이터가 생성된다.(World)


let Hello = 'Hello world';
let message;

// Hello의 'Hellow world'값을 message에 복사한다
message = Hello;

//이제 두 변수는 같은 데이터를 가진다.
alert(Hello); //Hello world
alert(message); //Hello world

1) 주의

: 변수를 두 번 선언하면 에러가 발생한다.

let message = "This";
let message = "That";
// // SyntaxError: 'message' has already been declared

-> 같은 변수를 여러 번 선언하면 에러가 발생한다.
-> 따라서 변수는 딱 한번만 선언하고, 선언한 변수를 참조할 때는 let없이 변수명만 사용해 참조해야한다.

2) 변수 명명 규칙(4ea)

(1) 변수명에는 오직 문자, 숫자, 기호($,_)만 들어갈 수 있다.
(2) 첫 글자는 숫자가 될 수 없다.
(3) 카멜 표기법(CamelCase)으로 표기한다.
-> 단어를 차례대로 나열하면서 첫 단어를 제외한 각 단어의 첫 글자를 대문자로 작성한다.
ex) myVeryLongName
(4) 예약어는 사용할 수 없다.
-> 예약어: let, class, return, function
-> 이 단어들은 자바스크립트 내부에서 이미 사용 중이기 떄문에 사용할 수 없다.

2. 상수: const

: 변하지 않는 변수를 선언할 땐, let 대신 const를 사용한다.
: 상수는 재할당할 수 없으므로 상수를 변경하려고 하면 에러가 발생한다.
: 변숫값이 절대 변경되지 않을 것이라고 확신하며느 값이 변경되는 것을 방지하면서 다른 개발자들에게 이 변수는 상수라는 것을 알리기 위해 const를 사용해 변수를 선언한다.

const myBirthday = '이것이 바로 내생일';
myBirthday = '아니야 내가 생일임';
// error, can't reassign the constant!

1) 대문자 상수

: 기억하기 힘든 값을 변수에 항당해 별칭으로 사용하는 것은 널리 사용되는 관습이다.
: 이런 상수는 대문자와 밑줄로 구성된 이름으로 명명한다.

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_GRANGE가 #FF7F00보다 훨씬 유의미하므로, 코드 가독성이 좋다.
const pageLoadTime=/*웹페이지 로드하는 시간*/;

-> pageLoadTime의 값은 페이지가 로드되기 전에는 정해지지 않기 때문에 일반적인 방식으로 변수명을 지었다.
-> 하지만 이 값은 최초 할당 이후에 변경되지 않으므로 여전히 상수이다.

대문자 상수는 '하드 코딩한' 값의 별칭을 만들 때 사용하면된다.
그 외에는 일반적인 방식으로 변수명을 사용한다.

//1. admin과 name이라는 변수를 선언한다.
let admin;
let name;

//2.name에 값으로 "John"을 할당한다.
name = "John";

//3. name의 값을 admin에 복사한다.
admin = name;

//4.admin의 값을 alert창에 띄어본다.
alert(admin); //John
//올바른 이름 선택하기
/*현재 우리가 살고 있는 행성(planet)의 이름을
값으로 가진 변수를 만들어보자.*/
let ourPlanetName = "Earth";

/*웹 사이트 개발중이라고 가정하고,
현재 접송 중인 사용자(user)의 이름(name)을
저장하는 변수를 만들어보자.*/
let currentUserName = "Lee";
// 대문자 상수 올바로 사용하기
const birthday = '이것이 내 생일';
const age = someCode(birthday);
/*-> birthday는 바뀌지 않는 상수. 
'하드 코딩한'(실행 전 이미 값을 알고 있고, 
코드에 직접 그 값을 쓰는 경우) 
대문자로 코드를 적어주는게 적합하다.*/
/* -> 그러나 나이는 매년 바뀐다. 하지만 올해 15살이
되어야 하는데 14살로 바뀌고 하면 안된다. 
뭔가 덜 상수스러운 느낌이기 때문에 일반적으로
변수명을 사용한다.*/
const BIRTHDAY = '이것이 내 생일';
const age = someCode(BRITHDAY);

0개의 댓글