님 응시 결과

• 제출점수 0 / 100점
• 제출시간

답안 해설

• 1. 스코프 체인을 파악하려면 무엇을 봐야할까요?

  • 1) 호출
  • 2) 선언
  • 3) 백그라운드
  • 4) 테스크큐

  • 답 :
  • 나의 선택 :

  해설 :스코프 체인을 파악하려면 선언만 봐야한다. 호출부는 아무런 영향이 없다.
  그리고 한번 코딩해 놓으면 스코프는 바뀌지 않는데 이를 어휘적 범위라고 하며 렉시컬 스코프라고 한다.

• 2. 다음 코드의 스코프 체인을 파악한 내용 중 옳지 않은 것은 무엇일까요?

  const x = 'x1';
  function c() {
    const y = 'y';
    console.log('c');
    function b() {
      const z = 'z';
      console.log('b');
      c();
    }
  }
  
  function a() {
    const x = 'x2';
    console.log('a');
    console.log(x);
  }
  
  a();
  c();

  • 1) c → anonymous
  • 2) a → anonymous
  • 3) c → b → anonymous
  • 4) b → c → anonymous

  • 답 :
  • 나의 선택 :

  해설 :스코프 체인을 파악하려면 선언만 봐야한다. 호출부는 아무런 영향이 없다.
  코드는 위에서 아래로, 왼쪽에서 오른쪽으로 실행되며 호출 스택은 디버거를 통해서 콘솔탭에서도 확인할 수 있다.
  파일 자체를 anonymous 함수가 호출되었다고 생각하면 분석하기 편하다

• 3. 다음 코드의 선언 지도를 그릴 때 가장 상단으로 올라가야하는 부분은 무엇일까요?

  const x = true;
  const y = false;
  
  function a() {
    let a = 4;
    y = true;
    if (x) {
      let a = 3;
      for (let i = 0; i < a; i++) {
        console.log(i);
      }
      if (!y) {
        kkk();
      }
    }
  }
  
  a();
  const z = (a, b) => { return a + b };
  z(3, 5);

  • 1) const x = true;
  • 2) const y = false;
  • 3) function a(){}
  • 4) const z = () => {}

  • 답 :
  • 나의 선택 :

  해설 :anonymous 에서 선언을 파악할 때 자기 스코프에서 호이스팅이 되는 부분이 있는지 먼저 살펴보아야 한다.
  a함수는 호이스팅 되기 때문에 선언 지도를 그릴 때 상단으로 올라가야한다.

• 4. 다음 자료 구조와 호출 스택, 스코프 체인 설명 중에 옳은 것은 무엇일까요?

  • 1) 큐는 밑에서 부터 하나씩 쌓이고, 위에서 부터 하나씩 빠져나간다. LIFO(Last In First Out), FILO(First In Last Out)
  • 2) 스택은 먼저 들어온 것이 먼저 나간다. FIFO(First In First Out)
  • 3) 호출 스택은 디버거를 통해서 콘솔탭에서 확인할 수 없다.
  • 4) 스코프 체인을 통해서 함수에서 어떤 값에 접근이 가능하고 불가능한지를 판단할 수 있다.

  • 답 :
  • 나의 선택 :

  해설 :스택은 밑에서 부터 하나씩 쌓이고, 위에서 부터 하나씩 빠져나간다. LIFO(Last In First Out), FILO(First In Last Out)
  큐는 먼저 들어온 것이 먼저 나간다. FIFO(First In First Out)

• 5. 다음 코드에서 this는 무엇일까요?

  const obj = {
    name: 'megagong',
    sayName: () => {
      console.log(this);
    }
  }
  obj.sayName();

  • 1) obj
  • 2) undefined
  • 3) window
  • 4) megagong

  • 답 :
  • 나의 선택 :

  해설 :화살표 함수안의 this는 window가 된다.

• 6. 다음 코드에서 this는 무엇일까요?

  const obj = {
    name: 'megagong',
    sayName() {
      console.log(this);
    }
  }
  obj.sayName();

  • 1) obj
  • 2) undefined
  • 3) window
  • 4) megagong

  • 답 :
  • 나의 선택 :

  해설 :함수를 호출할 때 함수 앞에 객체가 붙으면, this는 그 객체가 된다.

