7차시 객체(Object)
- 관련된 정보를 하나로 묶어주는 특별한 상자
- 데이터를 키-값 쌍으로 저장하는 자료 구조
1) 객체를 정의하는 방법
(1) 객체 리터럴
let person = {
name : "Alice",
age : 30,
} // 중괄호로 객체 작성(2) Object 생성자 함수
let person = new Object(); // 빈 객체를 생성하고 나중에 속성 추가 가능
person.name = "Bob";
person.age = 25;(3) 생성자 함수
: 객체 생성을 위한 템플릿 역할
function Person(name, age){
this.name = name;
this.age = age;
}
let person1 = new Person("Charlie", 30); // new 키워드와 함께 사용(4) Object.create() 메서드
let personProto = {
greet: function() {
console.log(`Hello, I'm ${this.name}`);
},
};
let person = Object.create(personProto);
person.name = "David";(5) 클래스
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
greet() {
console.log(`Hello, I'm ${this.name}`);
}
}
let person = new Person("EVE", 28);
- 생성자 함수를 통해 객체를 만드는 것과, 클래스를 통해 객체를 만드는 두 방식이 어떤 차이가 있는지 GPT한테 물어봄
| 생성자 함수 (function) | 클래스 (class) | |
| 문법 | prototype을 직접 관리해야함 | 메서드가 자동으로 prototype에 추가됨 |
| new 없이 호출 | undefined 반환 (실수 가능) | TypeError 발생 (안전) |
| 상속 | Object.create() + call() 필요 | extends + super로 간편히 가능 |
| 호이스팅 | 호이스팅됨 | 호이스팅 되지 않음 => 선언전에 사용할 경우, ReferenceError 발생 |
2) 객체 복사 방법
(1) 얕은 복사
- 최상위 속성만 새 객체로 복사되고, 중첩된 객체는 원본과 같은 참조를 공유
- Object.assign() 메서드를 사용하여 객체를 얕게 복사할 수 있음
(2) 깊은 복사
- 원본과 완전히 독립적인 객체가 생성
- JSON.parse(JSON.stringify()) 방법을 사용하여 객체를 깊게 복사
3) JSON (Javascript Object Notation)
- JSON은 데이터를 저장하고 전송하기 위한 경량의 데이터 교환 형식
- 구조는 키-값 쌍의 컬렉션(객체), 순서화된 값의 목록(배열)로 구성됨
- JSON.stringfy() : JavaScript 객체를 JSON 문자열로 변환하는 JSON 메서드
- JSON.parse() : JSON 문자열을 JavaScript 객체로 변환하는 JSON 메서드
8차시 함수
- 클로저 : 내부 함수가 외부 함수의 변수에 접근할 수 있는 구조 -> 데이터 은닉과 모듈화에 유용
- 함수 팩토리 : 다른 함수를 반환하는 함수, 동적으로 새로운 함수를 생성하고 반환
- 비동기프로그래밍 : 작업이 완료될 때까지 기다리지 않고 다음 작업을 실행하는 방식
- 콜백 함수 : 다른 함수에 인자로 전달되는 함수
9차시 비동기 프로그래밍
1. promise
- 비동기 작업의 최종 완료 또는 실패를 나타내는 객체
1) 목적 : 콜백 지옥 문제 해결 및 비동기 코드의 가독성 향상
2) 상태 : 대기, 이행, 거부
3) Promise 사용
- .then() : 성공 시 실행될 콜백
- .catch() : 실패 시 실행될콜백
4) Promise 체이닝
- .then()은 새로운 Promise를 반환
2. async/await
- promise를 기반으로 한 직관적인 비동기 프로그래밍 문법
- 목적 : 비동기 코드를 동기 코드처럼 보이게 작성
async 함수는 항상 Promise를 반환
- wait는 Promise의 이행을 기다림
댓글