[Javascript] 객체에 대하여

Kiara ·2023년 3월 24일
0

Javascript

목록 보기
6/6

일급 객체인 Javascript를 완벽하게 이해하기 위해서는 객체와 함수에 대한 충분한 지식과 이해가 요구된다. 가장 처음으로 알아야 하는 것은 객체라고 생각한다!

💎 객체(Object)

: 원시 값을 제외한 나머지 값(function, array, 정규 표현식 등)은 모두 객체라고 볼 수 있다. 원시 타입(primitive type)은 변경 불가능(immutable value)한 단 하나의 값이지만, 객체 타입(object/reference type)은 다양한 타입의 값을 하나의 단위로 구성한 복합적인 자료구조이면서, 변경 가능한 값(mutable value)을 갖는다.

💎 객체의 구성

: 객체는 0개 이상의 프로퍼티로 구성된 집합으로, 프로퍼티는 키(key)와 값(value)으로 구성된다.

let today = {
  weather : "맑음",
  date : 24
}

객체 이름 : today
프로퍼티 : { weather : "맑음", date : 24 }
프로퍼티의 키 : weather, date
프로퍼티의 값 : "맑음", 24

💎 프로퍼티와 메서드

: JS에서의 모든 값은 프로퍼티의 값이 될 수 있고, JS의 함수는 일급 객체이기 때문에 함수를 프로퍼티 값으로 이용할 수 있다. 프로퍼티의 값이 함수인 경우를 메서드(method)라고 부른다.

var counter = {
	num : 0,					//프로퍼티
  	increase : function() {		//메서드 
      this.num++
}

프로퍼티와 메서드에 관한 자세한 내용은 여기!!

💎 객체 리터럴에 의한 객체 생성

프로토타입 기반 객체지향 언어인 Javascript는 객체 리터럴, Object 생성자 함수, 생성자 함수, Object.create 메서드, 클래스(ES6) 등의 다양한 객체 생성 방법을 지원하지만 가장 일반적으로 사용하는 것은 객체 리터럴이다.

let weather = {
  predict : "흐림",
  broadcast : function() {
    console.log(`내일의 날씨는 ${this.predict}으로 예상됩니다.`);
  }
};

console.log(typeof weather) 	//object
console.log(weather)			//{ predict: '흐림', broadcast: [Function: broadcast] }

객체 이름 : weather
프로퍼티 : 1개 ( 키 : predict, 값 : "흐림" )
메서드 : 1개 ( 키 : broadcast, 값 : function )

객체 리터럴은 중괄호{} 내에 0개 이상의 프로퍼티를 정의하고, 중괄호 내에 프로퍼티를 정의하지 않으면 빈 객체가 생성된다.

const empty = {};			//빈 객체 생성 후 변수에 할당함
console.log(empty);			//{ }
console.log(typeof empty);	//object

🗝️ 객체의 중괄호는 코드 블럭일까?

결론부터 말하자면 객체의 중괄호는 코드 블럭을 의미하는 것이 아니다. 객체 리터럴은 표현식이기 때문에 닫는 중괄호 뒤에 세미콜론;을 붙이지만, 코드 블록의 닫는 중괄호 뒤에는 붙이지 않는다.

function repeat(input) {		//함수의 중괄호는 코드 블록을 의미함
  console.log(input);
}								//; 생략 가능

let clock = {					//객체의 중괄호는 표현식을 의미함
  hours : 6,
  mins : 30 
};								//; 생략 불가능

하지만 실제로 실행해보면 세미콜론;의 여부와 상관없이 정상적으로 실행된다 ...


Ref.
모던 자바스크립트 Deep Dive : 자바스크립트의 기본 개념과 동작 원리

profile
Front/Back Beginner

1개의 댓글

comment-user-thumbnail
2023년 4월 14일

잘하시네여.. 한 수 배우고 갑니다..

답글 달기