자바스크립트 변수
01. 변수
자바스크립트에서는 변수를 사용하여 여러가지 형태의 데이터를 저장할 수 있습니다.
이번 시간에는 const 키워드 사용하여 변수를 선언해보도록 하겠습니다.
변수는 아래와 같이 const 키워드를 앞에 붙여서 선언할 수 있습니다.
const myDream = "being a good software developer";
const 키워드를 사용하여 myDream 변수를 선언하고,
그 값으로 "being a good software developer" 이라는 문자열 타입의 값을 할당해주었습니다.
02. 변수와 대입연산자
자바스크립트에서는 변수를 사용하여 특정한 값(데이터)을 저장할 수 있습니다.
const myVariable = 5;
위에서 알 수 있듯이 변수(variable)에 값을 할당할 때 대입연산자(=)를 사용합니다.
대입연산자는 말 그대로 오른쪽 항에 있는 값을 왼쪽에 있는 변수에 대입하는 역할을 합니다.
const myVar = 5;
const myNum = myVar;
// 5를 변수 myVar의 값으로 대입합니다.
// 그 후에 myVar를 myNum의 값으로 대입합니다
03. 값이 할당되지 않은 변수
변수는 처음 선언된 경우 초기 값으로 undefined, 즉 정의되지 않은 값을 갖습니다.
let a;
console.log(a) // --> return undefined
즉, 변수를 선언하는 것과 값을 대입하는 것은 별개입니다.
선언된 변수가 특정한 값을 갖기 위해서는 대입연산자를 사용해 그 값을 대입해주어야 합니다.
let a;
console.log(a) // --> return undefined
a = "I love this community" // 한 번 선언된 변수는 다시 선언해줄 필요 없습니다. 값만 대입해주면 됩니다.
console.log(a) // --> return "I love this community"
04. 변수 이름 정하기
변수 이름은 원하는대로 정할 수 있지만 몇 가지 주의할 점이 있습니다. 기억하시나요?
- 대소문자 구문
변수이름, 함수이름, 연산자 모두 대소문자를 구분합니다. 따라서 myName과 MyName은 다른 변수입니다.
- 변수 이름을 정할 때, 첫 번째 문자는 반드시 글자나 밑줄(_), 달러기호($)중 하나 입니다.
- 두 번째 문자부터는 글자, 밑줄, 달러, 숫자 중에서 자유롭게 쓸 수 있습니다.
- 변수이름, 함수이름 등 camelCase(카멜케이스) 방식으로 쓸 것.
- snake_case 표현법도 있지만 잘 사용하지 않음(변수이름에 -는 사용할 수 없으므로, _를 사용한 것)
camelCase - Example:
let someVariable;
let anotherVariableName;
let thisVariableNameIsSoLong;
snake_case - Example:
let first_second;
let my_profile_img;
let to_do_list_array;
05. null & undefined
null과 undefined는 모두 자바스크립트의 데이터 타입입니다.
undefined는 선언은 됐지만 아직 value가 할당되지 않은 경우를 의미합니다. null은 '빈 값(blank)'을 의미하는데 사용자가 준 value입니다. 그래서 undefined와 다르게 자바스크립트가 자동적으로 null 이란 값을 줄 수는 없습니다.
포괄적인 의미로 '값이 없다'는 점에서 null과 undefined가 비슷한 것 같지만, 엄밀히 말하자면 둘은 같지 않습니다.
let name; // undefined
name = null; // null
console.log(null == undefined); // true
console.log(null === undefined); // false
엄격일치연산(===)는 value뿐만 아니라 type도 같아야 true가 나옵니다.
그러면 null과 undefined의 type은 어떤 타입일까요? 타입을 알아보기 위해서 'typeof' 연산자를 사용해봅시다.
console.log(typeof null); // object
console.log(typeof undefined); // undefined
null의 type이 object가 나왔습니다. 왜일까요? null은 위에 설명한대로 '값이 없음(blank)'을 의미하는 '할당된' value이기 때문입니다.
자바스크립트 변수에 대해서 공부하였는데 헷갈리는 부분이 좀 있는 것 같아요.
앞으로 변수 이름도 많이 정하게 될 것인데 어떤식으로 정해야할지 카멜케이스를 써야할지 아니면 스네이크 케이스를 사용해야할지라던가요..그럴 땐 chat GPT를 사용하면 되려나요?!
또 null과 undefined의 차이를 설명하자면 둘 다 값이 없다는 공통점이 있지만 null은 값이 할당되었고 undefined는 할당되지 않았다! 그렇기 때문에 console.log 를 찍어 보았을 때 값은 같지만 타입을 다르다! 라고 저는 정리를 했습니다.
참고 : wecode