[18, 20장] 함수와 일급 객체, strict mode

[juyeon-park]

데브코스 4기 프롱이들 모던 JS Deep Dive 책 뿌수기😎

아래 템플릿을 복사해서 2개이상 퀴즈를 만들어주세요. 객관식, 주관식, 단답형 모두 상관없습니다!

Q. 퀴즈 내용
1.  1번
2.  2번
3.  3번

<details>
<summary>퀴즈 정답</summary>
<div markdown="1">    
정답 설명
</div>
</details>

[ghost]

Q 다음 문장이 옳은지 아닌지 O, X 로 판별해주세요!

• prototype 프로퍼티는 생성자 함수로 호출할 수 있는 객체, 즉 constructor만이 소유하는 프로퍼티다. 일반 객체와 생성자 함수로 호출할 수 없는 non-constructor에는 prototype 프로퍼티가 없다 ( )
• with문을 사용하면 객체 이름을 생략할 수 있어서 코드가 간결해지는 효과가 있으므로 적극적으로 사용해야한다. ( )

퀴즈 정답

(1) O
(2) X (with 문은 사용시 성능과 가독성이 나빠지는 문제가 있습니다. 이러한 이유로 strict 모드에서 사용하면 에러가 발생합니다.)

[suehdn]

Q. 다음 코드를 실행했을 때의 결과로 옳은 것은?

(function (a) {
    'use strict';

    a = 0;

    A(); -(1)
    new B(); -(2)
    new C(); -(3)

    function A() {
        console.log(this);
    }

    function B() {
        console.log(this);
    }
    var C = function () {
        console.log(this);
    }

    console.log(arguments); -(4)

}(10));

	(1)	(2)	(3)	(4)
1.	A{}	B{}	C{}	{'0':0, length:1}
2.	A{}	B{}	TypeError: C is not a constructor	{'0':0, length:1}
3.	undefined	B{}	C{}	{'0':10, length:1}
4.	undefined	B{}	TypeError: C is not a constructor	{'0':10, length:1}
5.	undefined	TypeError: B is not a constructor	TypeError: C is not a constructor	{'0':10, length:1}

퀴즈 정답

정답 : 4번
(1) 일반 함수로 호출하면 this에 undefined가 바인딩됨
(2) 생성자 함수로 호출하면 this에 B 생성자 함수가 생성할 인스턴스를 가리킴
(3) 함수 선언문과 함수 표현식의 호이스팅 방식의 차이
(4) strict mode에선 매개 변수에 전달된 인수를 재할당해도 arguments 객체에 반영되지 않음

[juyeon-park]

Q. arguments 객체의 length 프로퍼티와 함수객체의 length 프로퍼티는 각각 무엇을 가리키는지 작성하고 밑의 코드의 실행값은 무엇일까요?

function foo(a,b,c) {
   return arguments.length;
}

console.log(foo(1,2,3,4,5,6));   // (1)
console.log(foo.length)    // (2)

퀴즈 정답

arguments 객체의 length 프로퍼티 : 인자의 개수
함수 객체의 length 프로퍼티 : 매개변수의 개수
(1) 6
(2) 3

※ 매개변수 vs (전달) 인자
매개변수 : 함수 안에서의 정의 및 사용에 나열되어 있는 변수들
전달인자: 함수를 호출할 때 전달되는 실제 값

[jonghyunlee95]

Q. 다음 코드의 결과값을 작성해 주세요

function foo() {
  x = 10;
}

foo();

console.log(x); // [1]

function foo() {
  'use strict'

  x = 10;
}

foo();

console.log(x); // [2]

function foo() {
  x = 10;

  'use strict'
}

foo();

console.log(x); // [3]

퀴즈 정답

[1] - 10

[2] - ReferenceError: x is not defined
[3] - 10

[dudwns]

Q. 다음은 함수 객체 프로퍼티의 내용이다. 틀린 것을 고르시오.

1. name 프로퍼티는 ES6에서 정식 표준이 되었다.
2. caller 프로퍼티는 함수 자신을 호출한 함수를 가리킨다.
3. 함수 객체의 length 프로퍼티는 인자의 개수를 가리키고, arguments 객체의 length 프로퍼티는 매개변수의 개수를 가리킨다.
4. argument 객체는 함수 외부에서는 참조할 수 없다.
5. prototype 프로퍼티는 생성자 함수로 호출할 수 있는 함수 객체(constructor)만 소유하는 프로퍼티다.

퀴즈 정답

3번

함수 객체의 length 프로퍼티는 매개변수의 개수를 가리키고 arguments 객체의 length 프로퍼티는 인자의 개수를 가리킨다.

// 함수 객체 length 프로퍼티

function add(x, y, z) {
  return x + y + z;
}

console.log(add.length); // 3

// arguments 객체 length 프로퍼티

function multiply(x, y, z) {
  console.log(arguments.length); // 2
  return x * y;
}

multiply(1, 2);

[eeseung]

Q. 다음 코드의 주석을 완성해 주세요.

const obj = { a: 1 };

console.log(obj.__proto__ === Object.prototype); // (1)
console.log(obj.hasOwnProperty('__proto__')); // (2)
console.log(obj.hasOwnProperty('a')); // (3)

퀴즈 정답

(1) true (2) false (3) true