밍쥬디🐰.log

오늘의 단어는 '동기'와 '비동기' 이다. 먼저 동기와 비동기를 나누는 관점부터 소하자면, 이 둘을 나누는 가장 큰 차이점은 "실행 순서를 어떻게 가지는가?" 이다. 동기(synchronous) : 동기는 데이터의 요청과 결과가 한 자리에서 동시에 일어난다. 즉, 해당 작업이 끝나기 전까지는 다른 작업을 수행하지 않고, 해당 작업이 완료된 후에 결과가 반환된다. 비동기(Asynchronous) 데이터의 요청과 결과가 동시에 일어나지 않고, 작업이 실행되고 완료되는 동안 다른 작업을 수행할 수 있다. 즉즉, 해당 작업이 끝나지 않았더라도 다른 작업을 수행할 수 있고, 결과는 작업이 완료될 때 반환된다. 동기와 비동기의 장단점 비교 동기 장점 : 설계가 쉽고 직관적 단점 : 결과가 반환될 때까지 다른 작업 ..

오늘은 월요일이니 특별히 용어 세 개 ! 사실 세 단어로 보이지만 script async 와 script defer 을 비교하기 위해 넣은 것 ..! 🤭 오늘은 이 두 개의 단어를 장단점을 기반으로 비교하는 흐름으로 작성해 보러 한다. 1. 2. + defer 먼저 defer 속성도 브라우저는 스크립트를 백그라운드에서 다운로드한다는 점에서 async속성과 공통점이라고 볼 수 있다. defer 속성도 html 파싱과 동시에 스크립트를 다운로드 한다. 그러나 defer는 async와는 달리 다운로드된 js 파일은 DOM(페이지) 생성이 완료된 직후에 실행된다.(=DOMContentLoaded 직후) 그래서 defer 속성은 DOM을 조작해야 하거나, HTML이 모두 파싱된 후 실행되어야 하는 코드이거나, H..

오늘의 단어는 js와 jsx이다. 사실 jsx를 소개하기 위해 js도 오늘의 단어에 추가했다. React를 본격적으로 공부하면서 Javascript 파일을 생성할 때, 확장자가 .js 인 경우도 있고, .jsx 인 경우도 있었다. 처음에는 큰 차이가 없어 보여서 보편적인 .js를 사용하여 코딩했었는데, 각 기능에 대해 알아야 필요시 제대로 활용할 수 있을 것 같아 정리해두었다. 💭요약! : JS는 표준 자바스크립트를 뜻하고, JSX는 사용자가 리액트를 사용해 좀 더 직관적으로 컴포넌트를 만들 수 있는 HTML식 문법이다. 👩🏻‍💻 JSX란? - Javascript XML의 약어 - 쉽게말해 jsx는 JavaScript 확장 문법 - js보다 jsx를 쓰는 이유는 보통 자바스크립트 내에 HTML을 사용할 ..