본문 바로가기

TIL/기록

[TIL] 객체(Object) 기초

자바스크립트는 객체기반의 스크립트 언어로 자바스크립트를 이루는 모든것들이 객체로 존재한다. 

 

  • 기본 정의

객체지향언어를 다루어본 사람이라면 객체의 기본개념이 데이터(주체)와 그 데이터에 관련되는 동작(절차, 방법, 기능)을 모두 포함하고 있는 개념이란 기본적인 내용은 익히 알고 있을 것이다. 

한마디로 객체는 자신의 정보를 가지고 있는 독립적인 주체이다. 우리 주위에 보이는 컴퓨터, 책상, 의자, 마우스 등 모두 자신만의 특성을 가진 객체인 셈이다.

 

  • 프로퍼티(Property) & 메소드(Method)

객체란 것은 결국 껍데기를 이루는 말이고 실제 객체를 완성하는 구성요소들은 이 property와 method이기 때문이다. 즉 우리가 객체라고 부르는 것은 케이스가 실제 컴퓨터를 구성하고 있는 것은 메모리, 보드, 디스크 등등을 안에 포함하고 있기 때문에 우리는 그것을 쓸모있는 객체로서 컴퓨터라고 부를 수 있는 것이다. 

 

  • 프로퍼티(Property)

객체의 속성을 나타내는 접근 가능한 이름과 활용 가능한 값을 가지는 특별한 형태이다. 

프로퍼티란 기본적으로 이름과 값을 가지고 객체의 정보를 담고 있는 녀석들이다. 이 프로퍼티의 접근 연산자는 ' . ' 이다.

이 연산자를 통해 프로퍼티를 추가할수도 있고, 프로퍼티에 접근할수도 있다. 


let person = {}; //person 객체 생성
// name이라는 프로퍼티를 생성하면서 kim 이라는 값을 할당
person.name = 'kim';
// . 연산자를 이용해 person 객체의 name 프로퍼티에 접근해 값을 활용 가능하다.
let newName = 'Mr. ' + person.name;
console.log(newName); //kim

 

 - 프로퍼티 삭제 

자바스크립트에서 프로퍼티에 아무런 값도 할당하지 않으면 syntax error이다. 

프로퍼티는 undefined나 null 을 할당한다고 삭제되지 않는다.

프로퍼티의 삭제는 delete 라는 keyword를 사용하여야 한다.

delete person.name //undefined

 

  • 메소드(Method)

메소드는 객체가 가지고있는 동작이다.

메소드를 수행하기 위해서는 객체를 통해서 해당 메소드를 수행하여야 한다. 즉, 그 동작을 수행하는 주체는 객체이며 그 동작을 수행하기 위해서는 객체에게 그 동작을 수행하라고 지시해야 한다. 

그 동작을 수행하기 위해서 객체의 정보를 담고있는 프로퍼티를 사용할 수 있다. 

let person2 = {};
person2.a = 'Mrs.';
person2.b = 'Lee';
person2.sum = function () {
	console.log(person2.a + person2.b);
};
person2.sum(); //Mrs.Lee

 

자바스크립트에서의 메소드는 각각 개별 객체로 존재한다.

그 사용법은 동일하지만 객체에 속한 메타 데이터를 사용하는 것이 아닌 그 객체로부터 파생되어 확장된 새로운 객체를 사용하는 것이다. 

 

  • 자바스크립트의 객체(Object) 생성
// constructor 를 사용해 객체를 생성하는 예
let person = new Object();
person.name = 'Kim';
console.log(person.name);

//JSON 방식을 사용해 객체 리터럴
let people = {
	name: 'Lee',
};
console.log(people.name); //Lee

 

  • Object 객체

Built-in 객체로서 최상위레벨의 객체이다. 즉 모든 객체는 이 Object 객체에서 파생되어 나온 확장형태인 것이다. 

자바스크립트의 모든 객체가 자유롭게 확장될 수 있는 이유도 Object 객체가 가진 특별한 구성요소 때문이다. Object 객체가 가진 특별한 구성요소들이란 바로 constructor, prototype 이라는 프로퍼티와 hasOwnProperty(), toString(), isPrototypeOf() 라는 메소드들이다. 

 

 

'TIL > 기록' 카테고리의 다른 글

[TIL] React 기본 용어  (0) 2024.01.23
[TIL] Hook  (0) 2024.01.22
VS Code Extensions 확장프로그램 정리  (0) 2024.01.18
React 시작 전 설치  (0) 2024.01.17
[TIL] delete  (0) 2024.01.16