본문 바로가기

분류 전체보기

Study/VanillaJS 2019. 3. 12. [개념잡기] 컬렉션 중심 프로그래밍 - (3) 찾아내기 (find, find_index, some, every) [개념잡기] 컬렉션 중심 프로그래밍 - (3) 찾아내기 (find, find_index, some, every) 서론 이번 포스팅에서는 데이터에서 조건에 맞는 데이터를 찾아내는 것과 관련있는 함수들에 대해 알아보도록 하겠다. 컬렉션 중심 프로그래밍 find 기대동작 : 조건에 맞는 데이터가 있다면 해당 데이터를 리턴 코드 작성 var _find = _curryr((list, predi) => { var keys = _keys(list) for(var i = 0, len = keys.length ; i < len; i++) { var val = list[keys[i]] if(predi(val)) return val } }) console.log( _find(users, function(user){ retu..
Study/VanillaJS 2019. 3. 11. [개념잡기] 컬렉션 중심 프로그래밍 - (2) 거르기 (filter, reject, compact) [개념잡기] 컬렉션 중심 프로그래밍 - (2) 거르기 (filter, reject, compact) 서론 컬렉션 중심 프로그래밍의 두번째 거르기에 대해 알아보도록 하겠다. 수집하기의 기본이 되는 함수는 filter 함수이다. var _filter = _curryr((list, predi) => { var new_list = [] _each(list, (val) => { if(predi(val)) { new_list.push(val) } }) return new_list }) console.log( _filter(users, function(user) { return user.age > 30 }) ) 컬렉션 중심 프로그래밍 reject 기대동작 : filter 함수의 반대 동작으로 조건에 맞지 않는 값들을..
Study/VanillaJS 2019. 3. 11. [개념잡기] 컬렉션 중심 프로그래밍 - (1) 수집하기 (map, values, plunk) [개념잡기] 컬렉션 중심 프로그래밍 - (1) 수집하기 (map, values, plunk) 서론 컬렉션 중심 프로그래밍의 첫번째 수집하기에 대해 알아보도록 하겠다. 수집하기의 기본이 되는 함수는 map 함수이다. var _map = _curryr((list, mapper) => { var new_list = [] _each(list, (val) => { new_list.push(mapper(val)) }) return new_list }) console.log( _map(users, user => user.name) ) // (8) ["ID", "QW", "WE", "ER", "RT", "DF", "AS", "IS"] 컬렉션 중심 프로그래밍 values 기대동작 : 오브젝트를 받아 해당 오브젝트의 va..
Study/VanillaJS 2019. 3. 9. [개념잡기] 함수형 프로그래밍 - (9) 마무리 [개념잡기] 함수형 프로그래밍 - (9) 마무리 _.js 지금까지 작성한 함수들을 정리해 보려고 한다. 기존에 작성한 코드는 const를 사용하여 함수를 선언하였는데 호이스팅 관련 문제로 var 로 변경하였다. (다음부터는 어떤 것을 사용할 때 알고 사용해야 겠다는 생각이 들었다.) curry 함수의 평가시점을 늦춰줌. 2개의 인자가 채워지면 함수를 실행시킴 // curry var _curry = (fn) => { return function (a, b) { return arguments.length == 2 ? fn(a,b) : b => fn(a, b) } } curryr curry 의 두개의 인자를 따로 받을 때 처리되는 순서를 반대로 해줌 // curryr var _curryr = (fn) => {..
Study/VanillaJS 2019. 3. 8. [개념잡기] 함수형 프로그래밍 - (8) 다형성 높이기 [개념잡기] 함수형 프로그래밍 - (8) 다형성 높이기 서론 이번 포스팅에서는 지금까지 작성했던 함수들의 다형성을 높이는 작업을 해보겠다. 함수형 프로그래밍 each 함수 error 처리 const _each = (list, iter) => { for(var i = 0; i < list.length; i++) { iter(list[i]) } } _each(null, function(val) {console.log(val)}) // Uncaught TypeError: Cannot read property 'length' of null each 함수는 리스트로 null 값이 들어가게 되면 error가 발생한다. each 에 get 함수를 이용하여 null 검사를 해보겠다. const _length = _ge..
Study/VanillaJS 2019. 3. 7. [개념잡기] 함수형 프로그래밍 - (7) go, pipe [개념잡기] 함수형 프로그래밍 - (7) go, pipe 서론 함수를 받아서 함수를 리턴하는 pipe 함수와, pipe 의 즉시 실행 함수형 go 함수에 대해 알아보자 함수형 프로그래밍 pipe pipe 함수는 인자로 함수리스트를 받아 return 값을 다음 함수로 넘겨 결과로 함수를 리턴하는 함수이다. 기대하는 동작은 다음과 같다. var _pipe = function(){} var pipe = _pipe(function(a){return a + 1},function(a){return a * a}) console.log( pipe(1) ) // 4 (a + 1) * a pipe 함수를 구현해보자. reduce를 이용하여 순서대로 함수들을 수행해가면서 return 값을 다음 함수로 넘겨주는 코드로 작성해..
Study/VanillaJS 2019. 3. 6. [개념잡기] 함수형 프로그래밍 - (6) call [개념잡기] 함수형 프로그래밍 - (6) call 서론 이번 포스팅에서는 참고하고 있는 강의에서는 설명하고 있지만 다른 코드로 대체한 call() 메서드에 대해 알아보도록 하자 함수형 프로그래밍 유사 배열 javascript 에서 배열처럼 생겼지만 배열의 메서드를 못쓰는 배열을 말한다. 대표적인 유사배열은 arguments 가 있다. const example = function(){ console.log(arguments) console.log(arguments.forEach(el => { console.log(el) })) } example(1, 2, 3) ======= 출력 ======= Arguments(3) [1, 2, 3, callee: ƒ, Symbol(Symbol.iterator): ƒ] l..
Study/VanillaJS 2019. 3. 4. [개념잡기] 함수형 프로그래밍 - (5) reduce [개념잡기] 함수형 프로그래밍 - (5) reduce 함수형 프로그래밍 reduce의 동작원리 이러한 방식으로 동작하는 reduce 함수를 만들어보겠다. const _reduce = (list, iter, memo) => {} console.log(_reduce([1, 2, 3], add)) // 6 console.log(_reduce([1, 2, 3], add, 0)) // 6 console.log(_reduce([1, 2, 3], add, 10)) // 16 배열, 함수, 시작값을 인자로 받아 해당 시작값을 기준으로 배열에서 값을 하나씩 꺼내 인자로 받은 함수를 실행하는 reduce 를 만들어 보자. 위 코드를 예시로 들면 console.log(_reduce([1, 2, 3], add, 0)) mem..

티스토리툴바