본문 바로가기

전체 글65

Promise / async / await Promise 어떠한 값으로 이행, 거부될 예정인 상태 또는 그 상태가 정해지지 않은 상태를 나타내며 값이 현재 시점에 결정되지 않은채로 작업을 이어나갈때 쓰기 좋은 타입이다. Promise의 생성 생성하는 방법은 여러가지이다. Promise.resolve 또는 Promise.reject를 통하여 생성이 가능하다. 특정한 값이 아닌 함수의 결과 (API를 이용한 미래에 값이 도출되는 경우도 마찬가지이다.)를 Promise로 만들고 싶을때에는 new Promise(callback)으로 구성이 가능하다. Promise의 resolve, reject메서드를 통한 생성 Promise.resolve(a)는 a라는 값으로 이행될 Promise를 생성한다. Promise.reject(a)는 a라는 이유로 거부될 Pr.. 2020. 8. 17.
2020.08.11 - fetch fecth를 이용하여 웹 정보 사용하기 fetch API는 특정 URL로 부터 정보를 받아오는 역할을 한다. 이때 fetch를 통해 얻어온 정보는 Promise상태이다. 고로 then, catch와 같은 메서드를 사용할 수 있다. fetch('https://v1.nocodeapi.com/codestates/google_sheets/YbFMAAgOPgIwEXUU?tabId=최신뉴스') .then(data => (data.json())).then(data => { console.log(data); }).catch(err => { throw new Error(err); }) 여기서 fetch를 통해 불러온 data는 기본적으로 json메서드가 존재한다. 불편하게 직접 JSON.parse를 해줄 필요가 없는 것.. 2020. 8. 11.
2020.08.10 - promise/async/await 공부하기전 접한 키워드 promise async / await promise 직역하면 약속이라는 뜻으로 JavaScript 내부에서는 아래와 같이 사용된다. Promise는 프로미스가 생성될 때 꼭 알 수 있지는 않은 값을 위한 대리자로, 비동기 연산이 종료된 이후의 결과값이나 실패 이유를 처리하기 위한 처리기를 연결할 수 있도록 합니다. 프로미스를 사용하면 비동기 메서드에서 마치 동기 메서드처럼 값을 반환할 수 있습니다. 다만 최종 결과를 반환하지는 않고, 대신 프로미스를 반환해서 미래의 어떤 시점에 결과를 제공합니다. - MDN - 즉 비동기 실행에 의해 언제 처리가 완료되거나 실패 할지 모르는 어떤것에 대하여 처리 완료되었다면 어떻게, 실패하였다면 어떻게.. 할지 등등에 대하여 미리 정해두고 그에따.. 2020. 8. 10.
코드스테이츠 8주차 회고 회고에 앞서 회고에 대한 회고를 진행해야 할 듯 하다. 회고에 대한 작성 필요성을 최근에 다시 느끼게 되었다. 회고에 대한 회고 계획했던 회고록에 대한 방향 2주마다 회고록을 작성하며 자신을 돌아보려함 이에 대한 이행 여부 의도한 대로 이행되지 않음. 문제점 파악 및 개선방안 변명처럼 들릴지 모르지만 아주 많이 바빴다. 이머시브 들어오고 나서 이전 내용들과 동일한 성취도를 달성하기 위해 소요되는 시간이 현저히 늘어났음을 느꼈다. 개념적인 내용에 대해 충분한 이해를 요구하고, 이를 통하여 어떻게 풀어나갈지 논리회로 구성에 대한 사고력이 중요해져 그렇다고 생각한다. 아래는 회고작성에 대한 나의 문제점들이다. 시간관리가 제대로 되고 있지 않는것 같다. 시간이 모자라 무언가를 하나 미루거나 포기하게되고, 지금 .. 2020. 8. 8.
JavaScript 다중상속에 대한 고찰 JavaScript는 객체지향에 맞게 구성할 수 있음에도 불구하고 Class기반 언어가 아닌 prototype기반 언어이기에 완벽한 객체지향이 아니라고 부르는 사람도 있다. 그중 하나의 키워드가 다중상속 이다. 다중상속이 무엇인가 A클래스 A를 상속받은 B클래스 B를 상속받은 C클래스 D클래스 D를 상속받은 E클래스 E를 상속받은 F클래스 이때 C클래스와 F클래스 모두를 상속받는 G클래스가 있다면 G클래스는 다중상속을 하고있는 것이다. 하지만 prototype에 대한 이해도가 어느정도 있다면 여러가지 편법을 동원해서 다중상속을 구현할 수 있을것이라고 생각하게 되었다. 이 아래에서 등장하는 여러 명칭은 Python과 JavaScript가 섞여있다. 필자도 이를 착각하고 혼용하는 경우가 많으니 잠시 설명하고.. 2020. 8. 2.
JavaScript - class 다중상속 다중상속이란 일반적인 상속(prototype chain)은 다음과 같이 구성되어있다. A클래스 A를 상속받은 B클래스 B를 상속받은 C클래스 C를 상속받은 D클래스 하지만 간혹 특수한 상속이 필요할 때가 존재한다. A클래스 A를 상속받은 B클래스 B를 상속받은 C클래스 D클래스 D를 상속받은 E클래스 E를 상속받은 F클래스 C클래스와 F클래스를 모두 상속받은 G클래스 JavaScript에서 이러한 유형의 상속은 불가능하다. 타언어였다면...? 타 언어들을 기준으로 다중상속이 가능한 언어들이 있다. 다만 해당 언어들도 모든것이 완벽한것이 아니다. 몇가지 규칙이 있는데 다중상속시 우선순위 되는 class가 있다. 상속받은 class에 없는 메서드 호출시 우선순위가 되는 class의 상속관계 라인에서 먼저 확.. 2020. 7. 29.
OOP - 객체지향 / 상속 객체지향이란 Object Oriented Programming 의 약자로 하나의 페러다임이다. 간단하게... 각각의 객체를 생성하는 것은 클래스이며 생성된 객체를 인스턴스라고 부른다. 인스턴스는 각각의 고유한 속성을 지니는것이 가능하다. 또, 새로운 클래스를 만들 때 이전에 만든 클래스를 상속 받을 수 있다 왜 써야 하나? 객체 지향을 사용하는 이유는 실생활의 무언가를 가장 잘 표현할 수 있기 때문이다. 감이 잡히지 않는다면 class instance 또는 Object Oriented Programming 에 대해서 real-life example 키워드와 함께 검색해 보는것을 권장한다. 예제 금형 - 클래스 빵틀 - 금형 클래스를 상속받는다. 붕어빵 틀 - 빵틀 클래스를 상속받는다. (모양 이라는 속성.. 2020. 7. 29.
2020.07.23 - JavaScript에서 Stack과 Queue의 구현 - 2 (Stack, Queue에 관한 내용은 이 페이지에서 상세하게 설명하지 않는다. 추후 정리하여 JavaScript 카테고리에 업로드 예정.) Queue 구현을 위한 생각 배열 (Array)를 사용하지 않고 구현하자. (pop, unshift, push 등의 메서드 사용시 바로 해결되버린다..) Queue클래스 Stack클래스를 정의하여 front, rear, storage라는 인스턴스 속성을 만들어준다. front는 가장 먼저 들어온 값의 키값(빼낼 때의 키값)을 가르키는 포인터 역할이다. rear는 가장 나중에 들어온 값의 키값(추가 되어야 할 키값)을 가르키는 포인터 역할이다. storage는 빈 오브젝트를 넣어준다. enqueue메서드 Queue에 전달인자를 추가하는 메서드 새로 들어온것은 가장 뒤.. 2020. 7. 24.
2020.07.23 - JavaScript에서 Stack과 Queue의 구현 - 1 Stack과 Queue에 대하여 JavaScript에서 이를 구현해보기로 했다. (Stack, Queue에 관한 내용은 이 페이지에서 상세하게 설명하지 않는다. 추후 정리하여 JavaScript 카테고리에 업로드 예정.) Stack 구현을 위한 생각 배열 (Array)를 사용하지 않고 구현하자. (pop, unshift, push 등의 메서드 사용시 바로 해결되버린다..) Stack클래스 Stack클래스를 정의하여 top, storage라는 인스턴스 속성을 만들어준다. top은 들어올 값의 키값(추가될 때의 키값)을 의미하게 만들고 이는 곧 Stack의 크기가된다. storage는 빈 오브젝트를 넣어준다. push메서드 Stack에 전달인자를 추가하는 메서드 새로 들어온것이 가장 위에 추가된다. 전달인자.. 2020. 7. 24.