js 40

JS 비동기 처리

function doit(){ console.log("start do it"); // 실행 순 2 // 5초 대기 때림 const wakeUpTime=Date.now()+5000; while(Date.now() 해당 웹페이지는 5초간 벽돌. "순서대로" 실행되기 때문. // 순차적으로 실행되는 처리 -> 동기식 처리console.log("end code"); // 실행 순 4  function doit(){ console.log("do it started");}setTimeout(doit, 5000); // JS 내장 명령, 첫 번째 파라미터로 함수, 2번째로 시간(밀리초)을 받음 // 5초 후에 doit 함수를, 현재의 ..

24/11/15 막힌 키워드 - 콜백함수

JS의 콜백함수 Q.JS에서 콜백함수라고 있었는데, 콜백함수가 파라미터로 쓰이기 위한 함수라고 하면 맞아?   A.네, 맞습니다! 콜백 함수는 다른 함수의 파라미터로 전달되는 함수를 의미합니다. 이 함수는 나중에, 즉 호출된 함수의 내부에서 특정 시점에 실행됩니다. 이를 통해 함수 간의 협력과 비동기 작업을 효율적으로 처리할 수 있습니다.콜백 함수의 특징함수로 전달됨: 콜백 함수는 보통 다른 함수에 인자로 전달됩니다.필요한 시점에 호출: 전달된 콜백 함수는 특정 조건이 만족되거나 작업이 완료된 시점에 호출됩니다.함수 정의의 유연성: 콜백 함수는 다른 함수 내부에서 실행 로직을 외부에서 정의할 수 있도록 도와줍니다.간단한 예제function greet(name, callback) { console.l..

JS에서 files 속성

08-11 fileupload의 ajax/upload.html에서Q.const profilePhotoFiles = document.querySelector("#profile-photo").files; 에서, files가 붙여졌기 때문에, 단일 항목에 대해서도 다중항목에 대해서도 동일하게 취급할 수 있는 것인가?upload.html:72 GitHub Copilot사용된 1 참조네, files 속성을 사용하면 단일 파일이든 다중 파일이든 동일하게 처리할 수 있습니다. files는 항상 FileList 객체를 반환하므로, 선택된 파일의 수에 관계없이 같은 방식으로 접근하고 처리할 수 있습니다. 예를 들어:const profilePhotoFiles = document.querySelector("#profile-..

JS의 옵셔널체이닝 복습

(JS에서 옵셔널 체이닝 복습하느라 04-07의 10번 예제를 보는 와중) Q1. const user = {}; 일때, console.log(user && user.address && user.address.city); 이 값이 어째서 undefined가 나오는 것인가? A1. 이 코드를 단계별로 설명하겠습니다: 1. user 객체 선언:const user = {};user는 빈 객체이므로 아무런 속성이 없습니다. 2. 표현식 평가: console.log(user && user.address && user.address.city); 이 표현식을 좌측부터 순서대로 평가하면:user 부분: user는 빈 객체 {}로 truthy 값입니다.user.address 부분: user 객체에는 address 속성이 ..

JS에서 백틱(``) 과 작은따옴표, 그리고 큰따옴표로 문자열을 묶는 차이

Q1.JS에서 주소를 걸 때, `` 와 '' 또는 "" 셋 중 아무거나로 주소 경로를 감쌀 수 있는거야?예를 들어서, 지금은 주석처리 되어있지만, let data = await axiosHelper.get([[@{/api/department}]]/${deptno}); // ''? ``? ""?이 코드에서, get() 안에 ``로 묶든, '' 로 묶든, "" 로 묶든 차이가 없는거 아니야?   A1.JavaScript에서 문자열을 감쌀 때 \``, '', ""` 세 가지를 사용할 수 있지만, 기능상 차이가 있습니다. 1) **백틱(```)**: 템플릿 리터럴로, ${변수} 형태로 변수나 표현식을 문자열 내에 삽입할 수 있습니다. 2) 작은따옴표(')/큰따옴표("): 일반 문자열로, ${...}를 그대로 문..

Object.fromEntries(formData)??

(08-10 AxiosHelper의 코드를 보던 와중) Q1. params: formData && Object.fromEntries(formData) 이 코드에서, Object.fromEntries(fromData)는 무엇을 하는 코드야? A1. Object.fromEntries(formData) 는 formData를 키-값 쌍의 일반 객체로 변환하는 역할을 합니다. FormData 객체는 폼 데이터를 다루기 위한 전용 객체로, 일반적인 객체와 다르게 동작합니다. 하지만 Axios에서 params 옵션은 일반 객체를 필요로 합니다. 따라서 FormData 객체를 그대로 params에 전달할 수 없으므로, Object.fromEntries를 사용하여 FormData를 일반 객체로 변환하는 것입니다. 코드를..