javascript
-
[express, nodejs] res.send() VS res.json() 그리고 res.end()웹 프로그래밍/BackEnd 2021. 9. 16. 15:11
express를 쓰다보면 http요청을 받아 res라는 응답객체를 사용한다. 이 res를 이용해 여러 방식으로 클라이언트에게 응답을 보낸다. 오늘은 여러 방식중에서도 비슷한 세가지 방식(res.send, res.json 그리고 res.end)에 대해 알아보자! res.send() res.send()는 다음과 같이 res.send([body]) body를 인자로 받는다 body에 들어갈 수 있는 타입은 Buffer, String, Object, Array이다. // Buffer 객체 res.send(Buffer.from('fansor')) // 객체 res.send({ some: 'json' }) // String res.send('fansor') 위와 같이 여러 타입의 인자를 넣을 수 있다. res.se..
-
[Javascript] fetch()로 API 요청 보내기웹 프로그래밍/FrontEnd 2021. 9. 14. 16:48
fetch란? 클라이언트에서 직접 API를 호출해주는것 (브라우저에서 직접 비동기 http통신을 하는것을 Ajax라고 불렸었다.) 브라우저에 내장된 함수로 예전에는 requrest,axios,jQuery같은 라이브러리를 사용해 API를 호출했다. 즉, 프론트엔드에서 백엔드에 요청할때 쓰인다! fetch사용법 fetch(url, options) .then((response) => console.log("response:", response)) .catch((error) => console.log("error:", error)); 첫번째 인자로 URL을 두번쨰 인자로 옵션을 객체로 받는다. Promise객체를 리턴하기 때문에 비동기적으로 실행된다. GET요청 fetch("localhost:3000/api/u..
-
이벤트 버블링, 캡쳐, 위임웹 프로그래밍/FrontEnd 2021. 9. 10. 01:47
이벤트 버블링 이벤트가 발생했을때 상위 컴포넌트로 이벤트가 전달되는 특징 div->div->div->body 이런식으로 이벤트가 상위로 전달된다. document.querySelector('parent').addEventListener('click', (e)=>{ console.log(e.target.className); }); document.querySelector('child').addEventListener('click', (e)=>{ console.log(e.target.className); }); child 를 클릭하면 child, parent순서대로 콘솔에 찍힌다. 브라우저에 의해 화면에 이벤트가 발생했을때 최상위요소까지 이벤트를 전파시키기 때문이다. *각 태그마다 이벤트가 등록 되어 있어 ..