Multi Developer SuHo

안녕하세요~  이번에는 replace( ) 와 map ( ), split( ) 메서드에 알아보고 각각 메서드가 무슨 역할을 하는지 살펴보겠습니다.  그럼 간단한 목차보면서 오늘의 할일을 살펴보시죠  📒 목차1. replace( ) 메서드1-1. replace( ) 메서드란?1-2. replace( ) 메서드 문법1-3. replace( ) 사용한 예시 코드2. map( ) 메서드2-1. map( ) 메서드란?2-2. map( ) 메서드 문법2-3. map( ) 사용한  예시 코드3. split( ) 메서드3-1. split( ) 메서드란?3-2. split( ) 메서드 문법3-3. split( ) 사용한 예시 코드🧑‍💻 서론 이번에 알아볼 내용중 replace( ) , map( ), split( )..

안녕하세요~ 오늘은 자바스크립트로 페이지네이션(PageNation)을 구현해보겠습니다.  📑목차1. 페이지네이션(PageNation)1-1. 페이지네이션이란?1-2. 페이지네이션 구조 1-3. 페이지네이션 실습 코드 서론 본론으로 들어가기 앞서 혹시 페이지네이션이라고 들어보신 적 있으신가요? 아니면 페이지네이션 화면을 보셨던 적이 있으실까요? "페이지네이션" 키워드만 들었을 때는 와닿지 않을 수 있습니다. 그럼 웹 사이트 마다 이런 화면을 보신적 있으신가요? 이 화면은 저의 티스토리에서 캡쳐한 화면입니다. 이런 화면으로 다음 페이지에 대한 내용이 나타나도록 나눠서 구현한 것이 페이지네이션(PageNation)입니다. 그럼 이러한 기능을 구현하기 위해 본론으로 넘어가볼까요?  본론1-2. 페이지네이션 구..

안녕하세요  오늘은 비동기 작업에서 발생한 콜백지옥과 콜백지옥을 해결할 Async Await 에 대해 알아보겠습니다.  목차1. 콜백지옥1-1. 콜백지옥이란?1-2. 콜백지옥 예시 코드1-3. 콜백지옥 해결방법1-4. ES8 에서 추가된  Async Await  문법을 사용한 콜백지옥 해결 코드 서론먼저 "콜백지옥" 이라는 단어를 들었을 때 어떤 생각이 떠오르시나요?  "지옥" 이라고 붙으면 뭔가 불길하고 부정적으로 느껴지시죠?  프로그래밍에서도 "콜백지옥" 도 마찬가지로 코드의 구조가 그렇게 썩 좋지 않다고 생각하시면 됩니다. 그럼 본론으로 넘어가시죠본론1. 콜백지옥 1-1. 콜백지옥이란? 비동기 작업을 처리할 때 발생하는 문제로, 콜백 함수가 너무 많이 중첩되어 코드의 가독성이 떨어지고 유지보수가 어..

안녕하세요 이번엔 자바스크립트에서 1급 객체에 대한 개념과 종류들을 간단하게 알아보는 시간을 가져보겠습니다. 목차1. 1급 객체1-1. 1급 객체란?1-2. 1급 객체의 조건 내용1-3. 1급 객체의 종류서론먼저 1급 객체가 무엇이고, 1급 객체의 조건 내용과 1급 객체의 종류들을 살펴보겠습니다. "1급 객체"라고 하면 뭔가 급이 나누는 것 같게 느끼시나요?  그럼 1급 객체에 대해 알아봅시다~ 본론 1. 1급 객체 1-1. 1급 객체란? 변수에 할당할 수 있고, 함수의 인자로 전달되거나 반환될 수 있는 객체, 즉, 프로그래밍에서 1급 객체는 값처럼 사용할 수 있는 제한이 없는 객체를 뜻한다. 1-2. 1급 객체의 조건 내용 3가지 다른 함수의 매개변수로 전달해서 사용할 수 있다. 다른 함수의 retur..

안녕하세요~  Promise 객체 문법이 끝나고 클로저(Closure)가 무엇이고, 클로저의 특징과 문법들을 예시 코드들을 보면서 살펴보겠습니다.  목차1. 클로저1-1. 클로저란?1-2. 클로저의 특징1-3. 클로저의 문법 코드1-4. 클로저의 목적1-5. 클로저 함수와 클로저 함수가 아닌 코드 서론오늘은 자바스크립트에서 클로저(Closure)가 무엇이고, 클로저의 특징과 문법들을 간략하게 알아보겠습니다. "클로저" 라는 단어를 들어보신적 있으신가요? 대부분 처음듣거나 비동기 학습이 끝나기 전에는 들어보신적이 없으실 겁니다.  그럼 본론으로 짚어가면서 클로저(Closure)에 대한 내용을 학습해보도록 하겠습니다.   본론 1. 클로저 1-1. 클로저란?함수가 선언될때의 어휘적 위치를 기억하고 해당 변수..

안녕하세요~  오늘은 Promise에 대해 알아보고 Promise 객체에 대한 상태와 Promise 를 사용한 코드를 살펴보겠습니다.목차1.  Promise(프로미스)1-1. Promise(프로미스) 란? 1-2. Promise(프로미스) 를 왜 사용할까?1-3. Promise(프로미스) 객체 상태 3가지1-4. Promise Chaininig (프로미스 체이닝) 이란?1-5. Promise Chaininig (프로미스 체이닝) 사용 코드1-6. Promise 사용한 코드  서론먼저 Promise를 알기 전에 비동기 처리에 대한 학습이 필요합니다.  비동기 처리에 대한 이해가 충분히 되었다면 Promise에 대한 내용을 학습할 준비가 되어 있습니다.  본론1.  Promise(프로미스) 1-1. Prom..