객체 (Objects) - 객체와 프로퍼티 (Object and Properties)

Javascript에서는null과 undefined를 제외한 모든 것들은 객체처럼 동작합니다.

true.toString(); // 'true'

false.toString(); // 'false'

[1, 2, 3].toString(); // '1,2,3'

['a', 'b', 'c'].toString(); // 'a,b,c'

function Monkey(){}

Monkey.bar = 1;

Monkey.bar; // 1

10.toString(); // SyntaxError

코드의 마지막 줄에서는 숫자 리터럴을 객체처럼 사용하려고 하였으나, Javascript에서 Dot Notation이 있는경우 위와같이 SyntaxError로 반환됩니다.

하지만, 꼼수를 사용하여 우리는 숫자를 객체처럼 사용할 수 있습니다.

10..toString(); // 점을 두개 붙였을 경우

10.toString(); // 점 왼쪽 공백이 있는 경우

(10).toString(); // 숫자를 ()안에 넣어 10을 먼저 해석하도록 하는경우

객체 타입 (Object Type)

Javascript 객체는 Hashmap처럼 사용이 가능합니다. 객체는 name과 value가 쌍으로 된 프로퍼티로 구성되기 때문입니다.

객체리터럴 - {} Notation - 으로 객체를 만들면 Object.prototype을 상속받고 프로퍼티를 하나도 가지지 않은 객체가 생성되어집니다.

var monkey = {}; // 내용물이 없는 새로운 객체를 만듭니다.

// 값이 10인 'banana' 프로퍼티가 있는 객체를 만듭니다.

var fruit = { banana: 10 };

프로퍼티 접근 (Accessing Properties)

객체의 프로퍼티는 두가지 방법을 사용하여 접근 할 수 있습니다.

var fruit = { name: 'banana' }

var get = 'name';

// 1. Dot Notation: 객체이름 다음에 점을 찍는 방법

fruit.name; // banana

// 2. Square Bracket Notation: 각괄호를 사용하는 방법

fruit['name']; // banana

fruit[get]; // banana

// 각괄호를 이용할 경우 프로퍼티 이름을 동적으로 할당해서 값에 접근이 가능합니다.

// 점을 이용할 경우 구문 오류를 발생시킵니다.

fruit.1234; // SyntaxError

fruit['1234']; // works

프로퍼티 삭제 (Deleting Properties)

객체의 프로퍼티는 delete를 사용하여 삭제할 수 있습니다. delete를 사용하지 않고 프로퍼티에 undefined나 null값을 할당하는 방식은 프로퍼티를 삭제하는 것이 아니라 프로퍼티에 할당된 value만 지우고 key값을 그대로 두는 방식입니다.

var obj = {

x: 1,

y: 2,

z: 3

};

obj.x = undefined; // x 프로퍼티에 undefined값 할당

obj.y = null; // y 프로퍼티에 null값 할당

delete obj.z; // z 프로퍼티 삭제

for (var i in obj) {

if (obj.hasOwnProperty(i)) {

console.log(i, '' + obj[i]);

// x undefined

// y null

}

}

표기법 (Notation of Keys)

프로퍼티는 따음표 없는 문자열(plain)과 따음표로 감싼 문자열(strings)을 모두 key값으로 사용할 수 있습니다.

var monkey = {

'monkeyKing': 'I am a King of Monkey',

monkeyQueen: 'I am a Queen of Monkey'

};

License

이 게시글은 JavaScript Garden을 참고하여 작성 되었습니다. (https://github.com/BonsaiDen/JavaScript-Garden)