B15 : ๊ฐ์ฒด์˜ ๋ฉ”์„œ๋“œ

2025. 8. 19. 16:56ใ†Front-end/JavaScript

๋ฐ˜์‘ํ˜•

๋ชฉ์ฐจ

1. ๋ฉ”์„œ๋“œ๋ž€?

2. ๋ฉ”์„œ๋“œ์™€ this


1. ๋ฉ”์„œ๋“œ๋ž€?

๊ฐ์ฒด์˜ ํ”„๋กœํผํ‹ฐ๋กœ ํ• ๋‹น๋œ ํ•จ์ˆ˜์ด๋‹ค.

ํ•จ์ˆ˜ ์ž์ฒด๋Š” ๋…๋ฆฝ์ ์ธ ๊ธฐ๋Šฅ ๋‹จ์œ„์ด๋‚˜, ๊ฐ์ฒด์˜ ์†์„ฑ์œผ๋กœ ํฌํ•จ๋  ๋•Œ ๋ฉ”์„œ๋“œ๋ผ๊ณ  ๋ถ€๋ฅธ๋‹ค.

// user ๊ฐ์ฒด ์ƒ์„ฑ ํ›„ ๋ฉ”์„œ๋“œ๋ฅผ ์ถ”๊ฐ€
let user = {
  name: "John",
  age: 30
};

user.sayHi = function() {
  alert("Hi");
};

user.sayHi();	// Hi

// ๊ฐ์ฒด ๋ฆฌํ„ฐ๋Ÿด ์•ˆ์— ๋ฉ”์„œ๋“œ๋ฅผ ์„ ์–ธ(๊ทธ๋ƒฅ๋ฒ„์ „&๋‹จ์ถ•๋ฒ„์ „)
user = {
  sayHi: function() {
    alert("Hi");
  }
};

user2 = {
  sayHi() {
    alert("Hi");
  };
};

 


2. ๋ฉ”์„œ๋“œ์™€ this

๋ฉ”์„œ๋“œ๋Š” ๊ฐ์ฒด์— ๋‚ด์žฅ๋œ ์ •๋ณด์— ์ ‘๊ทผ์„ ํ•  ์ˆ˜ ์žˆ์–ด์•ผ๋œ๋‹ค.

๋Œ€๋ถ€๋ถ„์˜ ๋ฉ”์„œ๋“œ๋Š” ๊ฐ์ฒด ํ”„๋กœํผํ‹ฐ์˜ ๊ฐ’์„ ํ™œ์šฉํ•œ๋‹ค.

๋งค์„œ๋“œ ๋‚ด๋ถ€์—์„œ this ํ‚ค์›Œ๋“œ๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ๊ฐ์ฒด์— ์ ‘๊ทผํ•  ์ˆ˜ ์žˆ๋‹ค.

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

user.sayHi();	// John

 

this์— ๊ด€ํ•œ ์ž์„ธํ•œ ๋‚ด์šฉ์€ ์—ฌ๊ธฐ์— ์žˆ๋‹ค.
ํ•จ์ˆ˜์˜ this ํ‚ค์›Œ๋“œ

 

Basic 10 : ํ•จ์ˆ˜์˜ this ํ‚ค์›Œ๋“œ

๋ชฉ์ฐจ1. this ํ‚ค์›Œ๋“œ๋ž€?2. ํ•จ์ˆ˜ ๋‹จ์ˆœ ํ˜ธ์ถœ์—์„œ์˜ this3. ๋ฉ”์„œ๋“œ ํ˜ธ์ถœ์—์„œ์˜ this4. ์ƒ์„ฑ์ž ํ˜ธ์ถœ์—์„œ์˜ this5. ํ™”์‚ดํ‘œ ํ•จ์ˆ˜์—์„œ์˜ this1. this ํ‚ค์›Œ๋“œ๋ž€?ํ˜„์žฌ ์‹คํ–‰ ์ค‘์ธ ๋ฌธ๋งฅ(context)๋ฅผ ์ฐธ์กฐํ•˜๋Š” ํ‚ค์›Œ๋“œ์ด๋‹ค.

ldd6cr-adness.tistory.com

 

 

 

 

 

 

์ฐธ๊ณ 

๋ฐ˜์‘ํ˜•