변수

변수(variable)

값을 저장할 수 있는 메모리 공간을 변수라고 합니다.

변수는 데이터를 저장합니다. 값을 읽고, 쓸수 있는 저장공간입니다.


변수를 사용하는 목적

프로그램이 동작하는 도중에 임시로 데이터를 저장합니다. 상태를 저장합니다.


선언

선언

언어에서 변수를 사용하기 위해서는 먼저 변수를 선언을 해야 합니다. 자바스크립트는 2가지 방식으로 변수를 선언하고 사용을 할 수 있습니다.

  • 암시적 선언
  • 명시적 선언

암시적 선언

자바스크립트 언어가 다른 언어들보다 유연한 특징은 암시적 변수 선언이 가능하다는 것입니다.

암시적 선언은 변수명 = 값 형태로 작성을 하면, 자동으로 자바스크립트가 값을 저장하는 변수를 할당해 주는 것입니다.

실습: variable_01.js

foo = "bar";
console.log(foo);

foo 변수에 bar 값을 대입연산자를 이용하여 저장을 합니다. 생성된 변수를 콘솔로 출력합니다.

실행결과

$ node variable_01.js
bar

암시적 방법을 이용하여 변수를 생성하는 것은 편리합니다.

명시적 선언

변수의 생성과 사용을 명확히 하기 위해서 변수명 앞에 변수를 지정하는 키워드를 같이 사용을 권장 합니다.
자바스크립트는 명시적 변수의 선언을 할 수 있는 2가지 방법을 제공합니다.

var

var 키워드는 오래동안 자바스크립트에서 지원을 하는 명시적 선언 키워드 입니다.

실습: variable_02.js

var foo = "bar";
console.log(foo);

let

let 키워드는 es6에서 새롭게 추가된 명시적 선언 키워드 입니다.

실습: variable_03.js

let foo = "bar";
console.log(foo);

let은 변수의 선언을 할때에만 사용이 됩니다. 또한 let은 한번만 변수를 선언할 수 있습니다.

var VS let

변수의 선언키워드를 사용하는 이유는 변수의 적용범위를 지정하는 scope 의 영향을 제어하기 위해서 입니다.

변수의 종류

변수의 선언과 접근 범위에 따라서 전역 변수와 지역 변수로 구분을 합니다. 또한 생성되는 위치에 따라서 구분을 할 수 있습니다.

  • 전역변수 전역변수는 프로그램 전반에서 제한없이 접근이 가능한 변수의 범위를 말합니다.

  • 지역변수 특정 영역 안에서만 변수에 접근이 가능한 변수 범위를 말합니다. 주로 함수, 심볼등 제한적 영역을 가지고 있습니다.

  • 매개변수 함수 외부로 부터 전달받는 데이터를 담는 변수를 말합니다.

  • 프로퍼티 객체지향 개발, 클래스 내부에 있는 변수를 말합니다.

전역, 진역변수에 대한 자세한 설명은 스코프(scope) 에서 다시 설명을 하도록 합니다.


변수명

변수명은 키워드를 제외하고 변수의 이름을 생성할 수 있습니다.
변수와 상수, 함수명을 구별하는 것을 식별자(identifier)라고 합니다.

변수명 규칙

변수명은 영문자로 작성을 합니다.

let name = "hojin"; // O

변수명은 숫자로 시작을 할 수 없습니다.

let 1name = "hojin"; // x

하지만 중간 또는 마지막에 숫자 포함은 가능합니다.

let name123 = "hojin"; //O

_, $기호로 시작되는 변수명을 사용할 수 있습니다.

let _name123 = "hojin"; //O
let $name123 = "hojin"; //O

밑줄(_), 이중밑줄(__)로 시작하는 이름을 사용할때는 주의가 필요합니다. 자바스크립트 내부 또는 기타 응용프로그램에서 밑줄, 이중밑줄로 변수명을 사용하는 경우가 많습니다.

충돌을 방지하기 위해서 특별한 경우가 아니라면 사용을 자제합니다.

유니코드도 변수명으로 사용을 할 수 있습니다.

자바스크립트에서 사용되는 시스템 예약어, 키워드는 변수명으로 사용을 할 수 없습니다.

$기호는 jquery에서 많이 사용을 합니다. 또한 php에서 변수는 $변수로 사용되기 때문에 혼동하기 쉽습니다.
주의하여 사용을 해야 합니다.

대소문자 구분

자바스크립트 변수는 대소문자를 구별합니다.

// 소문자 변수
let name = "hojin";

// 첫글자만 대문자 변수
let Name = "jiny";

console.log(name);
console.log(Name);

두개의 변수를 선언하였습니다. nameName은 서로 다른 변수 입니다.

실행결과

$ node variable_04.js
hojin
jiny

변수명을 작성을 할때에는 철자와 대소문자를 잘 구별을 해야 합니다.
보통 변수를 선언을 할때에는 소문자로 작성을 하는 것을 권장합니다. 규칙을 정하여 코드를 작성하게 되면, 실수를 방지 할 수 있습니다.

PHP언어도 변수의 대소문자를 구별합니다.

표현법

식별자를 표현하는 방법은 크게 2가지가 있습니다.

  • 카멜 케이스(carmel case)
  • 스네이크 케이스 (snake case)

향후 클래스의 식별자 규칙과 충돌이 되지 않도록 대문자로 시작되는 표현은 자제를 합니다.

초기값

변수를 선언하게 되면, 변수는 값을 가질 수 있습니다. 초기값은 변수가 선언이 될때 최초로 가지는 데이터 값입니다.
변수의 초기값은 생략을 할 수 있습니다.

let foo;

위의 예제는 변수만 선언을 하였습니다. 초기값을 생략하게 되면 foo 변수에는 undefined라는 특별한 값이 할당됩니다.

다중선언

변수를 선언하는 방법은 다양합니다. 다음처럼 한줄에 하나의 변수를 선언할 수 있습니다.

let foo;
let bar;

또는 한줄에 여러개의 변수를 선언도 가능합니다. 다수의 변수를 한줄에 선언을 할때에는 콤마(,)를 사용하여 구분합니다.

let foo, bar;

값의 지정

변수에 값을 지정합니다.

리터럴

변수는 값을 가지고 있습니다.

아래 예제에서 변수 temp에 실수값 37.5를 직접 숫자로 입력을 하였습니다. 리터럴(literal)은 직접 값을 입력하는 것을 말합니다.

var temp = 37.5;
var greeting = "hello world";

또는 쌍따옴포를 이용하여 문자열로 직접 값을 지정하는 것을 말합니다.

즉, 리터럴은 값을 생성하는 방법입니다.

값의 복사

변수는 다른 변수의 값을 이용하여 입력을 할 수 있습니다.

var foo = "bare";
var bar = foo;

console.log(foo);
console.log(bar);

실행결과

$ node variable_10.js
bare
bare

값의 유지

값이 복사되어 저장이 됩니다. 이후 원본 변수의 값을 변경하더라도 복사된 값은 변함이 없습니다.

var foo = "bare";
var bar = foo;

// 값을 변경합니다.
var foo = "cat";

console.log(foo);
console.log(bar);

실행결과

$ node variable_11.js
cat
bare

배열

  • 배열 자료형
  • 배열의 생성
  • index