속 깊은 자바스크립트의 6장 : 브라우저 환경에서의 자바스크립트를 요약 단일스레드setTimeout() 시간을 0 으로 설정해 놓는다면 어떤 일이 벌어질까? 직관적으로 바로 시작된다고 생각했다. 물론 맞는 얘기일수도 있다. 하지만 정확히 실행 시간이 아닌 실행 큐에 들어가는 시간을 이야기 한다. 자바스크립트는 단일스레드다. 일하는 놈이 한 놈 밖에 없다. 한 놈이 모든 실행을 처리한다. 이 놈이 일 할 실행 순서를 담아 놓는 큐가 있는데 setTimeout()의 시간설정은 큐에 들어가는 시간을 설정하는 것이다. 만약 setTimeout(func, 0) 으로 실행될 함수 func가 큐에 들어갔는데 그보다 앞서 실행순서를 기다리고 있던 함수들이 있다고 한다면 함수들의 실행이 모두 끝난 후 func가 실행된다..

http://www.jaeminjo.com/post/107109578789/arrayprototypeslicecallarguments 위의 링크에 친절한 설명이 나와 있지만 부가 설명을 해본다. 이것을 이해하기 위해서는 call(), arguments를 이해해야 한다. call()은 상위 context를 변경하는 메서드이고arguments는 함수의 매개변수에 접근할 수 있는 속성이다. 먼저 위의 행위를 말로 설명하자면 이 코드가 존재하는 함수의 매개변수로 넘어온 값들을 array로 변환하겠다는 것이다.function func(a, b){} 에서 a와 b를 arguments[0]과 arguments[1]로 접근가능하다.하지만 여기서 arguments는 array가 아니며 object임을 알아야 한다.(참고..

패턴의 필요성직관은 주로 지난 경험에 기반을 둔다. 훌륭한 개발자는 다양한 경험을 통해서 상황에 맞는 기법을 적절히 구사한다. // 시간에 따라 진화한 코드 ix=0; the_test: if (ix >- myArray.length) { goto then_end; } doSomething(myArray[ix]); ix = ix + 1; goto the_test; // 자바스크립트에 goto 문이 있다고 치자. the_end: // 위 코드보다 개선된 코드 for (ix=0; ix -1 { alert(this.innerHTML); } }, true); }();이벤트 전파를 중단하고 싶다면 event.stopPropagation() 함수를 호출한다. 프락시 패턴하나의 객체가 프락시 역할을 수행하여 상황에 따라..

객체를 바르게 만들기 자바스크립트 패턴과 테스트 3장 요약 원시형 ECMAScript5 기준 : 문자열(String), 숫자(Number), 불(Boolean), null, undefined ECMAScript6 기준 : ECMAScript5 + 심볼(Symbol) 객체 리터럴 다음과 같이 선언한 객체를 말한다.객체 리터럴 { name : 'koko', genus: 'gorilla', genius: 'sign language' } 객체 리터럴을 선언하는 두 가지 방법 1. 단순 객체 리터럴(bare object literal) var koko = { name : 'koko', genus: 'gorilla', genius: 'sign language' } 2. 함수 반환값 객체 리터럴 var amazeTh..

도구 다루기자바스크립트 패턴과 테스트 2장의 내용을 요약한 글 테스팅 프레임워크(TDD)TDD는 코드 결함을 최대한 빨리, 곧 코드 생성 직후 감지하며, 작은 기능 하나라도 테스트를 먼저 작성한 뒤, 최소한의 코드만으로 기능을 구현한다. 테스트를 먼저 작성하란 건 코드의 테스트성을 차후에 두고 볼 문제가 아니라 우선적인 주요 관심사로 생각하는 것이다. 어떤 코드의 테스트 용이성과 그 코드의 테스트가 얼마나 잘 이루어졌는지는 직접적인 상관 관계가 있다. 꼭 필요한 코드만 작성하기작은 기능 하나를 검증하려면 실패하는 테스트를 먼저 작성한 뒤, 테스트를 성공시킬 만큼만 최소한으로 코딩한다. 그 후 내부적으로 구현 세부를 변경하는 리팩토링 과정을 거쳐 개발 중인 코드에서 중복 코드를 들어낸다. 안전한 유지 보수..

아래의 D3 코드를 막힘없이 전부 이해한다면 자바스크립트 고수가 아닐까 싶다. D3 소스 중 일부 var rj3 = {}; rj3.svg = {}; rj3.svg.line = function() { var getX = function(point) { return point[0]; }, getY = function(point) { return point[1]; }, interpolate = function(points) { return points.join("L"); }; function line(data) { var segments = [], points = [], i = -1, n = data.length, d; function segment() { segments.push("M",interpolate..