[JavaScript] 09. 자바스크립트 객체 생성

오늘은 자바스크립트에서 객체를 생성하는 방법에 대해 정리해보려고 합니다.

💡객체

순서 없는 집합
key - value로 이루어진 속성들의 집합

📌객체 리터럴 사용하기

{}중괄호를 이용하여 객체를 생성하는 방법을 말합니다.

const person = {}; //[object Object]

또한, 아래와 같이 데이터와 함수를 담아서 객체를 생성할 수 있는데요! 이런 데이터와 함수를 객체의 속성(property)라고 합니다.

const person = {
  name : "송우든",
  age : 25,
  "favorite food" : "제육볶음"
};

console.log(person)
// 출력 :  {name : '송우든', age : 25, 'favorite food' : '제육볶음'}

이 때, 주의해야할 점은 객체의 속성(property)를 구성하는 key는 반드시 문자형이어야만 한다는 것입니다. value는 모든 자료형을 사용할 수 있습니다. 또한, key값에 공백을 포함시키고 싶다면 따옴표 ""를 사용하여 표현할 수 있어요!

자바스크립트에서 객체의 또 다른 특징 중 하나는 함수도 객체의 속성(property)의 value가 될 수 있다는 점입니다.


const person = {
  name : "송우든",
  age : 25,
  introduce : function() { console.log("안녕하세요!"); }
};

person.introduce() // 출력 : 안녕하세요!

위와 같이 사용된 함수를 메서드(method)라고 합니다.

📌new 연산자와 생성자 함수 사용하기

new 연산자생성자 함수를 사용하면 유사한 객체 여러 개를 쉽게 만들 수 있는데요!
아래 예시 코드를 통해 사용방법을 알아보도록 하겠습니다.


function Person(name, age, favortieFood){
  	// this =  {} 
	this.name = name;
  	this.age = age;
  	this.favoriteFood = favoriteFood;
  	// return this;
}

const user = new person("먹깨비",25,"갈비");
console.log(user)l; 
// 출력 : person { name: '먹깨비', age: 25, favoriteFood: '갈비' }

위의 Person()함수를 우리는 생성자 함수라고 하는데요!
이 생성자 함수는 아래 두가지 조건을 가지고 있습니다.

  1. 함수명은 대문자로 시작해야한다.
  2. new 연산자를 붙여서 실행한다.

📌Object() 사용하기

자바스크립트에서 객체를 생성할 때, 내장함수인 Object()를 사용할 수 있는데요!

const person = new Object({
	name : "송우든",
  	age : 25
});

let checkStudy = new Object(true);

console.log(person);// 출력: { name: '송우든', age: 25} 
console.log(checkStudy); // 출력 : [Boolean : true]

참고 자료 및 사이트

JAVASCRIPT.INFO

좋은 웹페이지 즐겨찾기