본문 바로가기
빌드노트 검색

빌드노트

프런트엔드

프런트엔드 카테고리의 글입니다.

글 검색

글 목록

총 48개의 글

  1. undefined로 비운 객체 필드가 JSON 요청에서 사라진다

    undefined를 넣은 객체 속성은 JSON에서 키째 빠진다. 전송 문자열과 hasOwn으로 누락 지점을 확인하고, 명시적 null로 초기화를 요청하려면 서버와 어떤 계약이 필요한지 설명한다.

  2. Promise.all이 실패했는데 나머지 작업은 계속됐다

    Promise.all의 catch는 남은 작업의 취소나 종료를 뜻하지 않는다. 짧은 Node 타이머에서 거절 뒤 완료와 명시 취소를 비교하고, allSettled로 결과를 관찰할지 취소를 요청할지 구분한다.

  3. finally에서 기본값을 반환해도 Promise 실패는 복구되지 않는다

    finally에서 반환한 기본값으로 실패를 복구할 수 없는 이유를 성공·실패 여덟 조건으로 비교한다. 정리 Promise의 대기와 오류 전파를 확인하고, 값 변환은 then, 기본값 복구는 catch에 둘 기준을 설명한다.

  4. 폼의 펼치기 버튼이 저장까지 실행하면 type부터 확인한다

    폼의 펼치기 버튼이 저장까지 실행되면 type 생략에 따른 기본 제출부터 확인한다. 세 버튼의 click·invalid·submit과 submitter를 브라우저로 비교하고, 필수 입력이 증상을 숨기는 조건과 명시적 제출 호출을 구별한다.

  5. 체크박스를 눌렀는데 checked 속성은 그대로다

    클릭 뒤에도 남아 있는 checked 속성으로 현재 선택을 판단하면 틀릴 수 있다. 실제 클릭과 reset을 비교하고, checked로 현재값을 읽는 방법과 defaultChecked로 초기화 기준을 정하는 시점을 설명한다.

  6. fixed 버튼이 화면 대신 부모를 따라 움직인다

    조상에 translateZ(0)을 넣자 fixed 버튼의 화면 좌표가 스크롤을 따라 바뀌었다. 같은 버튼의 실측값으로 위치 기준이 바뀐 이유를 확인하고, transform 제거와 조상 밖으로 옮기는 수정의 선택 조건을 설명한다.

  7. 화면에는 값이 있는데 FormData에는 필드가 없다

    화면에 보이는 값이 FormData에서 빠질 때 name·disabled·체크박스 선택 상태를 확인한다. readonly 텍스트와 select의 차이, loopback echo 본문 대조, hidden 값을 서버에서 검증해야 하는 이유를 실제 브라우저 실험으로 설명한다.

  8. 말줄임표를 넣어도 flex 카드 밖으로 파일명이 밀려나는 이유

    긴 파일명에 말줄임 속성이 있어도 바깥 flex item의 자동 최소 너비가 축소를 막을 수 있다. 같은 카드에서 min-width auto와 0의 실제 폭·넘침·화면을 비교하고, 파일명 요소와 줄어들어야 할 요소를 구분하는 방법을 설명한다.

  9. .card:nth-child(2)가 두 번째 카드 대신 첫 번째 카드를 고르는 이유

    제목과 안내문이 끼어 있는 카드 목록에서 nth-child, nth-of-type, nth-child의 of 문법이 무엇을 세는지 실제 ID와 화면 강조로 비교했다. 클래스별 두 번째 카드를 선택하는 수정과 브라우저 지원 확인 방법을 설명한다.

  10. BigInt가 든 객체를 JSON으로 보내려니 TypeError가 난다

    BigInt가 든 객체의 JSON.stringify 오류를 재현하고, ID만 십진 문자열로 변환해 정확한 값을 보존한다. 명시 필드 구성과 제한된 replacer를 비교하며, 파싱 후 원래 타입은 필드 계약 없이 자동 복원할 수 없음을 확인한다.

  11. Promise.any가 실패했는데 원래 오류 메시지가 보이지 않는다

    Promise.any의 전체 실패 원인은 AggregateError.errors에 남는다. B가 먼저 거절되는 타이머로 입력 순서와 실패 순서를 비교하고, 작업 이름별 원인 처리, 성공값 하나의 소비, 빈 입력의 구분을 설명한다.

  12. splice 반환값을 저장했더니 지운 항목만 남는다

    splice의 반환값은 삭제 목록이고 편집 후 전체 목록은 바뀐 원본에 남는다. 같은 삭제·삽입 입력으로 toSpliced의 새 반환 배열과 비교하고, 지원 확인과 복사 후 splice 대안, 중첩 객체 참조가 공유되는 범위를 실제 실행으로 구분한다.