apply, bind

Apply : this에 해당되는 값을 변경할 수 있다.

 

Var fnObj = {

fn1 : function( str1, str2 ){

        console.log( str1 + “/“ + str2 );

        console.log( this );

    }

};

 

Var obj0 = {

“test1” : “test1”,

“test2” : “test2"

};

 

fnObj.fn1.apply( [“wow1”,”wow2"] );

> undefined/undefined

> [“wow1”,”wow2”] 

=> this 가 파라미터 값으로 잡힌다.

 

fnObj.fn1.apply(obj0);

> undefined/undefined

> {test1 : “test1”, test2 : “test2”}

=> this가 obj0으로 잡힌다.

 

fnObj.fn1.apply(obj0, [“wow1”,”wow2"]);

> wow1/wow2

> {test1 : “test1”, test2 : “test2”}

=> this 가 obj0으로 잡히며, str1과 str2가 순차적으로 다음 파라미터인 배열로 값이 된다. (배열 파라미터에 2개 이상 넣어도 출력이 str2까지 임으로 변경은 안됨)

 

 

 

 

---

 

Bind : this값을 변경하지만 함수를 직접적으로 실행하지 않고 함수 자체를 return 한다. 

 

 

fnObj.fn1.bind(obj0,["test"]);

> ƒ (str1,str2){ console.log(str1 + "/" + str2); console.log(this); }

 

 

var fn1 = fnObj.fn1.bind(obj0,["test"]);

fn1();

> test/undefined

> {test1 : “test1”, test2 : “test2”}

 

=> 함수를 변수에 담은 후 호출해야 실행된다.