상세 컨텐츠

본문 제목

[자바스크립트] 전역변수 객체변수

카테고리 없음

by esoesmio 2023. 5. 16. 18:08

본문

// call 또는 apply의 첫 번째 인자로 객체가 전달될 수 있으며 this가 그 객체에 묶임
var obj = {a: 'Custom'};

// 변수를 선언하고 변수에 프로퍼티로 전역 window를 할당
 var a = 'Global';

function whatsThis() {
    return this.a;  // 함수 호출 방식에 따라 값이 달라짐
}

a =whatsThis();          // this는 'Global'. 함수 내에서 설정되지 않았으므로 global/window 객체로 초기값을 설정한다.
b =whatsThis.call(obj);  // this는 'Custom'. 함수 내에서 obj로 설정한다.
c =whatsThis.apply(obj); // this는 'Custom'. 함수 내에서 obj로 설정한다.
console.log(a);
console.log(b);
console.log(c);

이 동작의 이유는 JavaScript에서 전역 변수와 전역 객체의 관계 때문입니다.

웹 브라우저에서 전역 변수는 자동으로 전역 객체인 window의 속성이 됩니다. 그래서 a = 'Global'이라고 선언하면 window.a라고 접근할 수 있습니다. 이것이 JavaScript가 웹 브라우저에서 동작하는 방식입니다.

하지만 Node.js에서는 이렇게 동작하지 않습니다. Node.js에서 전역 변수는 global 객체의 속성이 아니라, 전역 네임스페이스에 존재하는 변수입니다. 그래서 a = 'Global'이라고 선언하더라도 global.a라고 접근할 수 없습니다.

따라서, 웹 브라우저에서 var a = 'Global'을 사용하면 whatsThis() 함수는 this.a를 window.a 즉 'Global'로 해석하게 되어 'Global'을 반환합니다. 반면, Node.js에서는 this.a가 global.a를 참조하지 않으므로 whatsThis()는 undefined를 반환합니다.

그러므로 var a = 'Global'과 a = 'Global'은 사실상 다르게 동작합니다. var 키워드를 사용하면 a는 현재 스코프에 있는 변수를 참조하게 됩니다. var 키워드 없이 a = 'Global'을 사용하면 a는 전역 객체의 속성을 참조하게 됩니다. 이는 JavaScript의 스코프 체인과 변수 호이스팅의 동작 방식 때문입니다.

댓글 영역