반응형 혼자 공부하는 것들/javascript5 [JS] async와 await javascript로 코드를 짜다보면 비동기는 빠질 수 없는 개념입니다. 만약 비동기로 작성하지않는다면?.... 위에 사진처럼 콜백 지옥에 빠지게 됩니다.. 하하..... 코드의 가독성도 저하되고, 문제점을 바로 찾을 수가 없습니다. 이를 해결하기 위해 async와 await를 사용하는 방법과 개념을 정리해보려고 합니다. 1.async async는 function 키워드 앞에 위치하게 됩니다. async function test() { return 1; } function 앞에 async를 붙이면 해당 함수는 항상 프라미스를 반환합니다. 프라미스가 아닌 값을 반환하더라도 이행 상태의 프라미스(resolved promise)로 값을 감싸 이행된 프라미스가 반환되도록 합니다. async function te.. 2021. 9. 11. [JS] ES6 화살표 함수와 기본 함수의 차이점을 알아보자 ES6문법 중에 화살표 함수 기능이 추가되었습니다. 숫자 두 개를 받아서 더하는 함수를 만들어 설명해보겠습니다. //ES5 let add = function(a,b){ return a+b; } function add(a,b) { return a+b; } //ES6 let add = (a,b) =>{ return a+b; } 기본 함수에 비해 화살표 함수가 조금 더 간결하게 보입니다. 그럼 "기본 함수를 쓰는 것보다 화살표 함수를 쓰는 게 간결하고 보기가 편하니까 모두 화살표 함수를 쓰자"라고 하실 수 있겠지만, 큰 차이점이 있습니다. 바로 this입니다. 화살표 함수는 함수를 선언할 때 this에 바인딩할 객체가 정적으로 결정됩니다. 함수 내부에서 this를 생성하지 않고 this를 사용하면 외부 함수 .. 2021. 8. 30. [mongoDB, JavaScript] 시간복잡도를 줄여보자! join이 안된다고?? 회사에서 기존 서비스 기능들을 기능 개선을 하고 있다. mongoDB를 사용하는데 단점이…. join이 안된다…. ㅠㅠ 예를 들어 a class가 있는데 이 class에서 하나의 필드가 포인터로 b class의 기본키나 다른 키를 가리키고 있다고 하면 mysql이나 다른 곳에는 join기능이 있어 한번 쿼리로 b class의 객체까지 담아서 가져올 수 있지만 mongoDB에서는 그게 안된다… 그렇다면 어떻게 해야 할까? 어쩔 수 없다! 쿼리를 두 번해서 join을 직접 코드로 넣어줘야 한다! 두 번 쿼리 하는 거는 Promise chaining을 해서 비동기로 가져오면 된다.(이 것도 나중에 시간이 되면 정리해야겠다.) ex) aList = [ { _id: "dasdas", name: "name$asld.. 2021. 6. 2. [JS] 구조분해할당 js에서 자주 사용하는 구조분해할당을 정리해보려고한다.!! 구조 분해 할당 구문은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 표현식이다. 말로 설명하는 것보다 코드로 보면서 정리하는게 이해하기 빠르다. sungmin이라는 객체 안에 object의 값들을 다 넣어주고싶다. 그럴때 ...을 사용하면된다. ...은 객체안에있는 값들을 가져와서 넣어주는 기능을 하는 js의 특징이다. 이 방법을 통해 좀 더 쉽게 데이터를 다룰 수 있다. 다른 상황을 보자! caffee라는 객체 안에 음료정보와 가격정보가 들어가있다. 이것을 메뉴판에 넣어보고싶다. 이때 객체 안에 조건을 통해서 값을 넣을지 말지도 구조분해할당으로 해줄 수 있다. caffee라는 객체가 있으면 안에다가 값을 넣어주면된다.. 2021. 5. 1. [JS] promise 비동기처리 프로미스는 비동기 작업의 최종 성공 값 또는 실패 이유와 연결할 수 있다. 이를 통해 비동기 메서드는 동기 메서드와 같은 값을 반환할 수 있다. 즉, 최종 값을 즉시 반환하는 대신 비동기 메서드는 미래의 특정 시점에 값을 제공 하겠다는 약속을반환한다. js에서 비동기를 처리할 때 자주 사용한다. 콜백 지옥에서 유일한 탈출구랄까.... 아무튼 내가 회사에서 사용해보면서 간략하게 이해한 개념들을 정리해보려고 한다. promise는 3가지의 상태로 있다. pending(초기), fulfilled(성공), rejected(실패)로 되어있다. 두 개 이상을 비동기 병렬로 처리하는 방법을 보자.! (한 개 처리하는 건 다른 블로그에도 많으니까!) 한번 코드를 살펴보자. 이러한 코드가 있다고 해보자!!(그냥 방금 대.. 2021. 4. 26. 이전 1 다음 반응형
