꾸준히 공부하는 개발자

함수 객체 메소드 apply, call, bind 본문

Javascript

함수 객체 메소드 apply, call, bind

kauboy 2020. 9. 25. 00:02

 오늘은 function 객체에 포함되어있는 내장 메소드들을 알아보겠습니다.

솔직히 개발하는데에 있어 몰라도 지장이 없는 것 들이라고 생각하는데요. 개념적인거니깐 알아보고 넘어가는 차원에서 공부해보았습니다.

그나마 사용한다면 bind를 이용해서 this를 바꿔 주는 일이라고 생각하는데요. 그것도 요즘에는 arrow function도 나오고해서 왠만해서 코드 짤때 사용하지 않는다고 생각됩니다.

 

 apply, call, bind를 어떤식으로 사용되었는지 실무에서 예시가 있다면, 알려주시면 감사할 것 같아요!

 

아래와 같이 apply 와 call은 별로 차이가 없습니다.

하지만 null 자리에는 this를 대신할 수 있습니다.

apply, call 차이

call은 apply 와 별반 다르지 않습니다. 하지만 apply에는 단일 배열로 넣어줘야 합니다. call은 반면에 유사배열로도 가능합니다.

function obj(a,b,c) {
	console.log(arguments)
}
obj(1,2,3) // [1,2,3]
obj.apply(null,[1,2,3]) // [1,2,3]
obj.call(null,1,2,3) // [1,2,3]

apply, call (this 변경)

function obj(a,b,c) {
	let string = "obj"
	console.log(this.string)
}
let obj2 = {string: "obj2"}

obj.apply(obj2,1,2,3) // "obj2"

위와 같은 결과가 나옵니다. this가 obj2로 바뀌어 obj2가 콘솔로 찍힌 모습을 볼 수 있습니다

bind

function obj(a,b,c) {
	let string = "obj"
	console.log(this.string)
}
let obj2 = {string: "obj2"}

obj.bind(obj2)
obj() // "obj2"

bind는 this만 바꿔줄 뿐 함수를 실행하지 않습니다.

Comments