Thing about programming/Web (15) 썸네일형 리스트형 Fetch: Abort Fetch는 Promise를 리턴합니다. 그런데 Javascirpt에는 Promise에 사실 "Aborting"개념이 따로 없습니다. 그러면 우리는 진행 중인 Fetch를 어떻게 중단/취소 할 수 있을까요? 더는 fetch가 필요없어졌을때처럼요. 이런 목적을 위해 특별한 빌트인 객체가 있습니다. 바로 AbortController입니다. 해당 객체는 fetch뿐만 아니라 비동기적인 모든 작업에 사용할 수도 있습니다. 사용법은 매우 직관적입니다. let controller = new AbortController(); : abort() 라는 메서드 하나만 가지고 있습니다. : signal이라는 프로퍼티 하나만 가지고 있습니다. 이벤트리스너를 등록할 수 있는 것입니다. abort( ) 가 만약 호출되면, : c.. Fetch: Download Progress fetch메서드는 다운로드 진행사항을 추적할 수 있습니다. upload진행사항은 추적 불가능한데, 이건 추후에 배울XMLHttopRequest로 보완 가능합니다. 다운로드 진행사항 추적을 위해 response.body의 프로퍼티를 사용할 수 있습니다. ReadableStream입니다. body를 받을 때, 그것을 청크별로 나눠 받을 수 있는 특별한 객체입니다. Readable-stream자체에 대한 설명은 Streams API에서 읽으면 됩니다. response.text(), response.json()과 다르게 response.body에서는 읽는 과정에서 모든 통제권을 가질 수 있어서 ,어느때건 그것이 얼마나 사용되었는지 확인 가능합니다. //예시 const reader = reponse.body.ge.. [HTML] HTML data-* 속성 / dataset Javascipt https://ko.javascript.info/event-delegation 이벤트 위임 ko.javascript.info 위의 링크에서 이벤트 위임을 공부하며 그다지 친숙하지 않은 속성을 마주하게 되었습니다. 저장하기 // Javascript let action = event.target.dataset.action; 이런 식의 예제였습니다. 부가 설명으로 .action-save 와 같은 클래스를 이용하는 것보다 data-action속성을 사용하는게 의미론적으로 더 좋고 CSS속성도 사용할 수 있는 장점이 있다고 덧붙이셨습니다. 아! 좋아보인다 그러면. 이라는 생각에 더 검색하며 알아보았습니다. 우선 MDN 사이트에 들어가 살펴보았습니다. https://developer.mozilla.org/en-US.. [CSS] textContent vs innerText vs innerHTML 1. textContent https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent Node.textContent - Web APIs | MDN The textContent property of the Node interface represents the text content of the node and its descendants. developer.mozilla.org - textContent 는 node와 node의 자식node들의 textContent를 나타냅니다. - textContent의 값은 string / null 입니다. - textContent의 값이 null인 경우는 그 node가 doctype이나 document일 때 입.. call / apply, 데코레이팅, 포워딩 https://ko.javascript.info/call-apply-decorators call/apply와 데코레이터, 포워딩 ko.javascript.info 해당 개념을 공부하면서 과제를 풀이했는데, 풀 수 없더군요. 이해가 미숙한 느낌이 들어서 확실이 배워서 익히고 정리하고자 이 글을 씁니다. 글의 내용 정리 1. 함수의 변경 없이 wrapper함수로 해당 함수를 감싸 기능 추가하기. 기존 함수를 func이라고 쳤을 때, func을 받아와 새 함수(wrapper)를 리턴합니다. 이 함수는 목적에 따라 기존 func을 그대로 수행하거나 다른 기능을 추가해 수행합니다. 2. wrapper함수로 사용하기 위해 가져온 함수가 어떤 객체의 메서드라면 그냥 받아와서 수행하면 안 됩니다. wrapper함수는 .. 이전 1 2 다음
