Super - 부모 클래스 - super 키워드는 constructor 안에서랑 함수에서만 사용할 수 있다. class Person { name; year; constructor(name, year) { this.name = name; this.year = year; } sayHello() { return `Hello I'm ${this.name}`; } } class Singer extends Person { sing() { return `노래합니다.`; } constructor(name, year, part) { // 부모 클래스 // Person() 이거랑 똑같음 super(name, year); this.part = part; } sayHello() { // undefined입니다. rap 파트입..
JavaScript
상속, Inheritance - 상속은 객체들 간의 관계를 구축하는 방법이다. - 수퍼 클래스(또는 부모 클래스)등의 기존의 클래스로부터 속성과 동작을 상속받을 수 있다. - 공통되는 데이터를 정리할 수 있는 방법이다. class Person { name; year; constructor(name, year) { this.name = name; this.year = year; } } class Singer extends Person { sing() { return `노래합니다.`; } } class Actor extends Person { acting() { return `연기합니다.`; } } const zico = new Singer("zico", 1993); console.log(zico); // ..
Static - 객체에 귀속되지 않는다. - 클래스에 직접 귀속돼서 new로 쓸 필요 없다. class Person { name; year; static groupName = '쑤'; constructor(name, year) { this.name = name; this.year = year; } // 함수도 가능 static returnGroupName() { return '쑤'; } } const soo = new Person('soo', 1997); // 객체에 귀속되지 않는다. console.log(soo);// Person { name: 'soo', year: 1997 } // 그럼 어디에 귀속돼있나? // 클래스 자체에 귀속되어있다! console.log(Person.groupName)// 쑤..
Copy of Value - 값에 의한 전달 Copy of Reference - 참조에 의한 전달 - 기본적으로 모든 primitive 값은 값에 의한 전달이다.(function, object, array 빼고 나머지) - 객체는 참조에 의한 전달이다 const soo1 = { name: 'sooyoung', age: 27 } const soo2 = soo1; const soo3 = { name: 'sooyoung', age: 27 } const soo4 = { ...soo3, } console.log(soo1 === soo2);// true console.log(soo1 === soo3);// false console.log(soo2 === soo3);// false console.log(soo3 ==..
http 상태 코드 몇가지 정리해보기 🟢 1~ Informational 요청이 수신되어 처리 중이라는 의미를 가진다. 100 Continue 처리가 되었으니 다음으로 진행 101 Switching Protocols 서버가 프로토콜을 전환중 102 Processing 서버가 요청을 아직 처리중이라 제대로된 응답을 알려줄수 없음 103 Early Hints 웹페이지에 필요한 리소스에 대한 힌트를 제공하여 리소스를 사전 로드하여 로딩을 빠르게 🟢 2~ Success 요청이 정상적으로 처리되었다는 의미를 가진다. 200 OK 클라이언트의 요청을 서버가 정상적으로 처리 201 Created 클라이언트의 요청을 서버가 정상적으로 처리했고 새로운 리소스가 생김 202 Accepted 클라이언트의 요청은 정상적이나, ..
본격적인 node.js 주차가 시작됐다. 자바스크립트 꽤 익숙해진 줄 알았는데 아직 써보지 못했던 구조 분해 할당이 헷갈려 기록해봐야겠다. 🧨 구조 분해 할당 - 배열이나 객체의 속성을 해체하여 그 안의 값을 개별 변수로 담을 수 있게 하는 표현식 - 구조화된 배열과 같은 이터러블 또는 객체를 구조파괴(destructuring) 하여 1개 이상의 변수에 개별적으로 할당하는 것을 말한다. - 배열의 각 요소를 배열로부터 추출, 1개 이상의 변수에 할당한다.(배열의 길이에 맞춰서 변수 할당 하지 않아도 OK) - 배열 구조 분해 할당의 대상(할당문의 우변)은 이터러블이어야 한다. 🙋♀️ 이터러블? Symbol.iterator를 프로퍼티 키로 사용한 메서드를 직접 구현하거나 프로토 타입 체인 통해 상속 받은..
메서드는 자신이 속한 객체의 상태, 즉 프로퍼티를 참조하고 변경할 수 있어야 한다. 이때 메서드가 자신이 속한 객체의 프로퍼티를 참조하려면 먼저 자신이 속한 객체를 가리키는 식별자를 참조할 수 있어야 한다. 1. this? - 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수(self-referencing variable) - this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다. - 단, this가 가리키는 값, 즉 this 바인딩은 함수 호출 방식에 의해 동적으로 결정된다. - 클래스 기반 언어에서 this는 언제나 클래스가 생성하는 인스턴스를 가리키는데 , 자바스크립트의 this는 함수가 호출되는 방식에 따라 this에 바인딩될 ..
🔮 Symbol - 자바스크립트의 ES6에서 도입된 7번째 데이터 타입 - 변경 불가능한 원시값, 다른 값과 중복되지 않는 유일무이한 값 ✨ 생성 -> Symbol 함수 - 심벌값은 Symbol 함수를 호출하여 생성해야 한다. - 생성된 심벌 값은 외부로 노출되지 않아 확인할 수 없고, 다른 값과 절대 중복되지 않는다. const firstSymbol = Symbol(); console.log(typeof firstSymbol);// symbol - 생성자 함수로 객체를 생성하는 것처럼 보이지만, 생성자 함수들과 달리 new 연산자와 함께 호출하지 않는다. new 연산자로 생성된 것들을 호출하면 객체(인스턴스)가 생성되지만, 심벌 값은 변경 불가능한 원시값이다. - 심벌 함수에는 선택적으로 문자열을 인수..
자료형에는 8가지 자료형이 있는데 그 중 7개는 원시형이다. 원시형은 오직 하나의 데이터(문자열, 숫자 등)만 담을 수 있기 때문에 '원시형'이라 부른다. 그러나 객체형은 원시형과 달리 다양한 데이터를 담을 수 있다. 📍객체형 - 키로 구분된 데이터 집합이나 복잡한 개체(entity)를 저장할 수 있다. - {...} 중괄호를 사용해 만들고, 중괄호 안에는 'key-value' 형태인 프로퍼티를 여러 개 넣을 수 있다. - 중괄호를 이용해 객체를 선언하는 것을 객체 리터럴이라고 부르며 객체 선언 시 주로 이 방법을 사용한다. - key -> 문자형만 허용 / value -> 모든 자료형 허용 - 프로퍼티 키는 프로퍼티의 이름 또는 식별자라고도 한다. 📍 리터럴과 프로퍼티 // 'user' 라는 객체 리터..
✨ 배열 - 순서가 있는 컬렉션을 저장할 때 쓰는 자료구조 let arr = ['apple', 'banana', 'orange']; - 배열 요소에는 0부터 시작하는 숫자가 매겨져 있다.(인덱스) let arr = ['apple', 'banana', 'orange']; // 배열의 첫번째 요소의 인덱스는 무조건 0부터 console.log(arr[0]);// apple console.log(arr[1]);// banana console.log(arr[2]);// orange - 새로운 요소를 배열에 추가하는 것도 가능하다. let arr = ['apple', 'banana', 'orange']; arr[3] = 'lemon'; console.log(arr);// (4) ['apple', 'banana',..
