JudithHopps JudithHopps

I. 스프레드 spread 1. 기본 문법 const class1 = { x: 1, y: 'A', z: true }; ​ const class2 = { ...class1 }; ​ // 아래의 참조복사 코드와 다름! // const class2 = class1; ​ console.log(class2); 2. 특정 객체의 프로퍼티를 포함하는 다른 객체 생성에 유용 const class1 = { a: 1, b: 'A', c: true }; const class2 = { d: { x: 10, y: 100 }, e: [1, 2, 3] }; const class3 = { ...class1, z: 0 } const class4 = { ...class2, ...class3, ...class2.d } console.lo..

💡 상속 inheritance 서로 다른 클래스나 생성자 함수가 같은 속성들을 공유할 때 이들의 관계를 정의함으로써 코드의 중복을 줄이고 효율을 높임 "B클래스는 A클래스에서 파생된다." - "B는 A의 하위분류" I. 클래스의 상속 문법 class Bird { wings = 2; } class Eagle extends Bird { claws = 2; } class Penguin extends Bird { swim () { console.log('수영중...'); } } class EmperorPenguin extends Penguin { size = 'XXXL'; } const birdy = new Bird(); const eaglee = new Eagle(); const pengu = new Peng..

I. 접근자 프로퍼티 👉 getter MDN 문서 보기 👉 setter MDN 문서 보기 getter, setter 함수라고도 부름 스스로는 값을 갖지 않음 - 다른 프로퍼티의 값을 읽거나 저장할 때 사용 get, set을 앞에 붙임 const person1 = { age: 17, ​ get koreanAge () { return this.age + 1; }, ​ set koreanAge (krAge) { this.age = krAge - 1; } } console.log(person1, person1.koreanAge); person1.koreanAge = 20; ​ console.log(person1, person1.koreanAge); 💡 함수처럼 지정되었지만 프로퍼티처럼 사용! ⭐️ 클래스에서도 ..

I. 클래스 class를 사용하여 인스턴스 만들기 👉 MDN 문서 보기 class YalcoChicken { constructor (name, no) { this.name = name; this.no = no; } introduce () { // 💡 메서드 return `안녕하세요, ${this.no}호 ${this.name}점입니다!`; } } const chain1 = new YalcoChicken('판교', 3); const chain2 = new YalcoChicken('강남', 17); const chain3 = new YalcoChicken('제주', 24); console.log(chain1, chain1.introduce()); console.log(chain2, chain2.introdu..

💡 생성자 함수의 필요성 // 얄코치킨의 체인점을 나타내는 객체들 ​ const chain1 = { name: '판교', no: 3, introduce () { return `안녕하세요, ${this.no}호 ${this.name}점입니다!`; } }; ​ const chain2 = { name: '강남', no: 17, introduce () { return `안녕하세요, ${this.no}호 ${this.name}점입니다!`; } }; ​ const chain3 = { name: '제주', no: 24, introduce () { return `안녕하세요, ${this.no}호 ${this.name}점입니다!`; } }; ​ // 이처럼 같은 형식의 객체들을 다수 만들어야 한다면? I. 생성자 함수로..

I. 객체 생성과 프로퍼티 접근 const food1 = { name: '햄버거', price: 5000, vegan: false }; ​ console.log(food1); console.log( food1.name, // 💡 마침표 프로퍼티 접근 연산자 food1['price'] // 💡 대괄호 프로퍼티 접근 연산자 ); // 빈 객체 생성 const food2 = {}; console.log(food2); // 프로터피 추가 food2.name = '샐러드'; food2.price = '6000'; food2['vegan'] = true; ​ console.log(food2); // 프로터피 수정 food2['price'] = '6500'; food2.vegan = false; ​ console.l..

💡 함수의 매개변수 갯수를 넘어가는 인수 오류를 일으키지 않고 무시됨 function add(a, b) { return a + b; } ​ console.log( add(1, 3), add(1, 3, 5), add(1, 3, 5, 7) ); I. 기본값 매개변수 default parameter 👉 MDN 문서 보기 function add(a = 2, b = 4) { console.log(`${a} + ${b}`); return a + b; } ​ console.log( add(), add(1), add(1, 3) ); II. arguments - 함수 내에서 사용가능한 지역 변수 👉 MDN 문서 보기 배열의 형태를 한 객체 - 배열은 아니지만 사실상 배열처럼 동작 (배열도 사실 객체지만...) 함수 호출..

일급 객체 First Class Object 👉 MDN 문서 보기 함수를 변수와 같이 다루는 언어에 있는 개념 자바스크립트의 함수도 일급 객체 함수는 기본적으로 객체 // ⭐️ 함수의 자료형 function addNumbers (a, b) { return a + b; } console.log(typeof addNumbers); 일급 객체의 특성 상수 또는 변수에 할당될 수 있음 다른 함수에 인자로 전달될 수 있음 다른 함수의 결과값으로서 반환될 수 있음 I. 할당 function isOddNum (number) { console.log( (number % 2 ? '홀' : '짝') + '수입니다.' ); return number % 2 ? true : false; }; ​ const checkIfOdd ..