[TIL] 자바스크립트 객체 지향과 모의 기술 면접😭

샤이니·2023년 4월 14일
0

learned.log

목록 보기
23/46

오늘의 나는 무엇을 (잘)했을까?

  1. 콜스택과 작업큐에 대해 완벽 이해했다! 특히 webAPI에 대해서도 찾아보면서 비동기함수와 동기함수에 대해 이해할 수 있었다. 덕분에 면접때 제법 대답을 잘 한 것 같다.

  2. 거북목이 돼서 그런가 머리가 또 지끈지끈 아팠다😭 하지만 약 먹고 극복 ! 루크가 스트레스 해소법에 대해 물어봤는데, 아직은 딱히 그런 게 없다. 운동을 시작해서 스트레스를 해소 해야겠다! (플라잉 요가 다시 하고싶다)

오늘의 나는 무엇을 배웠을까?

JavaScript 객체지향 기본기

객체지향의 4가지 기둥 추상화, 캡슐화, 다형성, 상속에 대해 공부했다. 특히 Clouser라는 개념에 대해 공부할 수 있었다.

오늘의 나는 어떤 어려움이 있었을까?

멘토 루크와 모의 면접을 봤다. 범위가 정해져있었지만 깊지 않고 애매하게 알고 있다 보니 확신없이 대답한 것이 많았고.. 생각보다 많이 어려웠다. 다음은 면접 회고..😂

1. 브라우저 주소창에 https://www.codeit.kr 을 입력하고 화면에 표시되기 까지 과정을 설명해주세요.

  • 꼬리 질문
    • DNS가 무엇인가요?
    • HTTP와 HTTPS의 차이가 무엇인가요?

2. REST API에 대해 설명해 주세요.

3. HTTP 메소드들에 대해 설명해주세요.

  • 꼬리 질문
    • GET 요청과 POST 요청을 조금 더 자세하게 비교해 설명해 주세요.

GET 메소드에 body를 넣는 경우?

4. Flexbox와 Grid의 차이점을 설명하고, 각각 어떤 경우에 사용하는게 좋다고 생각하나요?

5. 콜백(콜백함수)이 무엇인지 설명해 주세요.

  • 꼬리 질문
    • 배열에 있는 filter, map과 같은 메소드에 있는 콜백과 setTimeout에 있는 콜백의 차이에 대해 설명해 주세요.
    • 동기와 비동기에 대해 설명해 주세요.
    • 브라우저 또는 Node.js 환경에서 비동기 함수의 콜백이 실행되는 원리에 대해 설명해 주세요.

어떠한 조건이 있고 그 조건이 충족되었을 때 실행되는 함수라고 답변했다. 어느 정도는 맞는 말이지만 좁은 의미에서의 Callback을 설명한 것 같다.

Callback 함수란 1. 다른 함수의 인자로써 이용되는 함수. 2. 어떤 이벤트에 의해 호출되어지는 함수이다.

1번의 경우를 생각하지 못했는데 다음과 같은 예시가 있다.

// callback 함수
function meaningOfLife() {
    log("The meaning of life is: 42");
}


// 콜백 메소드를 파라미터로 받는 메소드
function printANumber(int number, function callbackFunction) {
    print("The number you provided is: " + number);
}

// 함수 호출
function event() {
   printANumber(6, meaningOfLife);
}

map 함수는 콜백 함수인가?

정답은 yes! 동기 콜백 함수라고 한다. 하지만 몰라서 답을 못했다. 그리고.. map함수 작성법에서 callback과 return을 빼먹었은 채 답변했음을 알았다...😭 역시 함수를 익히기만 하고 활용하지 않아서 형태가 잘 기억이 나지 않았다.

arr.map(callback(currentValue, index, array), thisArg)
  • map의 callback에서는 배열 내에 현재 처리해야하는 값, 현재 처리해야하는 index, map()을 호출한 배열 array를 파라미터로 가진다.

  • map의 2번째 파라미터로는 callback을 실행할 때 this로 사용되는 값이 들어간다. option이다. 그 외의 경우 undefined값이 this 값으로 사용된다.

map은 메서드를 호출한 배열의 길이 만큼의 새로운 배열을 만들어내는 게 핵심!! 콜백 함수의 return 값을 통해 새로운 배열들의 각 요소를 변형할 수 있다는 특징이 있다.

  • 예시
const numbers = [1, 2, 3];
const twiceNumbers = numbers.map((element, index, array) => {
  return element * 2;
});

console.log(twiceNumbers); // (3) [2, 4, 6]

map함수 callback과 setTimeOut함수 callback의 차이

6. HTTPS 함수의 S의 뜻과 어떤 식으로 보안이 지켜지는가?

내일의 나는 무엇을 해야할까?

  • Week2 리팩토링
  • 웹 컴포넌트에 대해 공부하기

0개의 댓글