코드를 위한 기록

switch문 표현식과 일치하는 case값에 만난다면 그 라인부터 마지막 코드까지 실행 → break를 써줘야함 case 값이 다른데 같은 코드를 실행해줘야 할 경우 break 없이 코드를 붙여주면 됨 case와 일치하지 않는 경우 default 실행(선택) switch (표현식) { case value1: 실행할 코드; break; case value2: 실행할 코드; break; case value3: case value4: 실행할 코드; break; default: 실행할 코드; } * 참고 javascipt.info switch 2023.04.14

box-shadow로 내부 모서리 만들기 box-shadow: 0 0 0 3px #000 inset; /* 가로, 세로, 블러정도, 크기, 색상 */ word-break 단어 기준 줄바꿈 word-break: break-all; /* 모든 문자 분리 */ word-break: keep-all; /* 단어마다 분리 */ overflow-wrap 라인 기준 줄바꿈 overflow-wrap: normal; /* 공백이 있어야 줄바꿈 */ overflow-wrap: break-word; /* 필요 시 언제든 줄바꿈 */ overflow-wrap: anywhere; /* break-word와 비슷한데 지원안되는 브라우저 있음 */ align-self로 요소의 위치 지정하기 align-self: start; /* ..

Optional chaining ?. 참조가 nullish(null 또는 undefined)하면 에러 대신 undefined를 리턴 참조가 누락될 가능성이 있는 경우 사용 * 참조 mdn optional chaining 2023.04.14

추천사 동작하는 코드를 수정하는 과정에서 미묘한 버그가 생길 수 있음 코드를 분석하다가 새롭게 수정할 부분을 발견하면 더 깊이 파고드는 사람이 많은데 그럴수록 수정할 부분이 많아져 헤어나오지 못할 수도 있음 이 책을 읽으며 객체 지향 소프트웨어 개발, 리팩터링 원리, 좋은 리팩터링 습관을 배울 수 있음 언제 어떤 상황에 코드를 분석해서 개선해야하는지, 특히 6장~12장 리팩터링 기법이 모여있음 각 절차를 이해하고 한 번에 한 단계씩 실행할 것 오버라이딩(overriding) : 상속 관계에 있는 부모 클래스에서 이미 정의된 메소드를 자식 클래스에서 같은 시그니쳐를 갖는 메소드로 다시 정의하는 것 오버로딩(overloading) : 한 클래스 내에서 같은 이름의 메소드를 중복하여 정의하는 것 리팩터링 : ..

1. 이미지 컨테이너(div)를 생성하여 정사각형으로 만들어줌 2. 이미지를 컨테이너 내부에 위치시키기 /* html */ /* css */ div { position: relative; width: 100%; /* 가로 100% */ padding-bottom: 100%; /* 패딩으로 세로 100% 만들기 */ background-color: var(--white); /* 기본 배경색 */ } img { position: absolute; max-width: 100%; /* 최대 너비 */ max-height: 100%; /* 최대 길이 */ top: 50%; /* div 기준 세로 중간에 위치 */ left: 50%; /* div 기준 가로 중간에 위치 */ transform: translateY(..