• 레퍼런스
  • 자습서
  • 변수와 자료형

    데이터를 저장하는 개념인 변수와 JavaScript의 데이터 형식을 의미하는 자료형을 소개합니다.

    변수

    변수(Variable)는 데이터를 저장하는 공간입니다. 변수는 프로그래머가 직접 선언하고 값을 넣을 수 있으며, 다른 값으로 변경할 수 있습니다.

    선언

    변수의 선언은 아래와 같이 let 키워드를 사용합니다.

    let data;

    이 코드는 data라는 이름의 변수를 선언합니다. let 변수이름;으로 원하는 이름의 변수를 선언할 수 있습니다. 단, 몇 가지 규칙이 존재합니다.

    • 변수 이름의 첫 글자는 영문자, 달러기호($), 언더바(_)만 올 수 있습니다. 예를 들어, let 10min;는 숫자가 첫 글자이므로 에러가 발생합니다.
    • 변수 이름의 두번째 글자부터는 영문자, 숫자, 달러기호($), 언더바(_)만 올 수 있습니다. 예를 들어, let log_2_10;는 정상적으로 작동합니다.
    • JavaScript에서 이미 사용 중인 키워드(let, if, for 등)는 변수 이름으로 지을 수 없습니다.

    정보

    JavaScript를 비롯한 프로그래밍 언어에서는 대소문자를 엄격하게 구분합니다.

    let data;
    let Data;

    위 코드는 같은 이름의 변수를 2번 선언한 것이 아니라 각각 data변수와 Data변수를 선언한 것입니다.

    할당

    변수에 데이터를 넣는 것을 할당이라고 합니다. 변수의 할당은 아래와 같이 대입 연산자 =를 사용합니다.

    let data;
    data = 12;

    위 코드는 data 변수를 선언(1번 줄)한 후, 12라는 숫자 데이터를 할당(2번 줄)합니다. 변수이름 = 할당할_데이터;로 특정 변수에 특정 값을 할당할 수 있습니다.

    이미 값이 존재하는 변수에 다른 값을 할당하는 것을 재할당이라고 합니다.

    let data;
    data = "hello";
    data = 37;

    위 코드는 data 변수를 선언(1번 줄)한 후, "hello"라는 문자열 데이터를 할당(2번 줄)합니다. 그리고 37이라는 숫자 데이터를 재할당(3번 줄)합니다.

    변수의 선언과 할당은 아래와 같이 동시에 할 수 있습니다. 또한, 변수의 값을 사용할 땐 아래와 같이 변수 이름을 적습니다. 변수에 값이 할당되지 않았을 경우, undefined를 줍니다.

    let str = "Hi, User."; // str 변수를 선언함과 동시에 문자열 데이터를 할당합니다.
    msg.reply(str); // 'Hi, User.'라는 메시지를 보냅니다.

    상수

    주의

    2025.02.06. 기준: Rhino 엔진의 이슈로 인해 const를 사용해 선언한 함수는 전역 함수 스코프를 가집니다.

    상수(Constant)는 값을 변경할 수 없는 데이터 공간입니다. 즉, 변수와 다르게 재할당이 불가합니다.

    상수는 const 키워드를 사용해 선언합니다. 상수는 선언과 할당을 반드시 동시에 해야 함을 잊지마세요.

    const PI = 3.141592; // 선언과 할당을 동시에 수행해 정상적으로 작동합니다.
    const MSG_INFO; // 선언과 할당을 동시에 하지 않았으므로 에러가 발생합니다.
    PI = 2.713; // 상수에 재할당을 시도했으므로 에러가 발생합니다.

    주의

    2025.02.06. 기준: JavaScript의 올바른 구현에서는 위 코드가 에러를 발생하나, Rhino 엔진의 이슈로 인해 위 코드를 메신저봇R에서 실제로 테스트하면 에러가 발생하지 않습니다. GraalJS의 경우 정상적인 구현에 따라 에러가 발생합니다.

    상수의 값을 사용할 땐 변수와 동일하게 상수 이름을 적습니다.

    const DEFAULT_MSG = "This is default message.";
    msg.reply(DEFAULT_MSG); // 'This is default message.'라는 메시지를 보냅니다.

    자료형

    자료형(Data Type)은 숫자, 문자열 등과 같은 데이터의 종류를 의미하는 개념입니다. JavaScript에는 다양한 자료형이 존재합니다.

    JavaScript의 자료형
    숫자(Number)

    0~9, +, -로 표현한 숫자값 데이터입니다. 예를 들어, 12, +37, 0, -0, -5.43, NaN(Not a Number, '숫자가 아님'을 의미)은 숫자 데이터입니다. 0-0은 같은 값으로 취급합니다. NaN은 '숫자가 아님'을 의미하는 값이지만 자료형은 숫자 데이터입니다.

    문자열(String)

    문자들이 나열된 형태의 데이터입니다. 큰따옴표("), 작은따옴표(') 또는 백틱(`)으로 감싸서 표현할 수 있습니다. 예를 들어, ""(빈 문자열), "A", 'Hello'은 문자열 데이터입니다.

    불리언(Boolean)

    참 또는 거짓을 나타내는 논리 요소 데이터입니다. 불리언 데이터의 값으로는 truefalse 두 가지만 존재합니다.

    Null

    Null 데이터의 값으로는 객체가 없음을 의미하는 null만 존재합니다.

    Undefined

    Undefined 데이터의 값으로는 값이 없음을 의미하는 undefined만 존재합니다.

    형변환

    JavaScript는 형변환(typecasting)이라는 시스템을 가집니다. 형변환은 어떤 자료형의 데이터를 다른 자료형으로 변환하는 것입니다. 형변환은 명시적 형변환과 암시적 형변환으로 구분할 수 있습니다.

    명시적 형변환

    명시적 형변환(explicit conversion)은 프로그래머가 직접 형변환을 지정하는 것입니다. JavaScript에서는 String(), Number(), Boolean()와 같은 함수를 사용해 명시적 형변환을 할 수 있습니다.

    String(123); // 문자열로 형변환 > "123"
    Number("456"); // 숫자로 형변환 > 456
    Boolean(0); // 불리언으로 형변환 > false

    특히, 어떤 자료형의 데이터를 문자열로 변환하고자 할 때 String() 함수 대신 아래와 같이 toString() 메소드를 사용할 수도 있습니다.

    (123).toString(); // "123"
    (false).toString(); // "false"
    /* 변수의 경우 */
    let num = 789;
    num.toString(); // "789"

    암시적 형변환은 몇몇 경우에 꼭 필요할 수 있습니다. 예를 들어, 메시지를 전송하는 함수 msg.reply()는 문자열 데이터를 인자로 받습니다. 문자열 외의 자료형을 인자로 전달할 경우 메시지가 전송되지 않습니다.

    let length = 50;
    msg.reply("물체의 길이(cm): "); // 메시지가 전송됩니다.
    msg.reply(length); // 메시지가 전송되지 않습니다.

    위 코드에서 length 변수의 값은 숫자이므로 msg.reply()가 메시지를 전송하지 않습니다. 하지만 String() 함수 또는 toString() 메소드를 사용해 명시적으로 형변환을 하면 메시지가 전송됩니다.

    let length = 50;
    msg.reply("물체의 길이(cm): ");
    msg.reply(String(length));
    /* 또는 */
    msg.reply(length.toString());

    암시적 형변환

    암시적 형변환(implicit conversion)은 특정한 상황에서 JavaScript가 자동으로 형변환하는 것으로, 자동 형변환(type coercion)이라고도 합니다. 아래의 몇몇 경우를 통해 암시적 형변환을 이해해봅시다.

    두 숫자를 더하고자 할 때 + 연산자를 사용합니다.

    let sum = 3 + 7; // sum의 값: 10

    + 연산자는 두 숫자를 더할 때뿐만 아니라 두 문자열을 연결할 때에도 사용합니다.

    let str = "User name: " + "Jack"; // str의 값: "User name: Jack"

    숫자와 문자열을 "더하"면 숫자 데이터가 문자열로 형변환되어 + 연산자를 수행합니다.

    let data = "Age: " + 20;

    위 코드의 경우, 숫자 데이터 20은 문자열 데이터 "20"으로 형변환됩니다. 그러므로 data 변수의 값은 "Age: 20"이라는 문자열 데이터가 됩니다. 이는 불리언과 문자열을 더해도 동일하게 형변환합니다.

    let isOn = "Power: " + true; // isOn의 값: "Power: true"

    형변환은 어떤 자료형에서 문자열 자료형으로의 변환만을 의미하는 것이 아닙니다. 두 숫자의 차를 구할 때 사용하는 - 연산자를 문자열과 숫자에 대해 사용해봅니다.

    let m = "32" - 2; // m의 값: 30

    두 문자열을 "빼는" 연산은 불가하지만 두 숫자를 빼는 연산은 가능합니다. 그러므로 문자열 데이터 "32"를 숫자 데이터 32로 변환해 차 연산을 수행합니다.

    JavaScript는 다른 언어보다도 암시적 형변환을 수행하는 기준이 더 관대합니다. 즉, 다른 언어보다 자료형에 대한 엄격함이 덜합니다. 하지만 자료형에 대한 관대함은 때때로 예기치 못한 결과를 초래할 수 있습니다. 그러므로 프로그래밍할 때 자료형을 명확히 이해하고 사용하는 것이 중요합니다.

    거짓 같은 값

    형변환은 어떤 데이터에서 불리언 데이터로의 변환도 가능합니다. 불리언 데이터로의 형변환은 Boolean() 함수를 사용합니다. 아래와 같이 불리언 데이터로 형변환할 값을 넣습니다.

    Boolean("JavaScript"); // true
    Boolean(-82); // true
    Boolean(true); // true

    대부분의 값은 몇 가지 예외를 제외하고는 불리언 데이터로 형변환할 경우 true가 됩니다. 예외가 바로 거짓 같은 값(Falsy)이며, 이는 어떤 데이터를 불리언 데이터로 형변환했을 때 false가 되는 값입니다. 아래 코드는 거짓 같은 값을 불리언 데이터로 형변환한 결과를 보여줍니다.

    Boolean(false); // false
    Boolean(null); // false
    Boolean(undefined); // false
    Boolean(NaN); // false
    Boolean(0); // false. -0의 경우도 같습니다.
    Boolean(""); // false. ``, ''의 경우도 같습니다.