글

라벨이 this인 게시물 표시

개발팀장이 되면서 겪게된 점들 1

이미지
                                                         <팀원을 모집하기 위해 고군분투하는 모습이다. > 첫 한달  개발팀장을 맡다 2021년 5월 , 기존에 있던 CTO분이 휴직(개인사)을 하게 되면서    개발에 대한 모든 권한을 내게 일임하였다.   개발에 대한 모든 의사결정을 전부 내게 맡긴 것으로 ,   어느 정도 규모가 있는 회사의 의사결정권한을 갖게 된 것은 그만큼 내게 큰 신뢰가 있었음을   알수 있게해주는 대목이었다. 그러나 전혀 예측하지 않았던 상황이기에 준비가 되어있지 않았던만큼 처음에는 삐걱거렸다. 가장 첫번째로 어려움을 겪었던 것은 업무의 배분이었다.   관리자가 되니까 해야할일은 업무를 만들고 또 그것을 팀원들에게 분배하고 잘 되고있는지 취합하고 관리감독을 하는것이었다.   군 시절 장교로 복무하면서 겪어봤던 일이긴 했지만, 군복무 당시에도 그닥 잘 하지는 않았던 것 같다.   그럼에도 어쨌든 전반적인 시스템을 이해하고 있었고, 어떻게 구현해야할지에 대해서는 어느정도 경험이 쌓여있었기때문에 큰 문제가 없을 줄 알았다.   실무자로 일을 할 때에도 항상 업무를 받아서 하지는 않았다. 스스로 돌이켜보건대, 나는 주어진 업무가 없으면 스스로 만들어서 제안하고 기획하여 업무를 진행했다.  조그마한 스타트업이었던 첫 회사에서부터  내가 할일은 내가 만들어서 곧 잘했다. 어떤 큰 방향만 정해져있다면 그건 큰 어려움은 아니었다. 나에게 일은 항상 있었다.   매니저가되면서 달라진게...

[Javascript 이해]this에 대하여 4

이미지
시작하며 this에 대하여 1  Lexical Environment  this에 대하여 2  Scope Chain & Closure this에 대하여 3  함수 호출 방식에 따라서 this에 대하여 4  화살표 함수 드디어 this 이해에 대한 종착점에 다다렀다. 이번 포스트에서는 ES6 스펙을 살펴보면서  이런 골칫덩어리 this를 어떤식으로 해결하려 했는지를 파악해본다.  => 화살표 함수에서 this의 의미는 ?? => (화살표)  함수는 기존의 function를 비교했을때 단순히 표기법만 바뀐 것이 아니다.  화살표 함수와 기존의 function()은 여러가지 다른점이 있지만 우리는 this에 대해서만 집중하도록 하자.  2가지만 확실히 알아두면 된다. 첫째, 기존에 function은 thisBinding이 이뤄지는 시점이 호출되는 시점이라고 이야기를 했었다. 화살표함수는 호출되는 시점에 thisBinding 대상을 문맥에서 찾는다.  화살표함수 자신을 감싸고 있는 문맥(스코프)의 this를 바인딩한다는 것이다.  완벽하게 맞지는 않지만 쉽게 기억할 수 있는 방법으로 설명을 하자면, 기존 처럼  호출 시점에 호출한 대상을 바라보는것이 아니라,  자신이 어디에 존재하는지, 어디서 정의되었는지 를 파악한다고 보면 편하다.  자바같은 객체지향 언어에서 흔히 볼 수 있는 환경이다.  둘째, 화살표함수는 이름이 없는 익명함수이다. 익명함수는 이름이 없기때문에 변수에 담아두는 행동은 잘 하지 않는다. 그만한 이유가 있는데 바로 this 바인딩과 관련이 있기때문이다.  (즉 매 콜백함수로 많이쓰임) .  바로 이전 포스트 마지막부분에 추가를 했었는데, 익명함수는 이름이 없는 내부함수와 같다. 이해를 돕기위해 짤막한 코...

[javscript 이해]this에 대하여 3

이미지
시작하며 this에 대하여 1  Lexical Environment  this에 대하여 2  Scope Chain & Closure this에 대하여 3  함수 호출 방식에 따라서 this에 대하여 4  화살표 함수 우리의 목적은 this를 이해함으로써, 헷갈리지 않고 this의 범위를 예측 하는 것이었다.  이전 포스트에서 실행환경(Execution Context) 과 언어적 환경(Lexical Environment)을 이야기 했었는데, 이 두가지를 잘 사용하면 된다!  이 부분이 이해가 안된다면 계속 읽고, 연구하고, 연습해봐야 한다. this의 범위를 아는 것은 자바스크립트를 다룰줄 아는 개발자라면 필수적으로 알아야 하는 부분인 것 같다고 생각한다. (한 줄 팁)  함수가 호출될 때 왼쪽에 객체가 있는지만 살펴보면 this가 어디에 바인딩되는지 알 수 있다. (예를 들어 object.function() 인지, function() 단독 호출인지만 보면 된다는 것) 자바스크립트에서 함수가 호출될 수 있는 패턴을 살펴보고, 실전예제를 통해 직접 예측해보자. 이번 포스트의 목차는 다음과 같다. 메소드 호출 패턴 함수 호출 패턴 생성자 패턴 apply 호출 패턴 콜백 패턴 1. 메소드 호출 패턴 함수가 어떤 객체의 속성에 있는 경우 특별히 메소드라고 부른다.  아래 코드를 준비했다. 그림 1 testObject 는 2개의 멤버가 있는데, 그중 하나가 함수형태로 표현된 method 라는 이름을 가지고 있는  메소드이다. 객체의 속성을 불러오는 방법은 마침표 . 연산자를 이용하거나, 대괄호 [] 안에 해당 속성과 일치하는 이름을 입력해주면 된다.  그럼 우리가 알고싶은 this가 어디에 바인딩 되는지 살펴본다 그림2 2개의 객체를...

[javascript 이해] this에 대하여 2

이미지
시작하며 this에 대하여 1  Lexical Environment  this에 대하여 2  Scope Chain & Closure this에 대하여 3  함수 호출 방식에 따라서 this에 대하여 4  화살표 함수 우리는 이전 포스트 에서 this의 세부적인 움직임을 알아보았다. 이번 포스트에서는   -Scope Chain 을 통해 this의 올바른 참조법을 알아본다.  Closure가 어떻게 동작하는지 EC 와 LE을 통해 구체적으로 뜯어본다.  -reference http://hanmomhanda.github.io/2016/01/16/JavaScript-%EC%8B%9D%EB%B3%84%EC%9E%90-%EC%B0%BE%EA%B8%B0-%EB%8C%80%EB%AA%A8%ED%97%98/ 흔히 스코프 체인이라고 하는 것은 ES3에서는 스펙에 정식으로 존재했던 용어인데, ES6에서는 스코프 체인이라는 용어는 존재하지 않는다. 정식 용어라고까지 할 수는 없겠지만, ES6에서는 스코프 체인 대신에 Lexical nesting이라는 표현을 쓴다. 체인 보다는 중첩에 더 의미를 두려는 것 같다. 어차피 정식 용어가 없으므로 여기서는 편의상 스코프 체인이라는 용어를 그대로 쓰기로 한다. 우선 예제를 먼저 보자.  var   wow  =  "wow1" ;                       // 전역변수 var   testObject  = {      thisMember:   "test" ,      } testObject . foo  =  f...