[JavaScript] 객체(object)

김터넷 ㅣ 2023. 3. 22. 21:53

728x90
반응형

배열과 객체의 차이를 알자

배열은 데이터가 추가되면 배열 전체에 중복되지 않는 'INDEX'가 자동으로 만들어져서

추가된 데이터에 대한  *식별자가 된다. 중요한 것은 배열은 식별자로 '숫자'를 사용한다는 점이다.

 

*식별자

1. 데이터 항목에 이름을 부여하여 일시적으로 규정 또는 그 데이터의 어떤 특성을 표시하기 위해서 사용하는 기호 또는 집합

2. 이름을 붙이거나, 지시하거나, 위치를 나타내는 데 사용하는 부호

 

하지만 객체는 INDEX로 문자를 사용한다는 점 그리고 식별자에 이름이 부여된다.

예를들어 배열은 A라는 학교에 1반 2반 3반이라고 한다면 객체는 1반에 누구, 2반에 누구, 3반에 누구

이런식으로 요소들에게 이름을 붙여 특징을 부여하는 형태이다.  

객체의 생성은 '{ }'

배열은 ' [ ] '를 사용했다면 객체는 ' { } ' 를 사용한다.

형식은 아래와 같다.

var 변수명 = { ' KEY값 ' : Value값, ' KEY값 ' : Value값, ' KEY값 ' : Value값};

 

객체를 만들었으니 필요한 값만 가져온다면 member1이라는 이름(key)으로 저장된 값을 가져 와보겠다.

 

 

가져올때는 (변수명 [ key값 ] );  대괄호가 들어간다.

이외에도 console.log( members.member1); 으로 접근이 가능하다.

 

반복문을 사용하여 객체를 다루는법 포인문( For in ) ! 

 

배열은 저장된 데이터에 인덱스 값을 자동으로 부여받기 때문에 내부적으로 순서를 가지고 있다.

먼저 들어간 것과 나중에 들어간 것의 "순서"가 있는데 이는 배열에서 아주 중요한 정보이다.

하지만 객체는 배열과 달리 순서가 없다. 다만 Key가 있고 Value만 있을뿐.

즉, 객체에 저장된 데이터 정보만 있을뿐 순서는 따로 없다.

따라서 저장된 값이 순서에 따라서 배열처럼 나열되어 나오지 않을 것이라고 생각하고 사용해야 한다.

형식은 아래와 같다.

var members(객체) = { ' key값 ' : value값, ' key값 ' : value값, ' key값 ' : value값);

for ( key(변수) in members(객체) ) // 1.뒤쪽에 객체를 위치 시켜주고 앞에다 키라는 변수를 정의해준다.
                                                                     // 2.그러면 반복문이 실행되면서 객체의 값을 하나씩 key라는 변수에 담는다.
                                                                     // 3. 하지만 전체를 담는 것이아닌 key값만 담아서 저장을 한다. 
                                                                     // 4. 그럼 key라는 변수는 객체를 구성하고 있는 key값이 된다.
{
       document.write( " key : " + key+ " value : "+members[key] + " <br / >");
}

 

key라는 값이 어떻게 변하는지가 키포인트!

 

 document.write( " key : " + key+ " value : "+members[key] + "<br />");

그렇다면 객체에 담긴 값은 어떻게 가져올까?

그것은 members[key] 로 객체에 담긴 값을 가져올 수 있다.

 

 자 그럼 html의 마크업언어를 사용하여 리스트로 만들어보자.

 

 

반응형

'JAVASCRIPT' 카테고리의 다른 글

[JavaScript] UI와 API, 문서  (0) 2023.03.24
[JavaScript] 모듈  (0) 2023.03.23
[JavaScript] 배열 ( 'array' )  (0) 2023.03.21
[JavaScript] 함수 (Function)  (0) 2023.03.20
[JavaScript] 반복문 ( while, for )  (0) 2023.03.20