SSR과 CSR 차이 SSR의 정의 ServerSide Rendering CSR의 정의 Client Side Rendering SSR과 CSR의 차이 웹페이지를 로딩하는 시간 SEO 대응 서버 자원 사용 사용 권장...

PWA (Progressive Web App) 웹의 장점과 앱의 장점을 결합한 환경입니다. 앱 수준과 같은 사용자 경험을 웹에서 제공하는 것이 목적입니다. 특징 확장성이 좋고, 깊이 있는 앱같은 웹을 만드는 것을 지향합니다. 웹 주소만 있다면 누구나 접근 하여 사용이 가능하고 스마트폰의 저장공간을 잡아 먹지 않습니다. 또 네트워크 환경이...

고차 함수 고차 함수란? Array.Map(callback (element, index, array), thisArg) Array.filter(callback (element, index, array), thisArg) Array.reduce( callback( accumulator, currentValue, index, array ...

ES6에서 기존 함수를 간결하게 표현 할 수 있고 기능이 개선된 화살표 함수가 추가 되었습니다. 화살표 함수는 function 키워드를 사용하지 않고 => 모양의 연산자를 사용해 정의합니다. 매개변수가 하나일 경우 인자를 정의 할 때 괄호()를 생략할 수 있습니다. 매개변수가 없거나 둘 이상일 경우 괄호를 작성해야 합니다. 코드블록...

프로미스 프로미스 예제 2 프로미스 예제 2 function doJob(name, person){ return new Promise(resolve, reject) => { setTimeout(() =>{ if(person.hp > 50){ re...

프로미스 프로미스(Promise) 프로미스(Promise) 생성 프로미스(Promise) 예제 프로미스(Promise) 자바스크립트는 비통기 처리를 위한 하나의 패턴으로 콜백함수를 사용합니다. 콜백 배턴은 콜백 지옥으로 인해 가독성이 나쁘고 비동기 처리 중 발생한 에러의 처리가 곤란하여 여러 개의 비동기 처리를 한번...

자료형 확인하기 type of instance of 정리 자바스크립트에서 자료형을 확인하는 방법은 다양하게 있습니다. 그중에서 많이 사용되는 typeof, instanceof를 어떻게 사용하는지 알아보겠습니다. type of let str = 'javascript' let strObj = new String('JavaScript'...

1. this는 함수가 어떻게 호출되는지에 따라 동적으로 결정됩니다. 2. this의 주요 목적은 작성된 코드를 재사용하기 위해 존재하는데, 호출되는 방식에 따라 동적으로 결정되어 잘못된 로직을 작성할 수 있습니다. 3. this는 전역에서 사용할 수 있으며 함수 안에서도 사용할 수 있습니다. 4. 함수는 객체 안에 메소드로 정의, 생성자 함수로 사...

class Chart { constructor(width, height){ this.width = width; this.height = height; } drawLine(){ console.log('draw line') } } class barChart extends Chart{...

클래스는 별도 타입의 객체를 생성하는 설계 도면이라 볼 수 있습니다. 예를 들어 붕어빵 틀은 붕어빵을 만들기 위한 틀이라고 볼 수 있는데 여기서 붕어빵은 객체이고 붕어빵 틀이 클래스라고 볼 수 있습니다. 클래스를 통해 객체가 가져야 할 상태와 행위들을 속성과 메소드로 정의 할 수 있습니다. 클래스에서 만들어진 객체들을 인스턴스 라고 합니다. cla...