[Day 18 | JS] 자바스크립트 - 객체

y♡ding·2024년 11월 6일
0

데브코스 TIL

목록 보기
123/163

JavaScript 객체 기본 - Web 개발 학습하기 | MDN

1. 객체의 기본 개념

JavaScript에서 객체는 {}를 사용해 정의하며, 여러 속성(프로퍼티)과 메서드(함수)를 포함할 수 있습니다. 객체는 프로퍼티(Property)메서드(Method)라는 두 가지 주요 구성 요소로 이루어집니다.

  • 프로퍼티(Property): 객체가 가진 데이터의 키-값 쌍입니다. 키는 고유해야 하며, 값을 통해 데이터를 저장합니다.
    * 메서드(Method): 객체의 동작을 정의하는 함수입니다. 특정 작업을 수행하는 기능을 객체에 포함할 수 있습니다.
let person = {
    name: "홍길동",
    age: 25,
    greet: function() {
        console.log("안녕하세요! 저는 " + this.name + "입니다.");
    }
};

위 예제에서 person 객체는 nameage라는 프로퍼티, greet라는 메서드를 포함하고 있습니다.

2. 객체 생성 방법

객체를 생성하는 다양한 방법이 있으며, 각 방식의 특징과 사용 예시는 다음과 같습니다.

2.1 객체 리터럴

객체 리터럴은 가장 간단하게 객체를 생성하는 방법입니다. {} 안에 키-값 쌍을 정의하여 객체를 생성합니다.

let car = {
    brand: "Hyundai",
    model: "Sonata",
    year: 2021
};

2.2 new Object() 구문

new Object() 구문을 사용해 객체를 생성할 수도 있지만, 일반적으로 객체 리터럴 방식이 더 간결하고 자주 사용됩니다.

let car = new Object();
car.brand = "Hyundai";
car.model = "Sonata";
car.year = 2021;``

2.3 생성자 함수(Constructor Function)

생성자 함수는 여러 개의 객체를 생성할 때 유용합니다. 생성자 함수는 대문자로 시작하는 것이 관례이며, this를 사용해 각 객체의 속성을 설정합니다.

function Car(brand, model, year) {
    this.brand = brand;
    this.model = model;
    this.year = year;
}

let myCar = new Car("Hyundai", "Sonata", 2021);
console.log(myCar);  // 출력: { brand: "Hyundai", model: "Sonata", year: 2021 }``

2.4 클래스(Class) 방식 (ES6)

ES6부터는 class 키워드를 사용해 클래스를 정의하고 객체를 생성할 수 있습니다. 클래스는 생성자 함수의 문법을 단순화한 방식으로, 객체 지향 프로그래밍에 적합합니다.

class Car {
    constructor(brand, model, year) {
        this.brand = brand;
        this.model = model;
        this.year = year;
    }

    getInfo() {
        return ${this.brand} ${this.model}, ${this.year};
    }
}

let myCar = new Car("Hyundai", "Sonata", 2021);
console.log(myCar.getInfo());  // 출력: "Hyundai Sonata, 2021"

0개의 댓글

관련 채용 정보