"this"는 JavaScript에서 매우 중요한 개념 중 하나로, 현재 실행 중인 함수 또는 메소드 내에서 어떤 객체를 참조하는 데 사용됩니다. "this"는 함수나 메소드가 어떻게 호출되는지에 따라 다양한 값을 가질 수 있습니다. 주로 다음과 같은 경우에 사용됩니다:
전역 범위에서의 this: 전역 범위에서 "this"를 사용하면 전역 객체를 참조합니다. 웹 브라우저 환경에서는 "window" 객체를 참조하며, Node.js 환경에서는 "global" 객체를 참조합니다.
console.log(this); // 전역 범위에서 this를 사용하면 전역 객체를 참조
객체 메소드에서의 this: 객체의 메소드 내에서 "this"를 사용하면 해당 메소드를 호출한 객체를 참조합니다.
const person = {
name: "John",
sayHello: function() {
console.log("Hello, " + this.name);
}
};
person.sayHello(); // "this"는 person 객체를 참조하므로 "John"을 출력
생성자 함수에서의 this: 생성자 함수 내에서 "this"를 사용하면 새로운 객체를 참조합니다. 생성자 함수는 클래스와 객체 생성에 사용됩니다.
function Person(name) {
this.name = name;
}
const person1 = new Person("Alice");
console.log(person1.name); // "Alice"
이벤트 핸들러에서의 this: 이벤트 핸들러 함수 내에서 "this"는 이벤트를 발생시킨 DOM 요소를 참조합니다.
document.getElementById("myButton").addEventListener("click", function() {
console.log(this); // "this"는 이벤트를 발생시킨 버튼 요소를 참조
});
"this"의 값은 실행 컨텍스트에 따라 변할 수 있으므로 주의가 필요합니다. 함수를 호출하는 방식, 객체와 메소드 간의 관계, 그리고 함수가 어떻게 정의되었느냐에 따라 "this"의 동작이 달라질 수 있습니다. 함수 내에서 "this"의 값을 명시적으로 설정하려면 bind, call, 또는 apply 메소드를 사용할 수 있습니다.
'Wecode -기업협업 인턴 (부트캠프) > 기업협업 독학, 공부' 카테고리의 다른 글
@nestjs/core, nest.js에서는 database 연결을 어디에서 하니 *** (0) | 2023.11.01 |
---|---|
TypeScript 클래스: constructor(private server) {/ 로깅(Logger) ** (0) | 2023.11.01 |
ORM,entity, repository ** (0) | 2023.11.01 |
api 쓰면서 알게 되는 nest.js, typescript, typeorm 연결 (0) | 2023.11.01 |
Query Builder (with 제품목록 페이지) ** (0) | 2023.11.01 |