자바스크립트의 객체(Object),배열(Array)

 

객체란, 현실의 사물을 프로그래밍한 것이다. 나를 프로그래밍 해보자 !

 

var hyo = {

           firstName: ‘Lee’,

           lastName: ‘sang hyo’

};

간단하게 나를 만들었다. 위와 같이 hyo 라는 변수에 { } 로 감싼 덩어리를 넣었다.

이 덩어리가 나를 표현하는 “객체” 인 것이다. 객체의 부분별 이름을 알아보자.

 

속성(Property)

객체 안을 보면 firstName , lastName 이 왼쪽에 있고, ‘Lee’,’sanghyo’ 가 오른쪽에 있다.

콤마로 구분되는 것들을 객체의 속성이라고 한다. hyo 라는 객체에는

firstName: ‘Lee’ 와 lastName : ‘sang hyo’ 두 개의 속성이 있는 것 !

속성 끼리는 쉼표로 구분 !

 

키(Key)와 값(Value)

 

속성에서 firtName 과 lastName 같은 것들을 객체의 키라고 부르고 ‘Zero’와 ‘sang hyo’ 를 값이라 부른다.

키는 문자열만 가능하다. 키는 따옴표가 없어도 된다. 띄어 쓰기가 들어간 경우에는 써줘야 한다.

 

속성값(Value)는 어떤 값이든 상관 없다. 문자열이어도 되고, 숫자여도 되고, 객체나 함수여도 상관없다. 우리는 속성값이 함수인 것을 메소드라고 특별히 따로 부른다.

 

hyo 객체 안에 firstName , lastName 속성의 값을 사용하고 싶을 때는

속성의 이름을 부르면 된다.

hyo.firstName;

hyo[‘firstName’];

hyo.lastName

이렇게 접근 한다. 마침표를 사용해 속성들에 접근하는 것이다. [ ] 안에 적어야 하는 경우는 ,

속성명에 띄어쓰기가 들어간 경우 사용한다.

 

아래 처럼 객체 안에 객체가 들어갈 수도 있다.

var hyo = {

           body: {

           height: 173

           }

};
hyo.body.height; // 173

 

복잡한 데이터 구조를 짤 때 유용할 것 같다는 생각이 든다.

 

객체의 속성을 삭제하는 방법은 delete 키워드를 사용하면 된다.

 

delete hyo.body.height;

delete hyo.body.height;

 

객체는 다음과 같이 만들 수도 있다.

 

var hyo = new object();

hyo.firstName = ‘Lee’

hyo.lastName = ‘sang hyo’

hyo.body = new object();

hyo.body.height = 173;

 

{ } 를 사용해서 만든 객체를 객체 리터럴(literal)이라고 부른다.

new 라는 키워드를 사용하지 않고 만든 모든 것이 리터럴이다.

문자열, 숫자도 new String() , new Number() 이렇게 만들 수 있다.

이렇게 하지 않고, ‘hyo’, 173 값으로 바로 쓰는 것을 문자열 리터럴, 숫자 리터럴, 이렇게 부르는 것이다.

객체 중 특수한 객체가 있다. 함수(Function) , 배열(Array) 이다.

 

배열(Array)

var array = [];

var array2= [1, "hi", [1,2,3], { hello: 1}];

배열은 [ ] 로 감싸서 나타내고, 객체 리털처럼 안에는 무엇이든지  다 들어갈 수 있다.

배열 안에 배열이 들어가도 되고, 배열 안에 객체가 들어가도 된다. 함수도 들어갈 수 있다.

배열 안에 들어간 것들을 요소(item)이라고 부른다. 객체의 속성처럼 쉼표로 구분하면 된다.

자바스크립트는 배열의 길이를 미리 정할 필요가 없다 ! 

 

객체와의 차이점은 키가 없다는 것. 그냥 값들만 순서대로 나열되어 있다. 

아까의 hyo 객체에서 키만 없어지면,

var hyo = ['Lee','sang hyo'];

이런 모양이 되는 것이다. 키가 필요하지 않고, 값만 나열하고 싶을 떄 배열을 사용한다.

 

배열 안의 요소를 선택하려면 뒤에 몇번째 요소인지 숫자를 붙여주면 된다.

 

hyo[0]; // 'Lee'

hyo[1]; // 'sang hyo'

 

배열도 키가 있는 것..같다 자동으로 키가 0,1,2,3 순서로 주어 지는 것이고, 객체는 우리가 키를 지정하는 것 이라고 할

수 있겠다.

 

 

배열도 new 키워드를 사용해서 만든다면,

var array = new Array();

array[0] = 'Lee'

array[1] = 'sang hyo

'

이런식으로 만들 수 있을 것이다. 

배열도 new 키워드를 사용하지 않고 만든 것을 배열 리터럴 이라고 부른다.