이 기사는 면접 질문에 대한 자세한 이해를 제공합니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.
인터뷰 질문: add(1)(2)(3) 구현 //결과 = 6. 질문의 핵심은 js의 커링에 관한 것입니다
먼저 커링이 무엇인지 이야기해 보겠습니다. currying 아직 변형에 대한 기사가 확실하지 않습니다. 예: Currying은 여러 매개변수를 허용하는 함수를 단일 매개변수(원래 함수의 첫 번째 매개변수)를 허용하는 함수로 변환하고 나머지 매개변수를 반환하는 것입니다. 그리고 결과를 반환하는 새로운 함수의 기술. 대부분의 블로그에서는 이렇게 말하고 있는데, 솔직히 말해서 저는 혼란스럽습니다.
카레는 매개변수를 수집하는 방식인 것으로 알고 있습니다.
구현 전 핵심 사항을 나열해 보겠습니다
1. 클로저를 사용하여 (여러 매개 변수를 여러 번 실행하는 인터뷰 질문과 마찬가지로) add(1)(2 ,3과 같이 매번 실행되는 매개 변수 수는 몇 개입니까? )(4)
3. 매개변수가 충분한지 알아야 합니다
//如题 //add(1)(2)(3) //逻辑应该是这样add(1)执行收集参数1继续执行收集参数2依次类推直到收集完毕。 function curry(fn) { let arg = []; //用于收集参数 //做一个闭包https://segmentfault.com/a/1190000017824877 return function() { //每执行一次收集一次参数,为什么用concat是因为有时候后是多个参数(2,3) arg = arg.concat([...arguments]); //直到参数收集完成执行fn // 我们需要知道什么时候收集完了,条件就是curry参数fn的参数个数 fn.length //如果收集的参数个数大于等于fn的参数个数执行fn,如果没有递归执行 if (arg.length >= fn.length) { return fn(...arg) } // 参数没有收集完我们需要继续收集,递归 return arguments.callee } } // 测试一下 let testAdd = curry(add1) // console.log(testAdd(1)(2)(3)) // console.log(testAdd(1, 2)(3)) //console.log(testAdd(1)(2, 3))
function curry(fn) { function _c(restNum, argsList) { return restNum === 0 ? fn.apply(null, argsList) : function(x) { return _c(restNum - 1, argsList.concat(x)); }; } return _c(fn.length, []); }
분석:
1. Curry는 또한 매개변수(fn)를 받습니다. 2. 함수를 반환하고 fn.length와 빈 배열을 받습니다. 이것은 제가 작성한 단순화된 버전이기도 합니다. 그 후 fn.length를 사용하여 매개변수가 충분히 수집되었는지 확인합니다. 빈 배열을 매개변수로 전달하는 것은 실제로 매개변수를 수집하는 데 사용되는 클로저의 구현입니다.
3. 내부에 삼안 판정이 있습니다. 화려해 보이지만 그렇게 복잡하지는 않습니다. 판정 매개변수 개수가 0이면 이를 수집하여 fn을 직접 실행할 필요가 없습니다. argList), 아주 잘 이해합니다. 큰 소리로 말하면 어디에서나 사용할 수 있나요? 제 생각에는 쓸모가 없습니다. argList가 배열이고 Apply가 두 번째 매개 변수가 배열이라는 것을 지원하기 때문에 사용됩니다.
4. fn 매개변수 개수가 0이 아닙니다. fn 함수 매개변수 개수가 수집될 때마다 0이 될 때까지 1씩 줄여서 fn을 실행합니다. 한 번에 두 마리가 죽었습니다.
또 다른 예: 바인드 메소드 구현
Function.prototype.bind = function(context) { //返回一个绑定this的函数,我们需要在此保存this let self = this // 可以支持柯里化传参,保存参数 let arg = [...arguments].slice(1) // 返回一个函数 return function() { //同样因为支持柯里化形式传参我们需要再次获取存储参数 let newArg = [...arguments] console.log(newArg) // 返回函数绑定this,传入两次保存的参数 //考虑返回函数有返回值做了return return self.apply(context, arg.concat(newArg)) } } // 搞定测试 let fn = Person.say.bind(Person1) fn() fn(18)
위 내용은 면접질문 속 자바스크립트 커링에 대한 자세한 이해의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!