목록프론트엔드/자바스크립트 (19)
이재호

프로미스란 내용이 실행은 되었지만 결과를 아직 반환하지 않은 객체 then 을 붙히면 결과를 반환함 resolve(성공리턴값 ) : then으로 연결 reject(실패리턴값) : catch로 연결 finally 는 무조건 실행 const promise = new Promise((resolve, reject)=>{ setTimeOut(()=>{ resolve() }, 1000) }) promise.then(()=>{ console.log('a') }) const codition = true; const promise = new Promise((resolve, reject)=>{ if(codition){ resolve('성공') } else { reject('실패'..
const x = 'x' function c(){ const y = 'y' console.log('c') function b(){ const z = 'z' console.log('b') c() } } function a(){ const x = 'x' console.log('a') b(); } a() c() 스코프체인 : 함수에서 어떤값에 접근이 가능한지를 알아내는것이다. 스코프 체인은 함수의 선언만 보면 됩니다 const x = 'x' function c(){ const y = 'y' console.log('c') function b(){ const z = 'z' console.log('b') c() } } function a() { const x = 'x' console.log('a') b() } //..
function 더하기함수공장(초기값){ function 덧셈(숫자){ return 초기값 + 숫자 } return 덧셈 } let 더하기1 = 더하기함수공장(1) console.log(더하기1(1)) console.log(더하기1(2)) let 더하기2 = 더하기함수공장(2) console.log(더하기2(1)) console.log(더하기2(2))

AJAX 란 비동기 자바스크립트와 XML (Asynchronous JavaScript And XML)을 말합니다. 간단히 말하면, 서버와 통신하기 위해 XMLHttpRequest 객체를 사용하는 것을 말합니다. JSON, XML, HTML 그리고 일반 텍스트 형식 등을 포함한 다양한 포맷을 주고 받을 수 있습니다. XHR AJAX 요청을 생성하는 JavaScript API 입니다. 자바스크립트에서 요청을 보내는 기존방식은 프로미스를 지원하지 않아 수많은 콜백을 받게 되고 설정방식이 복잡해집니다. XHR은 프로미스를 지원하지 않아 then과 catch 같은 메서드를 사용하지 못하는 단점이 있고 문법이 다소 복잡합니다. XMLHttpRequest 생성방법 const req = new XMLHttpReques..

5점을 먼저 내면 이기는 간단한 스코어 게임을 만들어보겠습니다. 0 to 0 1 2 3 4 5 6 7 8 9 10 player 1 player2 reset app.js const disp1 = document.querySelector('#disp1') const disp2 = document.querySelector('#disp2') const p1btn = document.querySelector('#p1btn') const p2btn = document.querySelector('#p2btn') const resetbtn = document.querySelector('#resetBtn') const selbtn = document.querySelector('#selScor') // 카운터 증가 let..

하루지나면 까먹는 성격에 다시한번 복습겸 블로그에 배운내용을 작성해봅니다 index.html 체크리스트 클릭! 리스트 : app.js const form = document.querySelector('form') const ul = document.querySelector('ul') form.addEventListener('submit', ()=>{ const todoInput = form.elements.todo addList(todoInput.value) todoInput = ''; }) // 리스트 추가 함수 const addList(todo) =>{ const NewList = document.createElement('li') const boldtxt = document.createElement..