Fast Blinking Hello Kitty

JAVASCRIPT

데이터 저장하기 예제

코른이되고싶은코린이 2023. 2. 25. 17:07

728x90

[ 01. 변수 : 데이터 저장 ]

변수는 데이터를 저장하는 저장소입니다.

{
    var x = 100;    //변수 x에 숫자 100을 저장함
    var y = 200;    //변수 y에 숫자 200을 저장함
    var z = "javascript";   //변수 z에 문자 "javascript"를 저장함

    console.log(x);
    console.log(y);
    console.log(z);
}
▶결과값
100
200
javascript

[02. 변수 : 데이터 저장 + 데이터 변경]

변수는 데이터를 저장할 수도 있지만 변경도 가능하다.

 {
    let x = 100;
    let y = 200;
    let z = "javascript";

    x = 300;
    y = 200;
    z = "react";

    console.log(x);
    console.log(y);
    console.log(z);
} 

▶결과값

300
200
react

[03. 변수 : 데이터 저장 + 데이터 변경 + 데이터 추가]

변수는 데이터를 저장하고, 변경하고, 추가할 수 있습니다.

 {
    let x = 100;
    let y = 200;
    let z = "javascript";

    x += 300;   // x = x + 300
    y += 400;
    z += "react";

    console.log(x);
    console.log(y);
    console.log(z);
}

▶결과값

400
600
javascript

[04. 상수 : 데이터 저장 + 데이터 변경불가]

상수는 데이터 저장은 가능하나 변경은 불가능합니다. 상수(const)는 이미 선언한 상수에 대해 중복 선언이 불가능하며 상수의 값을 재지정할 수도 없습니다.

 {
    const x = 100;
    const y = 200;
    const z = "javascript";

    x = 300;    //Assignment to constant variable.
    y = 400;
    z = "react";

    console.log(x);
    console.log(y);
    console.log(z);   //Assignment to constant variable
}

▶결과값

//Assignment to constant variable(오류)

//Assignment to constant variable
//Assignment to constant variable

[05. 배열 : 데이터 저장(여러개): 표현방법1]

배열의 기본 입력형식은 대괄호([ ])를 사용합니다.

{
    const arr = new Array();
    arr[0] = 100;
    arr[1] = 200;
    arr[2] = "javascript";
    
    console.log(arr[0]);
    console.log(arr[1]);
    console.log(arr[2]);
}

▶결과값

100
200
javascript

[06. 배열 : 데이터 저장(여러개): 표현방법2]

같은 내용을 보다 간략하게 한줄로 나타낼 수 있습니다.

{
    const arr = new Array(100, 200, "javascript");

    console.log(arr[0]);
    console.log(arr[1]);
    console.log(arr[2]);
}

▶결과값

100
200
javascript

[07. 배열 : 데이터 저장(여러개): 표현방법3]

new Array를 생략하여 데이터 값을 나타내는 형식입니다.

{
    const arr = [];
    arr[0] = 100;
    arr[1] = 200;
    arr[2] = "javascript"
     console.log(arr[0]);
     console.log(arr[1]);
     console.log(arr[2]);
}

▶결과값

100
200
javascript

[08. 배열 : 데이터 저장(여러개): 표현방법4]

new Array를 생략한 후 한 줄로 간략화한 형식입니다.

{
    const arr = [100, 200, "javascript"]
            
    console.log(arr[0]);
    console.log(arr[1]);
    console.log(arr[2]);
}

▶결과값

100
200
javascript

[09. 객체 : 데이터 저장(키와 값): 표현방법1]

객체란 여러가지 원시 유형을 하나로 묶은 것으로 obj로 표현합니다.

{
    const obj = new Object();
    obj[0] = 100;
    obj[1] = 100;
    obj[2] = "javascript";

    console.log(obj[0]);
    console.log(obj[1]);
    console.log(obj[2]);
 }

▶결과값

100
200
javascript

[10. 객체 : 데이터 저장(키와 값): 표현방법2]

대괄호와 숫자를 제외한 문자로도 표시할 수 있습니다.

{
    const obj = new Object();
    obj.a = 100;
    obj.b = 200;
    obj.c = "javascript";

    console.log(obj.a);
    console.log(obj.b);
    console.log(obj.c);
 }

▶결과값

100
200
javascript

[11. 객체 : 데이터 저장(키와 값): 표현방법3]

중괄호를 사용하여 new object태그를 생략하여 표현할 수 있습니다.

{
    const obj = {};
    obj.a = 100;
    obj.b = 200;
    obj.c = "javascript"

    console.log(obj.a);
    console.log(obj.b);
    console.log(obj.c);
 }

▶결과값

100
200
javascript

[12. 객체 : 데이터 저장(키와 값): 표현방법4]

한줄형식으로 데이터를 나타낼 수 있지만 키와 값을 함께 입력해야 합니다.

{
    const obj = {a:100, b:200, c:"javascript"};
            
    console.log(obj.a);
    console.log(obj.b);
    console.log(obj.c);
}

▶결과값

100
200
javascript

[13.객체 : 데이터 저장(키와값) : 표현방법5 : 배열안에 객체]

배열 안에 키값을 입력하여 객체를 포함시킬 수 있습니다.

{
    const obj = [
                {a:100, b:200},
                {c:"javascript"}
    ];

    console.log(obj[0].a);
    console.log(obj[0].b);
    console.log(obj[1].c);
}

▶결과값

 

 
100
200
javascript

[14.객체 : 데이터 저장(키와값) : 표현방법6 : 객체 안에 배열]

객체안에 배열을 포함시킬 수 있습니다. 배열의 인덱스는 0부터 시작하는 것을 주의해줍니다.

{
    const obj = {
        a: 100,
        b: [200, 300],
        c: {x: 400, y: 500},
        d: "javascript"                 
    };

    console.log(obj.a);
    console.log(obj.b[0]);              
    console.log(obj.b[1]);
    console.log(obj.c.x);
    console.log(obj.c.y);
    console.log(obj.d);
}

▶결과값

100
200
300
400
500
javascript



[15.객체 : 데이터 저장(키와값) : 표현방법7]

변수나 상수를 포함하여 입력할 수 있습니다.

{
    const a = 100;
    const b = 200;
    const c = "javascript"

    const obj = {a, b, c};

    console.log(a);
    console.log(b);
    console.log(c);
}

▶결과값

100
200
javascript

[16객체 : 데이터 저장(키와값) : 표현방법8]

객체 안에는 함수(실행문)을 포함하여 입력할 수 있습니다.

{
    const obj = {
        a: 100,
        b: [200, 300],
        c: "javascript",
        d: function(){
            console.log("javascript가 실행되었습니다.");
        };    
        e: function(){
            console.log(obj.c + "가 실행되었습니다.");
        };
        f: function(){
            console.log(this.c + "가 실행되었습니다.")
        };
    };
        console.log(obj.a);
            console.log(obj.b[0]);
            console.log(obj.b[1]); 
            console.log(obj.b[2]);  
            console.log(obj.c);
            obj.d();
            obj.e();
            obj.f();
}

▶결과값

100
200
300
undefined
javascript javascript가 실행되었습니다.