Top
for()문 연산자

01. 변수 : 데이터 불러오기

{
    let x = 100, y = 200, z = "Javescript";

    document.write(x);
    document.write(y);
    document.write(z);
}

결과 보기

02. 상수 : 데이터 불러오기

{
    const x = 100, y = 200, z = "Javescript";

    document.write(x);
    document.write(y);
    document.write(z);
}

결과 보기

03. 배열 : 데이터 불러오기

{
    const arr = [100, 200, "Javascript"];

    document.write(arr[0]);
    document.write(arr[1]);
    document.write(arr[2]);
}

결과 보기

04. 배열 : 데이터 불러오기 : 2차 배열

{
    const arr = [100, 200, ["javascript", "jquery"]];

    document.write("*** 04. 배열 ***");
    document.write(arr[0]);
    document.write(arr[1]);
    document.write(arr[2]);
    document.write(arr[2][0]);
    document.write(arr[2][1]);
}

결과 보기

05. 배열 : 데이터 불러오기 : 갯수 구하기

{
    const arr = [100, 200, "Javascript"];

    document.write("*** 05. 배열 ***");
    document.write(arr.length);
}

결과 보기

06. 배열 : 데이터 불러오기 : for()문

{
    const arr = [100,200,300,400,500];

    //document.write(arr[0])
    //document.write(arr[1])
    //document.write(arr[2])
    //document.write(arr[3])
    //document.write(arr[4])

    //for(초기값, 조건식, 증감식)
    for(let i = 0; i < arr.length; i++ ){
       document.write(arr[i], "<br>");
    }
}

결과 보기

07. 배열 : 데이터 불러오기 : forEach문

{
    var num = [100,200,300,400,500];
            
    //document.write([0]);
    //document.write([1]);
    //document.write([2]);
    //document.write([3]);
    //document.write([4]);


    //for()문
    for( let i = 0; i < num.length; i ++){
        document.write(num[i], "<br>");
    }

    //forEach()
    num.forEach(function(element){
        document.write(element, "<br>");
    });

    //forEach(element, index, array)
    num.forEach(function(element, index, array){
        document.write(element, "<br>");
        document.write(index, "<br>");
        document.write(array, "<br>");
    });


}

결과 보기

hihihi

08. 배열 : 데이터 불러오기 : for of

{
    const num = [100, 200, 300, 400, 500];

    for( let i of num ){
        document.write(i, "<br>");
    }
}

결과 보기

09. 배열 : 데이터 불러오기 : for in

{
    const num = [100, 200, 300, 400, 500];

    for( let i in num ){
        document.write(i, "<br>");
    }
}

결과 보기

10. 배열 : 데이터 불러오기 : map()

{
    const num = [100, 200, 300, 400, 500];

    //forEach()
    num.map(function(element){
        document.write(element, "<br>");
    });

    num.map(function(element, index, array){
        document.write(element, "<br>");
        document.write(index, "<br>");
        document.write(array, "<br>");
    });
}

결과 보기

11. 배열 : 데이터 불러오기 : 펼침 연산자

{
    const num = [100, 200, 300, 400, 500];

    document.write(num);
    document.write(num[0], num[1], num[2], num[3], num[4]);
    document.write(...num);
}

결과 보기

12. 배열 : 데이터 불러오기 : 배열구조분해할당

{
    let a, b, c;

    [a, b, c] = [100, 200, "javascript"];

    document.write(a, "<br>");
    document.write(b, "<br>");
    document.write(c, "<br>");
}

결과 보기

13. 객체 : 데이터 불러오기 : 기본

{
    const obj = {
        a: 100,
        b: 200,
        c: "javascirpt"
    }

    document.write(obj.a, "<br>");
    document.write(obj.b, "<br>");
    document.write(obj.c, "<br>");
}

결과 보기

14. 객체 : 데이터 불러오기 : Object

{
    const obj = {
        a: 100,
        b: 200,
        c: "javascript"
    }
    
    document.write(Object.keys(obj), "<br>");
    document.write(Object.values(obj), "<br>");
    document.write(Object.entries(obj), "<br>");
}

결과 보기

15. 객체 : 데이터 불러오기 : 변수

{
    const obj = {
        a: 100,
        b: 200,
        c: "javascript"
    }
    
    const name1 = obj.a;
    const name2 = obj.b;
    const name3 = obj.c;

    document.write(name1, "<br>");
    document.write(name2, "<br>");
    document.write(name3, "<br>");
}

결과 보기

16. 객체 : 데이터 불러오기 : for in

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

    for (let key in obj){
        document.write(obj[key]);
    }
}

결과 보기

17. 객체 : 데이터 불러오기 : map()

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

    obj.map(function(el){
        document.write(el.a);
        document.write(el.b);
        document.write(el.c);
    });
}

결과 보기

18. 객체 : 데이터 불러오기 : hasOwnProperty()

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

    document.write(obj.hasOwnProperty('a'));
    document.write(obj.hasOwnProperty('b'));
    document.write(obj.hasOwnProperty('c'));
    document.write(obj.hasOwnProperty('d'));
    document.write('a' in obj);
    document.write('b' in obj);
    document.write('c' in obj);
    document.write('d' in obj);
}

결과 보기

19. 객체 : 데이터 불러오기 : 펼침 연산자 - 복사

{
    const obj = {
        a: 100,
        b: 200,
        c: "javascript"
    }
    const spread = {...obj}

    document.write(spread.a);
    document.write(spread.b);
    document.write(spread.c);
}

결과 보기

20. 객체 : 데이터 불러오기 : 펼침 연산자 - 추가

{
    const obj = {
        a: 100,
        b: 200,
        c: "javascript"
    }
    const spread = {...obj, d:"jquery"}

    document.write(spread.a);
    document.write(spread.b);
    document.write(spread.c);
    document.write(spread.d);
}

결과 보기

21. 객체 : 데이터 불러오기 : 펼침 연산자 - 결합

{
    const objA = {
        a: 100,
        b: 200
    }
    const objB = {
        c: "javascript",
        d: "jQuery"
    }
    const spread = {...objA, ...objB}

    document.write(spread.a);
    document.write(spread.b);
    document.write(spread.c);
    document.write(spread.d);
}

결과 보기

22. 객체 : 데이터 불러오기 : 비구조화 할당

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

    document.write(a);
    document.write(b);
    document.write(c);
}

결과 보기

23. 객체 : 데이터 불러오기 : 비구조화 할당

{
    const obj = {
        a: 100,
        b: 200,
        c: "javascript"
    }
    const { a: name1, b: name2, c: name3 } = obj;

    document.write(name1);
    document.write(name2);
    document.write(name3);
}

결과 보기