[JS]알고리즘 문제풀이5_bind( )함수

bind( ) 함수에 대한 알고리즘 문제.

esc6 문법에 대해 설명하면서, this 키워드와 함께 자주 등장하는 개념이며,

블로그 내에 정리해두었으니 같이 살펴보면서 문제를 풀었다.

 

hazel-developer.tistory.com/13

Ecma Script6문법

 

/*
 * function bind():
 *
 * example 1:
 *
 * var alice = {
 *   name: 'alice',
 *   shout: function(){
 *     alert(this.name);
 *   }
 * }
 * var boundShout = bind(alice.shout, alice);
 * boundShout(); // alerts 'alice'
 * boundShout = bind(alice.shout, {name: 'bob'});
 * boundShout(); // alerts 'bob'
 *
 * example 2:
 *
 * var func = function(a, b){ return a + b };
 * var boundFunc = bind(func, null, 'foo');
 * var result = boundFunc('bar');
 * result === 'foobar'; // true
 *
 */
 
var bind = function (funcArgs, context) {
  //return arguments[0]();
  //역시나 rest parameter 활용
  //인자중에 함수인 것을 찾아서, 다른 인자를 함수인자 내의 인자로 넣어줌
  //let funcArgs = arguments[0];
  //let context = [].slice.call(arguments, 1); -> 객체형태의 인자가 배열에 묶여서 출력되어 에러
  let firstArgs = [].slice.call(arguments, 2); //call 활용, 주어진 인자들(arguments)에서 먼저 주어진 인자를 먼저 뽑아냄
  //console.log('firstArgs :', firstArgs);
  return function () {
    let afterArgs = [].slice.call(arguments); //예시 2 같이 bind 후에 추가되는 인자
    //console.log('afterArgss :', afterArgs);
    let combined = [].concat(firstArgs, afterArgs);
    //console.log('combined :', combined);
    //return funcArgs.apply(null, combined); -> should call the "curried" function in the bound context:
    return funcArgs.apply(context, combined);
    //주어진 함수 인자에 모든 인자들을 집어넣는다
  };
};
 
/*
 * Function.prototype.bind:
 *
 * example 1:
 *
 * var alice = {
 *   name: 'alice',
 *   shout: function(){
 *     alert(this.name);
 *   }
 * }
 * var boundShout = alice.shout.bind(alice);
 * boundShout(); // alerts 'alice'
 * boundShout = alice.shout.bind({name: 'bob'});
 * boundShout(); // alerts 'bob'
 *
 * example 2:
 *
 * var func = function(a, b){ return a + b };
 * var boundFunc = func.bind(null, 'foo');
 * var result = boundFunc('bar');
 * result === 'foobar'; // true
 *
 */
 
Function.prototype.bind = function (context) {
  let funcArgs = this;
  let firstArgs = [].slice.call(arguments, 1); //위와 달리 함수는 this로 빠지고 인자만 주어지기 때문에 1인덱스부터 slice
  return function () {
    let afterArgs = [].slice.call(arguments);
    let combined = [].concat(firstArgs, afterArgs);
    //console.log('combined :', combined);
    return funcArgs.apply(context, combined);
  };
};

bind 함수 자체를 풀어서, 개념을 이해해보자는 취지의 토이 문제인듯했다...

이해는 가는데 어떻게 코드로 풀지를 몰라서 코드들을 참고했다.

나중에 다시 풀어볼때는 꼭 스스로 풀어보자 ㅠㅠ

 

꼭 인자를 지정해줘서 푸는 방법밖에 없을까?
rest parameter을 쓰더라도 인자들이 배열화 되어서,
객체 인자가 주어진 경우에 자꾸 에러가 걸려서 결국 인자를 임의로 지정할 수 밖에 없었다.

 

참고문서

developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Function/bind

Function.prototype.bind()