최근에 면접을 보면서 This에 대한 심화 질문이 나왔다. 문서에도 몇 번 적었던지라, 자신있게 대답했는데 아뿔싸 완벽하게 이해하지못해 많이 헤매었다. 일단 This가 Javascript에서 어떻게 동작하는지 알아보자. Javascript에서 This는 호출 방식에 따라 참조되는 값이 달라진다. 1. Object 메소드에서의 This Object Method 형태로 this를 호출하면, this는 자신의 객체를 참조하게 됩니다. 예제 1 예제 2 - 자신이 속해있는 객체에 대해서만 참조한다. 2. 함수 선언문에서의 This 함수 선언문에서 this를 호출하면, this는 global을 참조하게 됩니다. 예제 1 예제 2 - 정말로 다양하게

2019년 11월 22일, 내가 처음으로 프론트엔드 개발자로서 회사에 취업하게된 날이다. 당시 나는 웹개발에 대한 기초 지식이 많이 부족한 상태였고, 지금 생각해도 입사에 운의 요소가 많이 작용했던 것 같다. 수 년이 지난 지금, 과연 나는 JS를 잘알고 있는 걸까? 그 동안 다른 회사에 면접을 여러 번 보았지만, 그다지 어려운 면접 질문을 받은 기억은 없었다. 다만, 대한민국에서 개발자라면 누구나 가고 싶어하는, 네카라쿠배의 면접 질문도 과연 문제 없을까? 아무래도 꼬리에 꼬리를 무는 질문이 많을 것이다. 본고는 그러한 질문에 대해 대비를 하기 위해 작성을 하는 것이며, 이 과정에서 내 자신을 시험해보고자 한다. 또한 그 동안 해당 Velog를 통해 여러 면접 질문을 대비할 수 있는 포스트를 여럿 출간

왜 이 글을 쓰게 되었는가.. 얼마 전에 기술 면접을 보게 되었다. 많은 기술 블로그를 보며 면접 관련 문서를 작성하였지만 면접관 분께서 TDZ를 설명하라는 말을 들었을 때 순간 잘못 알아 들었다고 착각할 만큼 생소한 단어였다. Javascript 면접 질문 -1- Javascript 면접 질문 -2- Javascript 면접 질문 -3- [프론트엔드 개발자 면접 준비 (Javascript)](https://velog.io/@lucas/%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%E

본고에서는 자바스크립트의 실행 컨텍스트의 의미와 동작 방식을 설명한다. 1. 실행 컨텍스트가 정확히 무엇인가? ECMAScript 스펙에서는 실행 컨텍스트를 다음과 같이 설명하고 있다. > 실행가능한 코드를 형상화하고 구분하는 추상적인 개념 실행 컨텍스트는 자바스크립트 코드 동작의 근간을 설명하며, 이를 통해 자바스크립트의 특성(호이스팅, 클로저)을 이해할 수 있게 된다. 자바스크립트 엔진은 우리가 작성한 코드를 실행하기 위해 여러가지 정보를 알고 있어야 한다. 여러가지 정보란 이하와 같다. > - 변수 : 전역변수, 지역변수, 매개변수, 객체의 프로퍼티 > - 함수 선언 (함수 표현식을 포함하지 않음) > - 변수의 유효범위 (Scope) > - this 이와 같이 실행에 필요한 정보를 형상화하고 구분하기 위해 자바스크립트 엔진은 실행컨텍스트(EC)를 객체의 형태로 관리한다. 아래의 코드를 살펴보자. 위 코드를 실행하면 아래와 같이 동작하게 되는데, 먼저 g

Function.prototype.bind이 무엇인가? MDN에서는 하기와 같이 설명한다. >bind() 메소드는 호출될 때, this 키워드가 주어진 인자 값으로 설정되고, 새로운 함수가 호출될 때, 앞 쪽의 매개변수도 자신의 인자를 사용해 미리 순서대로 채워놓은 새로운 함수를 반환합니다. 다른 함수로 전달하고자하는 클래스의 메소드에서 this의 값을 바인딩할 때, 가장 많이 사용되는 것 같습니다. 이는 React 컴포넌트에서 자주 사용됩니다. Feature detection, Feature inference, UA String의 차이점이 무엇인가? 1. Feature Detection Feature Detection은 부라우저가 특정 코드 블록을 지원하는지 여부에 따라 코드를 실행하도록 하여, 일부 브라우저에서 항상 오류 대신 무언가 작동하도록 합니다. Modernizr은 Feature detect