[javascript] 객체는 함수인가요?

조회수 78회

안녕하세요.

var color = 'red';
function foo() {
    var color = 'blue'; // 2
    function bar() {
        console.log(color); // 1
    }
    return bar;
}

다음과 같은 코드에서 foo함수의 color 변수를 가져오고 싶을때

function foo() { ... }
foo.color = "blue";
console.log(foo.color); // "blue"

로 foo.color를 가져올 수 있다는것을 알게되었습니다.

질문 1) 위의 function foo()의 foo는 함수인가요? 객체인가요?

또한 foo.color을 출력하는 다른 코드를 짜보았는데요. 아래와 같은 코드를 작성하였더니 undefinded가 나오더라구요. 저는 아직 .. js 기본공부가 잘 안되어있어서 .. 객체를 var foo = {color:'blue'}이렇게 밖에 선언을 안해보았는데요.

질문2) 아래의 방법은 잘못된것인가요? 왜 undefined가 나오는것인가요?

function foo() {
     foo.color = 'blue'; 
}
console.log(foo.color);

그리고 .. 객체와 함수의 관계가 궁금해서 stackoverflow를 찾아보았습니다. https://stackoverflow.com/questions/3449596/every-object-is-a-function-and-every-function-is-object-which-is-correct

아래 링크의 답변을 보니

Since you can't "call" every Object instance, not every object is a function.

이므로 함수는 모든 객체이지만, 객체는 함수라고 말할 수 없다고 되어있는데요.

질문 3) 여기서의 call이 무엇을 의미하는것인가요?

Function.prototype.call() 함수의 'call 메소드를 말하는 것'인지, 아니면 var foo = new Foo(); 이런 '호출' 을 말하는것인지 모르겠습니다.

글이 조금 길고, 질문이 여러개인데 .. 읽어주셔서 감사합니다 :) 답변이 항상 저에게 큰 도움이 되고있습니다ㅜㅜ

2 답변

  • 좋아요

    1

    싫어요
    채택 취소하기

    함수 foo 안의 var colorfoo.color는 완전히 다른 변수입니다.
    var colorfoo.color로 얻을 수 있다는 것이 아니라 foo의 color라는 표현을 하기 위해서 foo.color를 사용할 수 있다는 말입니다.
    지역 변수 var color는 여전히 반환을 하는 방법 외엔 얻을 수 있는 방법이 없습니다.

    답변 1)
    올려주신 스택오버플로에도 나와있듯이 모든 함수는 객체입니다.
    따라서 foo도 객체이며 그 중에서도 함수인겁니다.

    답변 2)
    코드를 직접 차례로 실행해보세요.
    foo 함수 안의 코드는 foo가 호출되어야 실행됩니다.
    즉, foo를 호출해야 foo.color = 'blue';가 실행되어 foo.color가 설정된다는 말입니다.

    function foo() {
         foo.color = 'blue'; 
    }
    foo();
    console.log(foo.color);
    

    이러면 될겁니다만 애초에 이런 코드는 JS에 대한 이해가 부족하여 나오는 것이기 때문에 이렇게 작성하실 일도 잘 없을겁니다.

    답변 3)
    둘 다 해당됩니다.
    Foo.call(), new Foo(), foo() 다 호출(call)입니다.
    그러니까 모든 함수는 객체인데 이렇게 호출할 수 없는 것은 객체이지만 함수는 아니라는 말이죠.

    • 우와 ... 친절한 설명 정말 감사합니다 ㅎㅎ wo0kgod 2019.2.10 17:43
  • 조금 첨언합니다.

    javascript 는 1급 객체언어 입니다.

    쉽게 함수를 함수의 인자로 넣을 수 있고 리턴값으로 받을 수 있습니다.

    그런 경우를 고차함수라고 하는데 javascript 는 이를 지원합니다.

    javascript 의 객체중에서 callable 한 객체가 함수입니다. 즉 자바스크립트의 모든 객체가 call 할 수 있는 것이 아닙니다.

    그리고 함수내 변수문제는 hoisting 현상을 이해해야 합니다. 특히 NeuroWhAl 님 답변 2의 코드를 이해하려면 필수라고 할 수 있습니다.

    우선 es6 기준인 경우 var 과 let, const 가 있습니다. 저 중에 var 과 let 는 잘 이해하고 사용해야 합니다.

    let 는 다른 언어들의 지역변수처럼 동작하지만(호이스팅 하지 않음) var 는 그렇지가 않습니다. 쉽게 전역변수로 끌어올려져 선언됩니다.

    console.log(v);
    var v = 'test';
    console.log(v);
    
    undefined
    test
    

    사실 우리가 원하는 것은 undefined 가 아니라 v is not defined 같은 오류를 받는 것입니다. undefined 라는 것은 변수가 존재한다는 의미니까요.

    위의 코드는 실제 아래와 같이 v라는 변수가 끌어올려져서 실행됩니다.

    var v;
    console.log(v);
    v = 'test';
    console.log(v);
    

    이제는 var 보다 let, const 를 사용해야하고 var 사용시 'use strict' 선언을 검토해야 합니다.

    • 네.. undefined가 나오면 정의는 되었지만 값을 할당받지 못했다는 뜻이지요. 답변해주셔서 감사합니다 ㅎㅎ wo0kgod 2019.2.10 17:56

답변을 하려면 로그인이 필요합니다.

Hashcode는 개발자들을 위한 무료 QnA 사이트입니다. 계정을 생성하셔야만 답변을 작성하실 수 있습니다.

(ಠ_ಠ)
(ಠ‿ಠ)

ᕕ( ᐛ )ᕗ
로그인이 필요합니다

Hashcode는 개발자들을 위한 무료 QnA사이트 입니다. 계정을 생성하셔야만 글을 작성하실 수 있습니다.