🔶 JavaScript

• Image 생성자 함수는 무엇이고, 어떻게 활용할 수 있는가?

: new 연산자와 함께 사용하면 이미지 인스턴스를 생성할 수 있음
: 생성한 인스턴스를 통해 자바스크립트로 HTML의 이미지 요소를 조작할 수 있음
: src 프로퍼티를 설정하면 특정 이미지 경로의 이미지를 가져올 수 있고, 이를 바탕으로 width, height 값을 취득할 수 있음

• image 생성자 함수로 생성한 인스턴스를 바탕으로 width, height 값을 취득할 때 주의할 점은 무엇인가?

: padding, border를 제외한 원본 이미지의 width, height만 취득할 수 있기 때문에 border-box 관점에서 width, height를 취득하려면 getBoundingClientReact 메서드 사용해야 함

• getComputedStyle 메서드를 innerHTML 프로퍼티와 함께 조작하면 안 되는 이유는 무엇인가?

: getComputedStyle 메서드는 비동기 방식으로 처리되기 때문에 그 반환 값이 항상 일정하지 않음, 그러므로 HTML 요소를 동적으로 생성하는 innerHTML과 사용하면 상황에 따라 결과가 달라질 수 있음

• textContent와 innerHTML의 차이는 무엇이고, 각각 언제 사용할 수 있는가?

: 기존의 자식 노드를 전부 삭제하고 새롭게 문자열을 추가한다는 점에서 두 프로퍼티의 로직은 동일
: 다만 textContent는 별도의 파싱 과정 없이 문자열을 추가하고, innerHTML은 문자열로 된 HTML 요소라면 파싱 과정을 거치므로 HTML 요소를 문자열로 추가하는 상황이라면 반드시 innerHTML 메서드를 사용해야 함

• 정규 표현식으로 빈 문자열인지 어떻게 판단할 수 있는가?

: /^$/처럼 사용하면 시작하는 문자열(^)과 끝나는 문자열($) 사이에 아무것도 존재하지 않기 때문에 빈 문자열에 해당

• querySelector를 사용할 때 어떤 상황에서 그 값을 변수에 할당하는 것이 바람직한가?

: 코드 상에 중복되어 존재하는 경우뿐만 아니라, 중복되지 않더라도 querySelector 자체가 여러 번 호출될 가능성이 있다면 변수에 할당하여 한 번만 사용하는 것이 바람직함

• 메서드를 프로퍼티로 가지는 객체를 반환하는 즉시 실행 함수의 경우, 어떤 이점이 있는가?

: 메서드처럼 사용하면 함수 이름이 프로퍼티 키가 되기 때문에 마침표 표기법 외에도 대괄호 표기법을 사용하여 메서드를 호출할 수 있음
: 대괄호 표기법을 사용하면 템플릿 리터럴을 대괄호 안에 사용할 수 있으므로 메서드 이름을 판단하는 로직을 좀 더 유연하게 작성할 수 있음