본문 바로가기

Frontend/JavaScript47

Object.defineProperty() 출처 : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty#inheritance_of_properties Object.defineProperty() a static method that defines a new property directly on an object, or modifies an existing property on an object, and returns the object. 객체가 기존에 가지고 있던 프로퍼티를 수정하거나, 새롭게 프로퍼티를 정의할 수 있음. Syntax Object.defineProperty(obj, prop, descriptor) Pa.. 2023. 12. 29.
32. 제너레이터와 async/await 제너레이터 코드 블록의 실행을 일시 중지했다가 필요한 시점에 재개할 수 있는 특수한 함수. 제너레이터 함수는 함수 호출자에게 함수 실행의 제어권을 양도할 수 있다. 일반 함수는 함수 호출자가 함수를 호출한 이후 함수 실행을 제어할 수 없지만 제너레이터 함수는 함수 실행을 함수 호출자가 제어할 수 있다. 함수 호출자가 함수 실행을 일시 중지시키거나 재개시킬 수 있다. 함수의 제어권을 함수 호출자에게 양도 yield 할 수 있다는 의미. 제너레이터 함수는 함수 호출자와 양방향으로 함수의 상태를 주고 받을 수 있다. 제너레이터 함수는 함수 호출자에게 상태를 전달할 수 있고 함수 호출자로부터 상태를 전달받을 수도 있다. 일반 함수를 호출하면 함수 코드를 실행하고 값을 반환하지만 제너레이터 함수를 호출하면 함수 .. 2023. 12. 25.
31. 프로미스 프로미스 자바스크립트는 비동기 처리를 위한 하나의 패턴으로 콜백 함수를 사용한다. 하지만 전통적인 콜백 패턴은 콜백 헬로 인해 가독성이 나쁘고 에러 처리가 곤란하다. 프로미스는 전통적인 콜백 패턴이 가진 단점을 보완하며 비동기 처리 시점을 명확하게 표현할 수 있다는 장점. 콜백 헬 비동기 함수를 호출하면 함수 내부의 비동기로 동작하는 코드가 완료되지 않았다 해도 기다리지 않고 즉시 종료된다. 즉, 비동기 함수 내부의 비동기로 동작하는 코드는 비동기 함수가 종료된 이후에 완료된다. 따라서 비동기 함수 내부의 비동기로 동작하는 코드에서 처리 결과를 외부로 반환하거나 상위 스코프의 변수에 할당하면 기대한 대로 동작하지 않는다. 또한 함수의 반환값은 명시적으로 호출한 다음에 캐치할 수 있는데 이벤트 핸들러는 브.. 2023. 12. 25.
30. REST API REST API REpresentational State Transfer REST는 HTTP를 기반으로 클라이언트가 서버의 리소스에 접근하는 방식을 규정한 아키텍처. REST API는 REST를 기반으로 서비스 API를 구현한 것을 의미한다. REST의 기본 원칙을 성실히 지킨 서비스 디자인을 RESTful 하다고 한다. REST는 자원, 행위, 표현의 3가지로 구성.(각각 URI, HTTP 요청 메서드, 페이로드) REST API 설계 원칙 URI는 리소스를 표현하는 데 집중. 리소스를 식별할 수 있는 이름은 동사보다는 명사 사용. 리소스에 대한 행위는 HTTP요청 메서드로 표현한다. GET : 모든/특정 리소스 취득 POST : 리소스 생성 PUT: 리소스 전체 교체 PATCH : 리소스 일부 수정 .. 2023. 12. 25.
29. 비동기 프로그래밍과 Ajax 비동기 프로그래밍 함수 실행 순서는 실행 컨텍스트 스택으로 관리한다. 함수를 호출하면 함수 코드가 평가되어 함수 실행 컨텍스트가 생성된다. 생성된 함수 실행 컨텍스트는 실행 컨텍스트 스택(콜 스택)에 push, 함수 코드가 실행된다. 함수 코드의 실행이 종료되면 함수 실행 컨텍스트는 실행 컨텍스트 스택에서 pop. 이처럼 자바스크립트 엔진은 한 번에 하나의 태스크만 실행할 수 있는 싱글 스레드 방식으로 동작한다. 자바스크립트 엔진은 단 하나의 실행 컨텍스트 스택을 갖는다.(동시에 2개 이상의 함수를 동시에 실행할 수 없다는 것을 의미) 싱글 스레드 방식은 한 번에 하나의 태스크만 실행할 수 있기 때문에 처리에 시간이 걸리는 태스크를 실행하는 경우 블로킹(작업 중단)이 발생한다. 동기처리의 장점과 단점 장.. 2023. 12. 25.
28. 호출 스케줄링 타이머 호출 스케줄링 함수를 명시적으로 호출하지 않고 일정 시간이 경과된 이후에 호출되도록 함수 호출을 예약하려면 타이머 함수를 사용한다. 이것이 호출 스케줄링하는 것. 자바스크립트는 타이머를 생성할 수 있는 타이머 함수 setTimeout과 setInterval 타이머를 제거할 수 있는 타이머 함수 clearTimeout과 clearInterval 타이머 함수가 생성한 타이머가 만료되면 콜백 함수가 호출된다. setTimeout 함수가 생성한 타이머는 단 한 번 동작하고, setInterval 함수가 생성한 타이머는 반복 동작한다. 자바스크립트 엔진은 단 하나의 실행 컨텍스트 스택을 갖기 때문에 두 가지 이상의 태스크를 동시에 실행할 수 없다. 자바스크립트 엔진은 싱글 스레드로 동작한다. 이런 이유로 .. 2023. 12. 23.