본문 바로가기

개발/javascript

[javascript]메서드와 this

매서드 만들기 

let user ={
  name:"John",
  age: 30,
};

user.sayhi=function(){
  alert("안녕하세요!")
}

user.sayHi();

함수를 만들어서 sayhi에 할당을 하여 user.sayhi를 사용하게 되면 인사를 하게됩니다. 

이러한 객체 프로퍼티에 할당된 함수를 method라고 합니다. 

 

user = {
  sayHi: function() {
    alert("Hello");
  }
};


user = {
  sayHi() { 
    alert("Hello");
  }
};

이렇게도 표현이 가능합니다. 

메서드와 this 

메서드 내부에서 this키워드를 통해서 객체에 접근할 수 있습니다. 

let user ={
  name: "John",
  age: 30,
  sayHi(){
  	alert(this.name); 
  }
};
user.sayHi();

여기서 this는 현재 객체를 나타냅니다. 

this를 사용하지 않고 user를 이용해서 접근하는 것도 가능합니다. 

let user = {
  name: "John",
  age: 30,

  sayHi() {
    alert( user.name ); 
  }

};


let admin = user;
user = null; 

admin.sayHi();

하지만 위 코드 처럼 외부 변수를 사용할 경우 에러가 발생할 수 있습니다. 

 

자유로운 This 

자바스크립트의 this는 다른 언어의 것들과는 다릅니다. 

function sayHi() {
  alert( this.name );
}

이 처럼 코드를 작성해도 에러가 발생하지 않습니다. 

this 값은 런타임에 결정되고 컨텍스트에 따라 달라지게 됩니다. 

동일한 함수라도 다른 객체에서 호출되었다면 this가 참조하는 값이 달라집니다. 

 

객체 없이 호출하기 : this == undefined 

객체가 없는 경우에는 this는 undefined를 참조하게 됩니다. 

 

'개발 > javascript' 카테고리의 다른 글

객체 : 기본  (0) 2024.04.04
[javascript] new 연산자와 생성자 함수  (0) 2024.03.16
[javascript]가비지 컬랙션  (0) 2024.03.14
[javascript]async & await  (0) 2023.07.26
[javascript]Promise & 콜백지옥  (0) 2023.07.25