하루 하나씩 작성하는 TIL #62
17. 자바스크립트의 기본 문법인 변수, 상수, 데이터 타입, 연산자, 함수 등을 이해하고 적용할 수 있습니다.
🎀 의도:
- 지원자가 자바스크립트의 기본적인 문법과 개념을 이해하고 있는지 확인하기 위함.
- 지원자가 변수 선언 및 할당, 데이터 타입 식별, 다양한 연산자 사용, 함수 작성 및 호출에 대해 얼마나 잘 알고 있는지 평가.
🎀 팁:
- 변수 선언 시 var, let, const의 차이를 명확히 설명하세요.
- 자바스크립트의 기본 데이터 타입(숫자, 문자열, 불리언, null, undefined, 객체)에 대해 언급하세요.
- 기본적인 산술, 논리, 비교, 삼항 연산자를 사용하는 예제를 준비하세요.
- 함수 선언 방식(함수 선언식, 함수 표현식, 화살표 함수)에 대해 설명하세요.
🎀 한 줄 요약 및 모범 답안:
- 변수 선언: let과 const는 블록 스코프를 가지며, var는 함수 스코프를 가집니다. const는 재할당이 불가능합니다.
- 데이터 타입: 자바스크립트에는 숫자, 문자열, 불리언, null, undefined, 객체 타입이 있습니다.
- 산술, 논리, 비교, 삼항 연산자의 사용법을 잘 이해하고 있습니다.
- 함수 선언 방식으로는 함수 선언식, 함수 표현식, 화살표 함수가 있습니다.
18. 변수 선언과 할당, 산술, 논리, 비교, 삼항 연산자 등 자바스크립트에서의 표현식을 작성할 수 있습니다.
🎀의도: 지원자가 변수 선언과 할당, 다양한 연산자를 활용하여 자바스크립트 표현식을 작성할 수 있는지 평가.
🎀팁:
- 여러 종류의 변수 선언 방식을 설명하고, 다양한 연산자 사용 예제를 떠올려보세요.
- 연산자 우선순위에 대해 간단히 언급하면 좋습니다.
🎀 한 줄 요약 및 모범 답안:
- 변수 선언과 할당은 var, let, const를 사용합니다.
- 산술 연산자: +, -, *, /, %
- 논리 연산자: &&, ||, !
- 비교 연산자: ==, ===, !=, !==, >, <, >=, <=
- 삼항 연산자: 조건 ? 값1 : 값2
19. 조건문과 반복문을 이해하고 적용할 수 있습니다.
🎀의도: 지원자가 조건문(if, switch)과 반복문(for, while, do-while)을 이해하고 사용할 수 있는지 확인.
🎀 팁:
- 다양한 조건문과 반복문의 사용 예제를 준비하세요.
- 각 조건문과 반복문이 언제 적합한지 설명하세요.
🎀 한 줄 요약 및 모범 답안:
- 조건문은 if, else if, else 및 switch 문이 있습니다.
- 반복문은 for, while, do-while 문이 있습니다.
- 조건문과 반복문을 사용하여 다양한 상황에서 논리적인 흐름을 제어할 수 있습니다.
20. 배열과 객체의 기본 개념을 이해하고 활용할 수 있습니다.
🎀 의도: 지원자가 배열과 객체의 기본적인 구조와 메서드를 이해하고 있는지 평가.
🎀 팁:
- 배열과 객체의 선언 및 기본 메서드 사용 예제를 떠올려보세요.
- 배열과 객체의 차이점을 명확히 설명하세요.
🎀 한 줄 요약 및 모범 답안:
- 배열은 순서가 있는 데이터의 집합이며, 객체는 키-값 쌍으로 이루어진 데이터 구조입니다.
- 배열의 기본 메서드: push, pop, shift, unshift, map, filter, reduce
- 객체의 기본 메서드: Object.keys, Object.values, Object.entries, hasOwnProperty
21. 자바스크립트 ES6 문법에서 새로 추가된 문법에 대해 학습합니다.
🎀의도: 지원자가 ES6의 주요 기능과 그 활용 방법에 대해 알고 있는지 평가.
🎀팁: let, const, 화살표 함수, 템플릿 리터럴, 디스트럭처링, 기본 파라미터, 스프레드 연산자 등에 대해 설명하세요.
🎀 한 줄 요약 및 모범 답안:
-
ES6에서 추가된 주요 문법으로는 let, const, 화살표 함수, 템플릿 리터럴, 디스트럭처링, 기본 파라미터, 스프레드 연산자가 있습니다.
-
이러한 문법은 코드의 가독성과 유지보수성을 향상시키는 데 도움을 줍니다.
22. 일급 객체로서의 함수가 어떤 의미인지, 왜 중요한지 알며 활용 능력을 키웁니다.
🎀 의도: 지원자가 자바스크립트 함수가 일급 객체임을 이해하고, 이를 활용할 수 있는지 평가.
🎀 팁:
- 함수가 일급 객체로서 가질 수 있는 특성(변수에 할당, 다른 함수의 인수로 전달, 함수에서 반환)을 설명하세요.
- 일급 객체로서의 함수를 활용하는 예제를 떠올려보세요.
🎀 한 줄 요약 및 모범 답안:
- 함수는 일급 객체로, 변수에 할당될 수 있고, 다른 함수의 인수로 전달되며, 함수에서 반환될 수 있습니다.
- 이러한 특성 덕분에 고차 함수, 콜백 함수, 함수형 프로그래밍 등의 기법을 사용할 수 있습니다.
23. Map과 Set에 대한 개념에 대해 학습하고, 각각에 대한 활용 능력을 갖출 수 있습니다.
🎀 의도: 지원자가 ES6에서 도입된 Map과 Set의 개념과 그 활용법을 이해하고 있는지 평가.
🎀팁:
- Map과 Set의 기본 사용법과 그 장점에 대해 설명하세요.
- 주요 메서드(add, delete, has, clear 등)에 대한 예제를 떠올려보세요.
🎀 한 줄 요약 및 모범 답안:
- Map은 키-값 쌍을 저장하며, 키의 순서를 유지합니다.
- Set은 유일한 값들의 집합을 저장합니다.
- Map과 Set은 데이터의 빠른 조회와 유일한 값 저장에 유용합니다.
24. 변수가 메모리에 할당되는 과정과 메모리에 대한 기본 지식을 습득합니다.
🎀의도: 지원자가 변수 선언과 할당이 메모리에서 어떻게 이루어지는지 이해하고 있는지 평가.
🎀 팁:
- 변수 선언 시 메모리 할당 과정을 간단히 설명하세요.
- 스택과 힙 메모리에 대한 기본 개념을 이해하고 있는지 설명하세요.
🎀 한 줄 요약 및 모범 답안:
- 자바스크립트에서 변수는 선언될 때 메모리에 할당됩니다.
- 기본 데이터 타입은 스택 메모리에 저장되고, 참조 타입은 힙 메모리에 저장됩니다.
25. 실행 컨텍스트와 구성 요소인 VariableEnvironment와 LexicalEnvironment의 역할과 차이점, 스코프 체인과 this에 대해 이해합니다.
🎀의도: 지원자가 자바스크립트의 실행 컨텍스트와 그 구성 요소를 이해하고 있는지 평가.
🎀 팁:
- 실행 컨텍스트의 생성 과정과 VariableEnvironment, LexicalEnvironment의 역할을 설명하세요.
- 스코프 체인과 this의 동작 원리에 대해 간단히 설명하세요.
🎀 한 줄 요약 및 모범 답안:
- 실행 컨텍스트는 자바스크립트 코드가 실행될 환경을 제공합니다.
- VariableEnvironment는 변수 선언과 초기화에 사용되며, LexicalEnvironment는 변수 및 함수의 스코프를 나타냅니다.
- 스코프 체인은 중첩된 함수 스코프에서 변수를 찾을 때 사용되며, this는 실행 컨텍스트에 따라 달라집니다.
26. 자바스크립트의 콜백함수의 개념과 예시에 대해 학습해요.
🎀의도: 지원자가 콜백 함수의 개념을 이해하고 이를 활용할 수 있는지 평가.
🎀팁:
- 콜백 함수가 무엇인지, 언제 사용하는지 설명하세요.
- 콜백 함수를 사용하는 간단한 예제를 떠올려보세요.
🎀 한 줄 요약 및 모범 답안:
- 콜백 함수는 다른 함수의 인수로 전달되어 실행되는 함수입니다.
- 비동기 작업(예: 타이머, 이벤트 처리, AJAX 요청)에서 주로 사용됩니다.
27. 어떤 항목에서 콜백함수를 전달받은 함수에게 제어권이 이양되는지를 이해하고 그 예시를 테스트해볼 수 있습니다.
🎀의도: 지원자가 콜백 함수의 제어권 이양 과정을 이해하고 있는지 평가.
🎀 팁:
- 콜백 함수를 사용하는 대표적인 상황(이벤트 핸들링, 타이머, AJAX 요청 등)에 대해 설명하세요.
- 콜백 함수를 사용하는 예제를 떠올려보세요.
🎀 한 줄 요약 및 모범 답안:
콜백 함수는 비동기 작업에서 주로 사용되며, 작업이 완료되거나 특정 이벤트가 발생했을 때 호출됩니다.
28. 비동기적인 코드 작성에서 발생할 수 있는 콜백지옥을 예방하고 비동기제어를 할 수 있는 Promise, async/await 등의 기술을 이해하고 활용하는 능력을 배양합니다.
🎀 의도: 지원자가 콜백 지옥을 예방하고 비동기 코드를 제어하기 위한 Promise와 async/await를 이해하고 있는지 평가.
🎀 팁:
- 콜백 지옥의 문제점을 설명하고, 이를 해결하는 Promise와 async/await의 사용법을 설명하세요.
- Promise와 async/await를 사용하는 예제를 떠올려보세요.
🎀 한 줄 요약 및 모범 답안:
-
콜백 지옥은 중첩된 콜백 함수들로 인해 코드의 가독성과 유지보수성이 떨어지는 문제를 말합니다.
-
Promise는 비동기 작업의 결과를 처리할 수 있는 객체이며, async/await는 비동기 코드를 동기 코드처럼 작성할 수 있게 해줍니다.
29. DOM의 기본 개념을 익히고, 접근 및 제어하는 방법을 통해 DOM을 이해합니다.
🎀의도: 지원자가 DOM(Document Object Model)의 기본 개념을 이해하고, 이를 조작할 수 있는지 평가.
🎀 팁:
- DOM의 개념과 중요성을 설명하고, DOM에 접근하고 조작하는 기본적인 방법을 설명하세요.
- DOM 조작의 예제를 떠올려보세요.
🎀 한 줄 요약 및 모범 답안:
- DOM은 웹 페이지의 구조화된 표현이며, 프로그래밍 언어가 DOM을 통해 문서의 내용과 구조를 변경할 수 있습니다.
- DOM 요소를 선택, 수정, 추가 및 삭제할 수 있습니다.
30. Class 문법의 주요 개념(클래스, 인스턴스, getter, setter, 상속, static method 등)을 이해하고 활용할 수 있습니다.
🎀 의도: 지원자가 ES6에서 도입된 클래스 문법을 이해하고, 이를 활용할 수 있는지 평가.
🎀 팁:
- 클래스 선언, 인스턴스 생성, getter와 setter, 상속, static 메서드의 개념을 설명하세요. - 클래스 문법을 사용하는 예제를 떠올려보세요.
🎀 한 줄 요약 및 모범 답안:
- 클래스는 객체를 생성하기 위한 템플릿입니다.
- 인스턴스는 클래스로부터 생성된 객체입니다.
- getter와 setter는 객체의 속성을 읽고 쓸 때 사용됩니다.
- 상속은 클래스가 다른 클래스로부터 속성과 메서드를 상속받는 것을 의미합니다.
- static 메서드는 클래스의 인스턴스가 아닌 클래스 자체에서 호출됩니다.
31. 클로저의 주 개념을 통해 활용하는 능력을 배양합니다.
🎀 의도: 지원자가 클로저의 개념을 이해하고, 이를 활용할 수 있는지 평가.
🎀 팁:
- 클로저의 개념과 이를 활용하는 이유를 설명하세요.
- 클로저를 사용하는 예제를 떠올려보세요.
🎀 한 줄 요약 및 모범 답안:
- 클로저는 함수가 선언될 당시의 스코프를 기억하여, 선언된 이후에도 접근할 수 있는 함수입니다.
- 데이터 은닉과 함수 팩토리에 사용됩니다.
32. 얕은 복사와 깊은 복사의 차이에 대해 설명할 수 있습니다.
🎀 의도: 지원자가 얕은 복사와 깊은 복사의 개념을 이해하고, 그 차이점을 설명할 수 있는지 평가.
🎀팁:
- 얕은 복사와 깊은 복사의 정의와 그 차이점을 설명하세요.
- 각각의 복사 방법을 사용하는 예제를 떠올려보세요.
🎀 한 줄 요약 및 모범 답안:
- 얕은 복사는 객체의 1차원 속성만 복사하며, 중첩된 객체는 참조를 공유합니다.
- 깊은 복사는 중첩된 객체까지 모두 복사합니다.
33. 코드를 작성할 때 불변성이 중요한 이유를 설명할 수 있습니다.
🎀 의도: 지원자가 불변성의 중요성을 이해하고, 이를 코드 작성에 적용할 수 있는지 평가.
🎀 팁:
- 불변성의 개념과 코드 작성에서의 중요성을 설명하세요.
- 불변성을 유지하는 방법을 설명하세요.
🎀 한 줄 요약 및 모범 답안:
- 불변성은 객체의 상태가 변경되지 않도록 하는 개념으로, 상태 관리와 디버깅을 용이하게 합니다.
- 불변성을 유지하면 데이터의 변경이 예측 가능하고, 사이드 이펙트를 줄일 수 있습니다.
34. 호이스팅에 대해 설명할 수 있습니다.
🎀 의도: 지원자가 자바스크립트의 호이스팅 개념을 이해하고, 이를 설명할 수 있는지 평가.
🎀팁:
- 호이스팅의 개념과 변수 및 함수 선언이 어떻게 처리되는지 설명하세요.
- 호이스팅의 동작 예제를 떠올려보세요.
🎀 한 줄 요약 및 모범 답안:
- 호이스팅은 변수와 함수 선언이 스코프의 최상단으로 끌어올려지는 동작을 말합니다.
- var 변수와 함수 선언은 호이스팅되지만, let과 const 변수는 선언되었지만 초기화되지 않은 상태로 호이스팅됩니다.
35.이벤트 위임에 대해 설명할 수 있습니다.
🎀 의도: 지원자가 이벤트 위임의 개념을 이해하고, 이를 활용할 수 있는지 평가.
🎀 팁:
- 이벤트 위임의 개념과 이를 사용하는 이유를 설명하세요.
- 이벤트 위임을 사용하는 예제를 떠올려보세요.
🎀 한 줄 요약 및 모범 답안:
- 이벤트 위임은 이벤트 리스너를 자식 요소가 아닌 부모 요소에 설정하여 자식 요소의 이벤트를 처리하는 방법입니다.
- 이는 메모리 사용을 줄이고, 동적으로 추가된 요소에서도 이벤트를 처리할 수 있게 합니다.
36. CORS 정책에 대해 설명할 수 있습니다.
🎀 의도: 지원자가 CORS(Cross-Origin Resource Sharing) 정책의 개념을 이해하고, 이를 설명할 수 있는지 평가.
🎀 팁:
- CORS 정책의 개념과 필요성을 설명하세요.
- CORS 정책을 우회하거나 설정하는 방법을 설명하세요.
🎀 한 줄 요약 및 모범 답안:
- CORS는 브라우저에서 다른 출처의 리소스에 접근할 때 보안상의 이유로 적용되는 정책입니다.
- 서버는 Access-Control-Allow-Origin 헤더를 통해 특정 도메인 또는 모든 도메인에서의 접근을 허용할 수 있습니다.
