Seungdols Company

러닝 리액트3장 자바스크립트를 활용한 함수형 프로그래밍함수형 프로그래밍 개념이 시작 된 것은 1930년대이다. 그 당시 발견한 람다 계산법이 함수형 프로그래밍의 시작이라 할 수 있다. 함수를 함수로 넘기거나 함수가 함수를 결과로 내놓는 것도 가능하다. 다른 함수를 조작하고, 함수를 인자로 받거나 반환하는 것이 가능한 복잡한 함수를 고차함수 (high-order function)으로 부른다.함수가 1급시민(First class citizen)이 되려면 변수에 함수를 대입할 수 있어야 하고, 함수를 다른 함수에 인자로 넘길 수 있으며, 함수에서 함수를 만들어서 반환할 수 있어야 한다.3.1 함수형이란?자바스크립트는 함수가 1급시민에 해당되기에 함수형 프로그래밍을 지원한다고 할 수 있다.var log = fu..

자바스크립트 디자인 패턴 책의 내용을 정리한 내용입니다.curring을 알기 전에 부분 적용이라는 개념을 먼저 알고 있어야 합니다. 사실, 많은 싸이트나 위키에서 curring을 잘못 받아들여 소개하기도 합니다. 일단은 제대로 이해하기 위해서 부분 적용이 뭔지 알아봅시다.함수 적용순수 함수형 프로그래밍에서는 함수를 호출하거나, 부른다고 하지 않고, 적용 된다고 표현합니다.고로, apply로 이해하시는 것이 맞습니다.자바스크립트에서도 Function.prototype.apply()를 사용하면 함수를 적용 할 수 있습니다. var sayHi = function(who) { return 'Hello' + (who ? ', ' + who : '') + '!'; } sayHi(); sayHi('world'); s..

JavaScript Deferred 객체와 promise 요즘 업무를 하다보니 느낀 사실인데, 비동기 처리나, 동기처리에 관한 이슈가 늘 나를 덮치곤 했다. 그런 이유로 JavaScript를 좀 더 잘하고 싶은 마음에 찾아본 자료를 정리해보았다. Deferred Object jQuery에서는 promise를 사용할 수 있도록 Deferred 객체를 제공합니다. 물론, jQuery.Promise()를 지원한다. 3.0부터 아마 제대로 지원한다고 생각하면 될 것 같습니다. 그러나, 사용하는 jQuery 버전이 3.0 이하인 경우에는 jQuery.Promise()를 사용할 수는 없습니다. jQuery.Deferred()가 존재하므로 이를 이용하여 promise를 사용할 수 있어 Callback Hell에서 벗..

Python 한국의 파이썬 소식-2월 넷째 JavaScript javascript issue High-performance ES2015 and beyond : V8 engine Java The Trouble With Enums The Factory Pattern Using Lambda Expressions in Java 8 Extending Git Mockito Mock vs. Spy in Spring Boot Tests Optional Method Parameters A Look at Java Collections Java 8 Optional In Depth IT news 망중립성은 실수다라는 기사 소니 + LINE의 결합으로 어떤 AI를 만들까 애플이 맥 프로를 아직 버리진 않았다는 내용 여러가지 호..

jQuery의 data() 메소드 사용 삽질기 jQuery에서 흔히 사용하는 것 중에 data()메소드입니다. 웹 개발을 하다보면, 특정 값을 서버에서 프론트로 내려 주어야 하거나, 하나의 뷰에 값만 바꾸어 동작하는 뷰 작업을 해야 하면 사용하게 되는 것이 data() 메소드입니다. 물론, 자바스크립트에서도 사용 할 수 있으나, 크로스 브라우징을 위해 jQuery를 사용하면 간편하게 크로스 브라우징 이슈를 해결 할 수 있습니다. 사실, 그래서 사용하는 거죠. Selector만 사용하기 위함이 아니라는 사실!! jQuery는 JavaScript Library인데, 착각하는 것이 편한 셀렉터 지정으로 많이 사용하시는 줄 아시지만. jQuery는 간편하게 JavaScript를 사용하게 만들되, 여러 브라우저에..

