Variable

What is a Variable?

Variables are used to store information to be referenced and manipulated in a computer program. 코드에 사용될 정보를 변수로 사용될 이름을 붙인 상자에 저장하는 것

keyword for variables

keyword 없이 변수( variable )를 선언( declare )할 수도 있지만 그러면 코드가 길어지는 경우 이미 사용된 변수인지 구별할 수 없어 나중에 bug의 원인이 된다. keyword를 사용하면 이러한 상황을 사전에 방지해준다
keyword로는 let, const, 그리고 지금은 사용을 권장하지 않는 var가 있다

선언( declaration )하는 방법

1. assignment operator =으로 value를 주지 않고 declaration

let message;

message = 'Hello'; // 나중에 값을 할당( assign )함

2. 선언( declaration )하면서 할당( assign )도 함께 함. 다른말로 initializing이라고 함

let message = 'Hello';

3. 다수의 variable을 한 라인으로 주는 방법 비추천

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

🙆‍♀️ 올바른 방법

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

올바른 사용을 위한 기본 지식

let으로 declare된 variable은 value를 바꿀 수 있다

let message = 'Hello';

message = 'Hi'; // value가 바뀜

console.log(message) // output: Hi

We can also declare two variables and copy data from one into the other.

let hello = 'Hello world!';

let message;

message = hello; // copy 'Hello world' from hello into message

console.log(hello) // Hello world!
console.log(message) // Hello world!

🙅‍♀️ let keyword를 사용해서 같은 이름을 가지는 variable을 두 개 지정할 수는 없다

let message = 'This';
let message = 'That'; //error

💜 An assignment witout use strict
원래는 keyword 없이 variable을 지정할 수 없지만 과거에는 가능했다. 따라서 legacy코드를 update하거나 하는 경우 코드에 "use strict"를 사용하면 에러가 발생할 수 있으므로 주의하자

"use strict";
num = 5; // error: num is not defined

Variable naming

variable naming은 개발에서 아주 중요한 부분을 차지한다. 따라서 아래와 같은 내용을 고려해서 지어야 한다.

• Use human-readable names like userName or shoppingCart.
  사람이 읽은 수 있는 가
  
  
• Stay away from abbreviations or short names like a, b, c, unless you really know what you’re doing.
  축약된 표현은 삼가한다
  
  
• Make names maximally descriptive and concise. Examples of bad names are data and value. Such names say nothing. It’s only okay to use them if the context of the code makes it exceptionally obvious which data or value the variable is referencing.
  최대한 설명할 수 있고 정확한 이름을 부여한다
  
  
• Agree on terms within your team and in your own mind. If a site visitor is called a “user” then we should name related variables currentUser or newUser instead of currentVisitor or newManInTown.
  팀에서 사용 중인 변수 이름이나 패턴을 사용하자
  
  

variable 이름을 지을 때 주의사항

1. 이름은 오직 문자, 숫자, 그리고 symbol $와 _만 가능하다

//$ 나 _ 도 variable 이름이 가능하기 때문에 아래와 같은 코드도 동작한다
let $ = 1;
let_ = 2;
alert($ + _) // 3

2. 이름의 첫 자에 숫자가 오면 안된다
   
   
3. reserved variable 리스트에 있는 문자들은 이름으로 사용할 수 없다
   
   
4. -는 사용할 수 없다. camelCase나 _로 대체 가능

   💜 apple과 AppLE은 서로 다른 variable이다

constants

값이 변하지 않는 value는 let대신해서 const를 사용하는데 이 때 2가지 이름 규칙이 있다. 하나는 uppercase constants이고 다른 하나는 let과 같은 이름 규칙을 사용하는 것이다.

uppercase constants

코드를 execution하기 전이라도 value를 정확히 알고 있는 고정된 variable은 이름을 uppercase와 _를 이용해서 부여한다. 예를 들면 파이값이나 hexadecimal 코드 등이다. There are constants that are known prior to execution (like a hexadecimal value for red)

const COLOR_BLUE = '#00F';
const COLOR_ORANGE = '#FF7F00';

let과 같은 형식으로 이름 부여

There are constants that are calculated in run-time, during the execution, but do not change after their initial assignment.

const pageLoadTime = /* time taken by a webpage to load */;

const

• variables declared with const는 value가 변하지 않는다. 즉, re-declare할 수 없다.

const greeting = "say Hi";
greeting = "say Hello instead"; //error: Assignment to constant variable.

• var와 다르게 아래와 같이 같은 이름을 두 개 가진 const는 불가능하다

const greeting = "say Hi";
const greeting = "say Hello instead"; //error: Identifier 'greeting' has already been declared

• hoisting되지 않는다. var의 경우는 hoisting (var variable이 코드이 맨 위로 올려지는 현상) 되기 때문에 error가 뜨지 않고 undefined로 output된다

console.log(variable); // referenceError
const variable = "true";

• const로 처음 declaration할 때는 무조건 value를 assign해야 한다. let과 var는 no value 가능하다

const variable; //error

• let처럼 block scoped이다. 즉, declared된 block에서만 사용되어진다. block은 {}로 나뉘고 const가 globally하게 declare되었으면 globally하게 접근 가능

const name = 'Lucy'; // global하게 사용됨

function greeting {
  ...
}

• objects가 const로 declared되었을 땐, object를 update(=change)할 수는 없지만 object 안의 property 값은 바꿀 수 있다

const greeting = {
  message: "say Hi",
  times: 4;
}
greeting.times = 5;

console.log(greeting); //output: {message: "say Hi", times: 5}

🤜 결론

value가 바뀌지 않는 variables같은 경우는 const를 사용하자

let

• const처럼 block scoped이다. 즉, declared된 block에서만 사용되어진다. block은 {}로 나뉘고 const가 globally하게 declare되었으면 globally하게 접근 가능

• let variables는 재사용 (re-declare)가능하다. 하지만, let을 이용해서 복수의 같은 이름은 변수 할당은 불가능하다

let letVariable = "Hello";
variable = "Hi";

console.log(letVariable) //output: Hi

let letVariable = "Hello";
let letVariable = "Hi"; // error

• let 변수는 value없이 할당도 가능하다. var도 동일함

let name; // value 없이 할당 (declare)

• hoist는 불가능하다. var는 hoisting되어 에러나지 않고 output으로 undefined 값을 준다

console.log(variable); // referenceError
let variable = "true";

🤜 결론

constant variable외의 모든 경우 let를 사용하자

var

• 과거에 const나 let를 대신해서 사용되었던 keyword. 현재는 내재된 문제들로 사용이 권장되지 않는다
  
  
• variable with var is function scope (= block scope) and global scope (= unblock scope ). 따라서 {}안에서나 밖에서나 자유롭게 사용 가능하다. 이는 bug를 초래할 수 있다
  
  
• 변수 재사용이 가능하다

var name = "Lucy";
name = "Monica";

console.log(name) // output: Monica

- can be accidently re-declared and re-initialized. it means it is possible that variable with the same name and var can exist in a code which can cause a lot of bugs at the end. ```javascript var name = "Lucy"; var name = "Monica"; // error나지 않는다 ```

• hoist된다. const나 let은 hoisting되지 않아 reference error

console.log(variable); // output: undefined
var variable = "true";

🤜 결론

var keyword는 되도록 사용하지 말자