[JavaScript] 짐코딩 - (6) Promise 정적 메서드란? 1. Promise 정적 메서드란?  (1) Promise.resolve()-어떤 비동기 작업을 실행하고, 그 결과를 promise로 다루고 싶을 때 사용하는 정적 메서드./** * 1. Promise.resolve() * 어떤 비동기 작업을 실행하고, 그 결과를 promise로 다루고 싶을 때 사용하는 정적 메서드. */const myPromise = Promise.resolve(100);console.log(myPromise);myPromise .then(value => value / 2) .then(value => value / 10) .then(value => console.log(value)) // 최종..

[JavaScript] 짐코딩 - (5) Promise, Async/Await 1. Async/Await란?Async/Await는 자바스크립트 비동기 처리 패턴 중 하나이다Promise 타입의 Syntatic Sugar(문법적 설탕 / 코드를 더 읽기 쉽게 작성하고, 이해할 수 있게 도와주는 문법적 표현방식)Async/Await를 사용하면 코드를 보다 쉽게 읽을 수 있다. (가독성 good)  2. 시나리오 코드function getUser(userId){ return new Promise((resolve, reject)=>{ setTimeout(() => { try{ // 만약 userId가 1이라면 "kim"을 반환, 아니라면 null을..

[JavaScript] 짐코딩 - (4) Promise 체이닝이란? 1. Promise 체이닝이란?-> Promise 체이닝은 promise 객체로 메서드 체이닝을 하는 것-> 체이닝(Chaining)은 연속적으로 함수를 호출하는 것!-> 콜백 지옥을 해결할 수 있는 방법!  2. 시나리오 코드fetch('https://jsonplaceholder.typicode.com/todos?_limit=5') .then(response=>{ return response.json() }) .then(data=>{ console.log('data: ',data) return data.filter(obj=>obj.id>3) // id가 3 이상인 결과만..

[JavaScript] 짐코딩 - (3) Promise 타입이란? 1. Promise 타입이란?(1) Promise: 비동기 작업을 처리하는 데 사용되는 객체이다. (=약속)(2) 객체이기 때문에 생성자와 new 키워드를 사용할 수 있다.(3) 어떤 작업을 처리하고, 결과를 알려주는 역할 대기(pending) : 비동기 작업이 끝날 때까지 대기하는 상태이행(fulfilled) : 비동기 작업이 끝나면 약속을 이행하는 상태거부(rejected) : 약속이 잘 지켜지지 않아 거부된 상태 *아래의 코드는 hello를 입력할 시 '노트북'을 출력하고, 아닐 시에는 에러 메세지를 출력하는 함수이다.const myPromise = new Promise(()=>{ // 비동기 작업 처리! setTimeou..

[JavaScript] 짐코딩 - (2) 콜백 함수란? 1. 콜백 함수란?-콜백 함수(Callback Function)은 다른 함수의 인자로 넘겨지고, 해당 함수가 처리된 뒤 호출되는 함수를 말한다.// 콜백 함수란?// 다른 함수의 인자로 넘겨지고, 해당 함수가 처리된 뒤 호출되는 함수!function taskSyncFunction(callback){ console.log('첫 번째 작업'); console.log('두 번째 작업');}taskSyncFunction(()=>{ console.log('콜백 함수 실행');});// 이 경우, '콜백 함수 실행'이 가장 마지막에 실행된다. 콜백 함수는 내부적으로 동기적/비동기적 프로그래밍의 여부에 따라 동기적으로도, 비동기적으로도 실행이 된..

[JavaScript] 짐코딩 - (1) 동기와 비동기는 뭘까? -공부를 할 때에는 내 나름의 방식으로 정의를 하는 것이 중요하다. (1) 동기(Synchronous): 답변(결과)을 기다리는 것(2) 비동기(Asynchronous): 답변(결과)을 기다리지 않는 것 만약 수박을 트럭에 싣는 일을 한다고 생각해보자.동기식이라면, 수박을 트럭에 싣고, 상대방이 잘 확인했는지를 확인할 때까지 가만히 있는것. // 기다리는 동안에는 일을 하지 않는다.비동기식이라면, 수박을 트럭에 싣고, 상대방의 상태를 확인하지 않고 계속해서 일하는 것비동기식은 답변을 기다리지 않고, 바로바로 실행하기 때문에 효율이 좋다. 하지만 답변을 확인할 수 없다. 동기비동기장점업무가 단순하다자원을 효율적으로 사용단점자원을 비효율적으로 ..

[JavaScript] 31. JavaScript를 사용한 게시글 상세보기 기능 만들기(2)1.board-detail.html 게시판 로그인 회원가입 상세 보기 by JS 제목 ..

[JavaScript] 30. JavaScript를 사용한 게시글 상세보기 기능 만들기(1) 1. boardList.js// 샘플 데이터 입력const sampleBoardList = [ { id: 1, title: "첫번째 게시글", content: "첫번째 게시글에 내용 입니다.", username: "홍길동", today: "2024.08.25", count: 5, }, { id: 2, title: "두번째 게시글", content: "두번째 게시글에 내용 입니다.", username: "이몽룡", today: "2024.08.25", count: 5, }, { ..

[JavaScript] 29. JavaScript를 사용한 글쓰기 기능 만들기   1. boardList.js// 샘플 데이터 입력const sampleBoardList = [ { id: 1, title: "첫번째 게시글", content: "첫번째 게시글에 내용 입니다.", username: "홍길동", today: "2024.08.25", count: 5, }, { id: 2, title: "두번째 게시글", content: "두번째 게시글에 내용 입니다.", username: "이몽룡", today: "2024.08.25", count: 5, }, { id:..

[JavaScript] 28. JavaScript를 사용한 목록 페이지 만들기(3)  1. board-list.html 게시판 로그인 회원가입 게시글 상세보기 by JS 번호 제목 작성자 작성일 조회수 ◀ 1 ..