DOTY

JS_2 (Array, Object) 본문

WEB/JS

JS_2 (Array, Object)

증식세포 2020. 10. 27. 20:57
728x90
반응형

배열은 잘 알고 있지만 Object는 조금 다른 듯 하여 헷갈릴까봐 기록해둬야 할 듯 싶었다.

const Week = ["Mon", "Tue", "Wen", "Thur", "Fri", "Sat", "Sun"];

C++ 에서는 중괄호 ( '{ }' ) 를 썼다면, JS 에서는 대괄호 ( '[ ]' )를 쓴다.

JS 에서의 중괄호는 Object에서 쓰이는데, 이를 배열처럼 쓴다면, SyntaxError가 뜰 것이다.

대괄호를 사용한 배열
만약, 중괄호를 쓴다면..!

그럼... Object는 어떤 방식으로 써야할까..?

☞ 짝을 지어주자!

const MyInfo = {
    age : "25",
    gender : "Male",
    isHandsome : true
}

이런식으로 console.log를 찍으면, 

이런식으로 나오게 되고, 또 신기한건 console.log(MyInfo.isHandsome)을 찍게 된다면 true가 나오게 된다.

// 됬어 자연스러웠어.

 

데이터와 이름의 짝으로 이루어져 있는데, 이름은 바꿀 수 있고, 추가로 더 넣을 수도 있다.

const MyInfo = {
    age : "25",
    gender : "Male",
    isHandsome : true
}

MyInfo.age = 24;
MyInfo.isNice = true;

이 둘을 이용해서 데이터를 정리할 수 있는데, Array는 DB에서 가져온것을, 데이터들을 합쳐야 한다(비슷한 정보의 Array를 많이 써야한다면)면 Object를 쓰면 된다.

 

이 둘을 응용해서 다음과 같이도 쓸 수 있다.

const MyInfo = {
    age : "25",
    gender : "Male",
    isHandsome : true,
    favFood : ["Crab", "Coffee", "Fruit"],
    want : [
        {
            what : "travel",
            do : true
        },
        {
            what : "getjob",
            do : false
        }
    ]
}

우선, Object에 Array를 넣는 것도 가능하고, Object도 역시 넣을 수 있다.

데이터 정리를 할 때 쓰면 편할 듯 하다.

 

또 있다.

const calculator = {
    plus: function(a, b) {
        return a + b;
    },
    minus: function(a, b) {
        return a-b;
    },
    times: function(a, b) {
        return a*b;
    }
}

const plus = calculator.plus(5, 5);
const minus = calculator.minus(5, 5);
const times = calculator.times(5, 5);

console.log(plus);
console.log(minus);
console.log(times);

이런 식으로도 함수를 넣을 수 있다.

이를 출력하게 된다면~~~~

결과가 잘 나온다. 

참고로 JS 에서 함수 선언은 다음과 같다.

function pl(a, b) {
    return a+b;
}

const plus = pl(5, 5);

 

728x90
반응형

'WEB > JS' 카테고리의 다른 글

JS_6 (createElement, appendChild, +Saving localStorage)  (0) 2020.11.01
JS_5 (SetInterval, ect.)  (0) 2020.10.30
JS_4 (Events & Handler)  (0) 2020.10.28
JS_3 (DOM)  (0) 2020.10.28
JS_1 (script)  (0) 2020.10.26
Comments