1. 변수
-
데이터를 가르키는 이름, 또는 데이터를 저장하는 이름이 붙은 저장소
java script에서는let이라는 키워드를 사용해 변수를 생성 합니다. -
오래된 소스코드에서는
let대신에var이라는 키워드를 사용해서 변수를 생성합니다.
❤️ 문법
let message; // message 라는 변수 선언1.1 변수 주의사항
1) 변수에 이름은 숫자 | 문자 | 특수문자 $ 와 _ 만 가능하다.
2) 변수명은 숫자로 시작하면 안되고, 공백이 있어도 안됩니다.
3) 변수는 한 번만 선언해야 합니다. 같은 변수명을 가진 변수를 두 번 선언하면 오류 발생
4) 변수는 대/소 문자를 구분합니다.
5) 예약어를 변수명으로 사용할 수 없습니다. ( let , class , return 등 )
6) 2개의 단어 이상을 변수명으로 사용할 때, 카멜케이스 방식으로 선언합니다.
✅ 추후에 포스팅할 객체 안에서는 예약어를 사용할 수 있습니다.
1.2 변수 사용
❤️ 변수는 '=' 할당 연산자를 통해서 값을 저장합니다.
let message;
message = '문자열을 저장';
/* */
문자열이 변수와 연결된 메모리 영역에 저장되었기 때문에,
변수명을 이용해서 문자열에 접근할 수 있다.❤️ 변수를 사용해서 알람창 호출하기
let message;
message = '나는 message라는 변수가 가르키는 데이터야';
alert(message);
❤️ 변수 선언과 동시에 데이터 할당
let message = '한줄에서서 변수 선언과 데이터 할당이 가능해';
alert(message);
❤️ 변수안에 변수 할당
let message='이 변수는 다른 변수에서도 사용할 수 있어';
let copy;
copy = message;
alert(copy);
/* */
변수안에 변수를 할당할 때는, 문자열과 다르게 " 따옴표를 사용하면 안됩니다.
❤️ 변수는 스냅샷 원리로 저장 된다
let num = 1;
let sum = num;
num = num+1;
console.log(sum); // 출력 : 1
sum = num;
console.log(sum); // 출력 : 2
/* */
변수는 값이 공유되고 잇는것이 아니라, 스냅샷처럼 선언한 순간의 값만 저장되어 있다.
sum 변수 같은 경우에도, num 값을 다시 대입하지 않으면 영원히 초기값(1)로 저장되있다.2. 상수
-
데이터를 저장하는 변수와 동일한 기능을 갖고 있습니다.
-
변수와의 차이점은, 상수로 지정된 상수명은 변하지 않습니다.
-
JS에서 상수를 선언할 때는 키워드const를 사용합니다.
상수를 선언할 때는 항상 초기화를 해서 값을 할당해줘야 합니다.
const birthday="1996.01.01";
birthday="2000.04.04"; // 오류발생 : 상수로 지정된 birthday의 값을 변경하려고 해서2.1 주의 사항
상수로 한 번 선언된 값은, 변수와는 다르게 값을 재할당 할 수 없습니다.
const COLOR_RED="F00";
COLOR_RED="F12"; // 불가능 오류 발생3. 대문자 상수
-
하드 코딩으로 직접 작성하는 상수들은 대부분 대문자를 사용해서 선언합니다.
-
개발자들간의 암시적인 규칙같은 것 이며, 소문자보다는 대문자가 가독성이 더 좋기 때문입니다.
-
확실하게 어떤 값인지 알고 있고, 변할 필요가 없는 데이터들은 대문자상수로 정의 해줍시다.
const COLOR_RED = "F00"; // 빨강색에 해당하는 16진수 코드를 상수로 선언
const COLOR_GREEN = "#0F0"; // 초록색에 해당하는 16진수 코드를 상수로 선언
const COLOR_BLUE = "#00F"; // 파란색에 해당하는 16진수 코드를 상수로 선언
let color = COLOR_RED; // 변수에 색상을 저장할 때, 간단하게 상수를 사용해서 저장할 수 있습니다.
alert(color); // 변수 호출 => COLOR_RED 라는 상수에 저장된 F00값이 호출 됨
⭐
외우기 힘든 값을 알기 쉽게 상수인 저장소에 저장해두면, 언제든지 편리하게 별칭으로
데이터를 사용할 수 있습니다.
🔔 대문자 상수의 장점
COLOR_RED는F00보다 외우기 쉽다.COLOR_GREEN는#0F0보다 오타를 낼 확률이 적다.COLOR_BLUE는#00F보다 의미가 있는 단어이므로, 가독성이 좋다
3.1 대문자 소문자 차이
상수를 항상 대문자로 선언할 필요는 없으나, 시각적으로 소문자보다 대문자가 보기 편하므로
상수를 선언 할 때는 대부분 대문자로 작성합니다. ( 강제는 아니지만, 일종의 규칙입니다 )
const pageloadTime=/*페이지를 로드할 때 걸리는 시간*/;pageloadTime같은 경우는 상수이나, 페이지를 로드하기 이전까지는 값을 알 수 없으므로
대문자로 이름을 짓기 보다는, 소문자로 작성했습니다.
따라서 대문자로 상수를 정의할 때는 "하드코딩"인 방식에서 사용하시면 됩니다.
4. 올바른 변수명
-
변수를 선언할 때는, 변수에 저장된 데이터에 대한 의미를 갖는 이름으로 선언해야 합니다.
-
저장된 데이터가 사람의 나이에 대한 값이라면, 변수명은
age라고 선언해야 의미가 있는 -
변수명으로써 남들에게 명확하게 설명할 수 있습니다.
4.1 변수명 작성
-
남들이 기억하기 쉬운 변수명으로 작성 하기
COLOR_REDorbirthday -
데이터에 대한 의미를 갖는 변수명으로 작성하기
let age=22 -
팀에 소속된 경우라면 팀이 지정한 변수명으로 사용하기
팀에서 사이트 방문객을 user라고 선언 했다면, 방문객에 관련된 데이터라면 user의
이름이 들어가게 선언해야 합니다.
새로운 방문객 : new user 이런식으로 말입니다.
⭐
마지막으로, 변수를 사용할 때는 이미 존재하는 변수를 재 사용하기 보다는
새로운 변수를 생성해서 사용하는 것이 추후에 문제가 생겼을 때, 디버깅해서
문제를 해결하기 쉽습니다.
