인문학적 공학도

기본 개념 - heap: object, function등의 동적인 메모리 할당 - stack: primitive data, references pointing to the real objects 등의 정적인 메모리 할당. 더 안전 1. reference-counting: js는 더이상 사용하지 않는 object에 대해 gc 실시. circle reference에 대해서 취약. 2. mark-and-sweep: root object로부터 지정된 하위 object까지 도달가능 여부를 따짐. node.js의 경우 new space와 old space의 두 부분으로 나뉩니다. 이름에서 알 수 있듯이, 전자는 새로운 개체(젊은 세대)가 할당되는 위치이고 후자는 오랜 기간(구세대) 동안 생존한 개체의 대상입니다. ..

배열에 원소를 추가할 때 unshift를 쓰곤 한다. arr = [2, 3, 4] arr.unshift(1) arr.unshift(0) console.log(arr) // [0, 1, 2, 3, 4] 그러나 unshift는 다음과 같이 배열의 값을 직접 참조하여 원본 배열에 변형을 일으키는데, 불변성의 이슈에서나 성능 상의 이유에서나 좋지 못하다. arr = [2, 3, 4] // 0: 2, 1: 3, 2: 4 arr.unshift(1) // 0: 1, 1: 2, 2: 3, 3: 4 arr.unshift(0) // 0: 0, 1: 1, 2: 2, 3: 3, 4: 4 보시다시피 배열의 원소와 인덱스의 연결이 전부 끊어지고 새로운 값이 할당된다. 중간에 새로운 원소가 끼어들거나, 최악의 경우 첫 번째에 새로..

네이버에서 일할 당시 알 수 없는 버그 때문에 곯머리를 앓은 적이 있다. forEach 내에서 루프를 돌며 비동기 구문을 처리하려 했다. 대강 이런 식의 코드였다. console.log("start Analysis") ... urls.forEach(url => { const screenEmulation = ... await exec( ... ) .then((message) => { logger.debug(message) }) .catch((error) => { logger.debug(error) }) }) ... console.log("finish Analysis", Date()) 그러나 순서대로 작동할 것이라는 예상과는 달리 콘솔에는 다음과 같이 출력이 됐다. start Analysis finish A..

한창 취준을 하면서, 연습삼아 여기저기 인터뷰를 보고 있다. 오늘은 화상통화를 하며 1시간 동안 js와 react 문제를 해결하는 형식의 인터뷰를 진행했다. 그리고 1번으로 나온 문제다. for (var i = 0; i < 10; i++) { setTimeout(function() { console.log(i); }, 10); } 늘상 코딩테스트 단골문제로 나온다고 다른 블로그에서 스치듯 지나간 문제이다. 언뜻 보기에 별 문제없는 코드이고 정상적으로 0부터 9까지 출력될 것 같다. 그러나 실상은 다르다. 제대로 된 원리를 알지 못해 미심쩍어하면서도 0~9를 적은 본인을 탓하며, 왜 이렇게 돌아가는지 조사해보았다. 간단하게 말해보자면 setTimeout 내의 callback 함수는 모든 함수가 종료되고 난..

https://thisishost.org:80/module/1?id=1#bookmark window.location 객체로 현재 브라우저의 url에 참조할 수 있다. url part property 의미 https:// protocol 해당 브라우저와 웹 서버의 통신 규약 thisishost.org host URL의 도메인 부분 :80 port URL의 포트 번호 부분 /module/1 pathname '/' 문자 뒤 URL의 경로 ?id=1 search '?' 문자 뒤 URL의 쿼리스트 #bookmark bookmark '#' 문자 뒤 URL의 프래그먼트 식별자 자세한 내용은 MDN Location에서 확인하자.

참조prototype, __proto__에 관하여 prototype, __proto__에 관하여 프로토타입 개념에 관한 도식이다. Constructor 생성자함수로 instance를 생성한 경우 Constructor의 프로퍼티인 prototype가 instance의 __proto__라는 프로퍼티에 전달이 된다. 그럼 prototype은 무엇일까? co.. student513.tistory.com prototype, __proto__에 관하여 프로토타입 개념에 관한 도식이다. Constructor 생성자함수로 instance를 생성한 경우 Constructor의 프로퍼티인 prototype가 instance의 __proto__라는 프로퍼티에 전달이 된다. 그럼 prototype은 무엇일까? co.. stu..

참조: prototype, __proto__에 관하여 Object로부터 상속받는 생성자함수의 prototype prototype은 객체형태이기 때문에 Object라는 생성자로부터 상속을 받는다. 이 경우 Object의 prototype 입장에서 Array의 prototype은 __proto__으로 취급되는 것이다. 각 변수는 생성자 함수가 존재하며, 각 데이터타입에 해당하는 메소드가 정의되어있어, 메소드를 사용하려 할 때 해당 변수는 자동으로 instance로 변환된다. Array 뿐만 아니라 Number, String, Boolean 등에 대해서도 동일하게 적용된다. Object 생성자 함수는 누구로부터 상속을 받을까? 그렇다면 다른 생성자들의 부모격인 Object의 prototype은 어떤 상속구조를..

프로토타입 개념에 관한 도식이다. Constructor 생성자함수로 instance를 생성한 경우 Constructor의 프로퍼티인 prototype가 instance의 __proto__라는 프로퍼티에 전달이 된다. 그럼 prototype은 무엇일까? console.dir로 Array 생성자를 출력해보았다. 많은 메소드들 중 prototype이 보인다. Array 생성자로 생성한 인스턴스인 배열은 __proto__에 prototype의 메소드들을 포함하게 되는 것이다! arr라는 배열을 생성하여 콘솔에 출력해보니 Array의 prototype과 똑같은 __proto__라는 객체가 출력이 되는 것을 알 수 있다. arr라는 instance는 Array 생성자로부터 메소드를 상속받게 된 것이다. Array:..

"지역변수가 함수 종료 후에도 사라지지 않게 할 수 있다." 라고 한다. 이해하고 나면 알겠는데, 설명하기는 참 까다로운 개념이다. 일단 코드부터 보자 var outer = function (){ var a = 1; var inner = function(){ return ++a; }; return inner; } var outer2 = outer(); console.log(outer2());// 출력: 2 console.log(outer2());// 출력: 3 var outer2에 할당된 값은 함수 outer의 반환값 inner이다. var inner = function(){ return ++a; }; 딱 요 부분만이 outer2에 할당되는 것이다. 그런데 inner에 할당된 함수 내에 a라는 값은 선언..

함수가 자신의 인자로 다른 함수를 받을 때, 인자로 넘겨진 함수를 callback 함수라고 한다. callback함수는 자신을 인수로 받은 함수에게 제어권을 넘겨준다. 제어권에는 세 가지가 있다. 실행시점에 관한 제어권: 어떤 시점에 콜백함수를 호출할지 인자에 대한 제어권: 인자에는 어떤 값들을 넘겨줄지 this에 대한 제어권: this에 무엇을 바인딩할지 실행시점에 대한 제어권 실행시점을 제어하는 것으로 흔히 예를 들 수 있는 함수는 setInterval과 setTimeout이 있다. MDN의 setTimeout의 표준 사용법을 보자. window.setTimeout(func[, delay, param1, param2, ...]); [ ] 대괄호 안의 인자는 넣어도 되고 안 넣어도 되는 인자들이다. 맨..