J. Fla의 커버 노래 제목을 가져오고 싶은데, 어떻게 할까? 우연히 듣게 된 J. Fla의 커버 노래 제목을 가져오고 싶은데? 어라 이 노래 좋다. 원곡자 노래 들어봐야지 이런 생각을 하다가, 음 쉽게 할 수 있는 방법은 뭐가 있을까 하다가 JavaScript로 빠르게 제목만 가져와야지 하면서 간단하게 코드를 짜보았다. 일단 유투버의 재생목록을 클릭하여 들어갔다. J.fla의 커버 재생 목록으로 들어간다. 우측에 재생 목록이 뜨는데, 89개의 동영상 있다. 우선은 리스트의 상위 부모 노드를 찾아야 한다. 이때 크롬의 개발자 도구를 열어 HTML의 영억을 찍어 해당 li의 부모를 찾는다. 찾았더니 가 재생 목록 리스트의 상위 부모 노드더라. 그래서 우리는 상위 부모노드의 id 값이 있는지 확인 할 필요..

jQuery Event 이벤트 메서드 on()메서드는 모든 이벤트를 처리 할 수 있다. 내부적으로 jQuery는 크로스 브라우저 이슈를 모두 고려 한다. .on() 메서드는 1.7 버전에서 처음 도입 되었고, 사용하는 방법은 jQuery가 제공하는 다른 메서드를 사용하는 방법과 크게 다르지 않다. 그 전에는 .click() 이나 .focus() 메서드를 제공 했으나 이제는 .on()메서드만 사용해야 한다. $('li').on('click', function() { $(this).addClass('complete'); }); .on()메서드를 이용하여 이벤트를 처리 한다. 이 메서드는 두 개의 매개변수를 필요로 한다. 첫 번째 매개변수로는 대응 할 이벤트를 지정한다. 여기서는 click이벤트를 처리한다. ..

자바스크립트 이벤트 요소에 이벤트를 바인딩하는 세 가지 방법 HTML 이벤트 핸들러 전통적인 DOM 이벤트 핸들러 DOM 레벨 2 이벤트 리스너 HTML 이벤트 핸들러 그다지 권장하는 방법은 아니다. 이유 : HTML과 자바스크립트 코드를 분리 시키는 것이 더 좋고, 현재 이 방식을 전혀 사용하지 않는다. 위 코드처럼 사용자가 a 태그를 누를 때, hide() 함수를 호출한다. 전통적인 DOM 이벤트 핸들러 DOM의 최초 명세에서 소개 된 방법이다. 장점으로는 주요 모든 브라우저에서 지원을 한다는 점이다. 그러나, 단점으로는 이벤트 별로 단 하나의 함수만 바인딩 할 수 있다는 점이다. element.onevent = functionName; //이러한 형식으로 작성한다. function checkUser..

웹 페이지 - DOM 트리 문서노드 트리의 최상위에는 문서노드가 존재하며, 이 노드는 전체 페이지를 표현한다. 요소노드 HTML 요소들은 HTML 페이지의 구조를 서술한다. 특성노드 HTML 요소의 여는 태그에는 특성을 지정할 수 있으며, 이런 특성들은 DOM 트리 내에서 특성 노드로 표현 된다. 텍스트노드 일단 요소 노드에 접근하면 해당 요소 내부의 텍스트에 접근할 수 있다. NODELIST : 하나 이상의 요소를 리턴하는 DOM Query참고로, NodeList 객체는 배열과 유사하게 보이며 동일한 방식으로 요소에 번호를 부여하지만 실제로 배열은 아니다. 이 객체는 컬렉션이라고 부르는 타입의 객체이다. Live NodeList 객체를 사용하면 스크립트를 이용하여 페이지를 수정할 때 NodeList 객..

== 연산자 자바스크립트에서 비교 연산자는 다음과 같습니다. == != === !== 다만, 차이가 조금 있다는 것입니다. 하지만, 자바스크립트 핵심 가이드에서는 ===를 사용하도록 권고하고 있습니다. 이유는 === 연산자는 같은 데이터 타입이고, 같은 값일 때 참값입니다. 하지만, == 연산자는 다른 데이터 타입이라면, 타입을 변환하여 비교 연산을 하게 됩니다. 이는 굉장한 손해일 수 있기에 사용하지 않는 것을 권한다는 생각을 합니다. with 문 이는 잘 못보셨으리라 생각합니다. 못 본 이유는 안 좋기 때문이죠. eval 이 또한, 쓰지 않는 것이 좋습니다. 문자열을 자바스크립트 컴파일러에 전달하고나서 결과를 실행하는 함수입니다. 고로, 인수에 대한 문자열에 의존적이고, 권한이 있어 다소 위험합니다...