단단히

Objects ( xxx.xx() ) 본문

Java Script/개념정리

Objects ( xxx.xx() )

이게아닌데 2022. 8. 17. 11:57

array라는 리스트를 만드는 방법도 있지만 리스트로 정리하고 싶지 않거나,

리스트로 정리하면 안 되는 상황도 있다. 모든 값이 같은 의미인 list가 아닌 objects를 배울 것이다. 

 

회원을 관리한다고 생각을 해보자.

 

//회원에 대한 정보
const userId = "haha";
const userPassward = "ha123123";
const userLevel = 3;

역시 좋지 못한 코드다.

 

const user = ["haha","ha123123",3];

이처럼 배열을 사용할 수 돼있다. 하지만 배열 사용은 적합하지 않다.

왜냐하면, 각 값의 의미를 알수 없기 때문이다. 

배열 값 중 "haha"가 무슨 의미인지 알 수 없다. 그 나머지도 같다.

(주석을 다는 것들에도 한계가 있을뿐더러 주석을 달아야만 어떤 의미지 알 수 있다는 점)

 

그래서 더 나은 방식을 사용하기로한다.

그동안 console.log(... ) 또는 변수명. push(... )와 같은 xxx.xx()의 사용을 봤다.

 

사용 규칙

중괄호{}를 사용한다. 중괄호 안에서는 새로운 규칙으로 작성된다.

{ = 기호를 안 쓰고 : 기호를 사용한다.  한 개의 값을 적는다.

또 다른 property를 적으려면 쉼표, 로 구분해준다. }

 

const user = {
    Id:"haha",
    points: 20,
    fat: true
};

console.log(user);
console.log(user.points);
//user.points  >> 그동안 봐왔던 패턴과 같다.

 

그동안 사용했던 console.log(.. )에서 console은 object라는 뜻이고,

그 object 어딘가에 log라는 값이 있다는 뜻이다.


이 두 개의 표현은 같은 결과를 가져온다.

 

console.log(user.points);
console.log(user["points"]);

 

 

 

물론, object를 업데이트할 수도 있다.

 

const user = {
    Id:"haha",
    points: 20,
    fat: true
};

console.log(user.points);

user.fat=false;
console.log(user["fat"]);

 

 

 

새로운 property를 만들 수도 있다.

 

const user = {
    Id:"haha",
    points: 20,
    fat: true
};

user.fat=false;
console.log(user["fat"]);

user.Level = 3;
console.log(user);

 

 

'Java Script > 개념정리' 카테고리의 다른 글

Returns  (0) 2022.08.22
Functions_xxx.xx( .. )  (0) 2022.08.19
array  (0) 2022.08.15
Boolrean(true, false), null, undefined  (0) 2022.08.12
변수 var ,let, const  (0) 2022.08.10
Comments