• 7. 다음 Promise와 async/await 설명 중에 틀린 것은 무엇일까요?

  • 1) Promise는 내용이 실행은 되었지만 결과를 아직 반환하지 않는 객체이다.
  • 2) async 함수 선언 없이 await 사용이 가능하다.
  • 3) Promise 사용할 때 Promise 내부 함수 부분은 비동기이다.
  • 4) async/await은 코드를 오른쪽에서 왼쪽으로 해석해야한다.

  • 답 :
  • 나의 선택 :

  해설 :Promise 사용할 때 Promise 내부 함수 부분은 동기이다.

• 8. 다음 코드의 실행 순서는?

  setImmediate(() => {
    console.log('a');
  }, 0);
  setTimeout(() => {
    console.log('b');
  }, 1000);
  setTimeout(() => {
    console.log('c');
  }, 2000);
  Promise.resolve().then(() => {
    console.log('p');
  });

  • 1) a, b, c, p
  • 2) a, p, b, c
  • 3) p, a, b, c
  • 4) b, c, a, p

  • 답 :
  • 나의 선택 :

  해설 :먼저 비동기 코드들은 JS 엔진상의 백그라운드로 들어가는데, promise, process.nextTick은 마이크로 테스크큐로 나머지는 매크로 테스크 큐로 간다. 마이크로 테스크큐의 프로미스 p가 먼저 실행되고 나서 매크로 테스크 큐의 나머지 코드들이 실행된다.

• 9. 다음 코드는 게시글을 등록하는 비즈니스 로직의 예제입니다. 이 로직 중에 빠져도 되는 await은 무엇일까요?

  async function createPost() {
    const post = await db.getPost(); // 게시물 조회
    if (post) {
      res.status(403).send('이미 게시글이 존재합니다.');
    } else {
      await db.createPost(); // 게시글 작성
  
      const p1 = await db.userIncrementPostCount(); // 사용자에 게시글 카운트 1 올림
      const p2 = db.createNoti(); // 새로운 게시글 알림 등록
      await Promise.allSettled([p1, p2]);
    }
  }

  • 1) await db.getPost();
  • 2) await db.createPost();
  • 3) await db.userIncrementPostCount();
  • 4) await Promise.allSettled([p1, p2]);

  • 답 :
  • 나의 선택 :

  해설 :사용자 게시글 카운트 1을 올리면서 새로운 게시글 알림 등록하는 기능은 동시에 진행되어도 상관없다.

• 10. 다음 코드 분석으로 옳지 않은 것은 무엇일까요?

  for (var i = 0; i < 5; i++) {
    setTimeout(() => {
      console.log(i);
    }, i * 1000);
  }

  • 1) 실행 결과는 5, 5, 5, 5, 5가 나온다.
  • 2) var i는 블록 스코프가 아닌 함수 스코프를 따라가기 때문에 i의 스코프도 1개이다.
  • 3) 다음 코드와 같이 var를 let으로 바꿔주면 실행 결과가 0, 1, 2, 3, 4가 나오는 이유는 i가 블록 스코프를 따라가게 되므로 i의 스코프가 5개가 되기 때문이다.

    for (let i = 0; i < 5; i++) {
      setTimeout(() => {
        console.log(i);
      }, i * 1000);
    }

  • 4) 다음 코드와 같이 for문 밖에 새로운 함수(즉시실행함수)를 하나 만들어서 새로운 클로저 관계를 만들어서 해결할 수도 있다.

    (function(){
      for (var i = 0; i < 5; i++) {
        setTimeout(() => {
          console.log(i);
        }, i * 1000);
      }
    })();

  • 답 :
  • 나의 선택 :

  해설 :문제가 되는 상황은 () => {console.log(i)} 함수와 클로저 관계를 형성하는 것이 var i = 0이었다. 이 때 스코프 문제로 인하여 원하는 값이 나오지 않았던 것이다.
  그래서 새로운 함수(즉시실행함수)를 하나 만들어서 새로운 클로저 관계를 만들어서 해결할 수 있다. 이때 새로운 함수는 for문 안에 다음과 같이 만들어 주어야 한다.

  for (var i = 0; i < 5; i++) { 
    (function(j){
      setTimeout(() => {
        console.log(j);
      }, i * 1000); 
    })(i);
  }

  이렇게 for문에 즉시실행함수를 넣으므로 인하여서 function(j){} 함수와 var i = 0 외부 변수가 클로저 관계를 형성한다.
  또 () => { console.log(j); } 함수와 (j) 외부 변수가 클로저 관계를 형성한다.