Seungdols Company

코드스피츠 77 - ES6+ 5회차 (Block, Non-Block & Sync, Async) Block, Non-Block Flow를 막고 있는 것을 Block이라고 하고, 그런 상태를 blocking(상태)로 표현 한다. 업계 표준이 존재함. 그 표준 시간 동안 멈춰 있으면, Blocking/Non-Blocking으로도 볼 수 있다. Flow is blocking for(const i of (function*() { let i = 0; while(true) yield i++; })()) console.log(i); // script timeout // 플랫폼의 안정성을 위해 블록 되는 시간이 길면 강제 종료 시킴. Blocking function 점유하는 시간만큼 블록을 일으키는 함수 const f ..

코드스피츠 77 - ES6+ 3회차 interface 인터페이스란 사양에 맞는 값과 연결된 속성키의 셋트 어떤 Object라도 인터페이스의 정의를 충족시킬 수 있다. 하나의 Object는 여러개의 인터페이스를 충족시킬 수 있다. interface test test라는 키를 갖고 값으로 문자열인자를 1개 받아 불린 결과를 반환하는 함수가 온다. { test(str) { return true; } } interator interface next라는 키를 갖는다. 값으로 인자를 받지 않고, IteratorResultObject를 반환하는 함수가 온다. IteratorResultObject는 value와 done이라는 키를 갖고 있다. 이 중 done은 계속 반복할 수 있을지 없을지에 따라 불린값을 반환한다. ..

코드스피츠 77 - ES6+ 1/2회차 인사이드 자바스크립트, 자바스크립트를 말하다. 좋은 책이나, 3.1버전의 자바스크립트 엔진 기반으로 설명 되어있다. 현대 ES5이후의 자바스크립트 엔진이 달라졌다. 해마다 엔진 스펙이 달라진다. 엔진 스펙을 공부한다고해서 그게 장점이 되지 않는다. 그러면 뭘 배우냐? 작동원리 보다는 자바스크립트 자체의 추상적인 의미나, 체계를 배우는 게 훨씬 이득이다. 자바스크립트 엔진은 statement를 record로 바꿔주고, Record를 처리 하고, 그 다음 Record를 처리 하는 방식으로 동작한다. statement와 record는 대응 된다. Flow control statement들은 Completion Record로 바뀐다. 그리고 Record를 뭘 선택할지 결정..

어떤 언어나 프레임워크와 같이 떠내려가지 않게 근본에 대해 공부해야 한다. 프로그램에도 합리주의, 상대주의 철학이 내포되어 있다. 켄트 벡이 말한 프로그램을 작성하는데 3가지를 내포하고 있어야 한다. 가치 의사소통 단순함 유연함 원칙 지역화 중복제거 대칭성 패턴 개발론 설계론 각종 적용 패턴 동기 돈 시간 위에 대해서 켄트벡의 구현 패턴에서 설명하고 있다. 프로그램을 짰을때, 왜 이렇게 했는지? 설명할 수 있어야 한다. 프로그램이 뭔데? 컴퓨터가 뭔데?를 물어보면 그 사람의 기본 지식을 알 수 있다. Program & Timing Language code - Lint Time Machine language - Compile Time File Load 파일이 컴퓨터 메모리에 적재 메모리에 적재 된 것만 프..

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

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 이 또한, 쓰지 않는 것이 좋습니다. 문자열을 자바스크립트 컴파일러에 전달하고나서 결과를 실행하는 함수입니다. 고로, 인수에 대한 문자열에 의존적이고, 권한이 있어 다소 위험합니다...

왜 코딩 가이드가 필요한가? 잠시만, 생각을 해보도록 하죠. 이는 @Seungdols의 개인적인 생각입니다. 저는 주로 자바 언어를 사용하는 개발자입니다. 자바는 C와 비롯해 블록 스코프를 지원하는 언어입니다. 대개 이런 형태를 띄게 됩니다. if ( seungdols.equals("seungho") ){//K&R 스타일 } if ( seungdols.equals("seungho") ) { } 위 코드처럼 블록을 감싸야 하는 if, for, while, do-while...etc등등 많습니다. 하지만, 어떻게 스타일을 가져가는가? 또한, 가독성이 걸린 중요한 문제라고 생각합니다. 결국, 개발은 혼자 해낼 수 없습니다. 좋은 프로그램은 명확한 가시성을 갖게 됩니다. 이 말은 곧 가독성이 좋아진다는 말이겠죠..