본문 바로가기

Frontend/JavaScript30

[ 자바스크립트(JavaScript) ] 메서드 내부 함수에서 this를 우회하는 방법 4가지 📍 메서드 내부 함수에서 this를 우회하는 방법 4가지 만약, scope chain처럼 변수가 없을 때 가장 가까운 스코프의 Lexical Environment를 찾고, 거기도 없으면 상위 스코프를 탐색하듯이 this도 호출 주체가 없을 때는 자동으로 전역 객체를 바인딩하지 않고 호출 당시 주변 환경의 this를 상속하고 싶다면 어떤 방법을 사용할까? 현재 컨텍스트에 바인딩된 대상이 없으면 직전 컨텍스트의 this를 바라보는 것처럼 말이다. 아쉽게도 ES5 까지는 자체적으로 내부함수에 this를 상속할 방법은 없지만 우회하는 방법은 있다. 지금부터 메서드의 내부 함수에서 메서드의 this를 그대로 바라보게 하기 위한 방법 4가지를 알아보자. 그리고 ES6에서 this를 바인딩하지 않고 상위 스코프의 t.. 2021. 9. 8.
[ 자바스크립트(JavaScript) ] 일급객체(First Class Object)에 대해서 간략하게 알아보자 📍 일급객체(First Class Object)에 대해서 간략하게 알아보자 프론트엔드 신입 면접에서 First Class Object가 무엇인지 설명해주세요.라는 첫 질문을 듣고 머리가 벙쪘다. 용어를 들어봤으면 관련된 내용을 쥐어짜내기라도 할 텐데 도무지 생각이 나지 않았기 때문이다. 답답함을 이기지 못하고 면접관분께 시원하게 말씀드렸다. 그런 용어를 처음 듣습니다.. 한글로 쓰이는 말이 따로 있습니까? 공부를 더 해야겠습니다.. 이윽고 면접관님은 웃으며 일급 객체에 대해 자세히 설명을 해주셨다. 마침내 밀려오는 자괴감.. 비록 면접에 떨어진 이유가 일급객체를 몰라서 떨어진 것은 아니지만 JS의 기초적인 내용을 많이 공부해야겠다는 생각이 들었다. 그래서 알아보자 일급객체(First class objec.. 2021. 9. 3.
[ 자바스크립트(JavaScript) ] 이진탐색(binarySearch) 구현방법 📍 binarySearch(이진탐색) 정렬된 리스트에서 원하는 항목을 찾기에 효율적인 알고리즘이다. 이진 탐색을 가장 많이 사용하는 경우는 배열에서 어떤 항목을 찾아야 할 때인데, 예를 들어 1 ~ 100까지의 범위에서 37이란 수를 찾으려면 1부터 100까지 1씩 증가하며 순서대로 찾는 방법이 있지만, 탐색범위를 1/2씩 줄이면서 찾는 방법이 있다. 순서대로 찾을 때는 최악의 경우 100번을 찾아야 하지만 탐색범위를 반씩 줄여 찾아간다면 최대 7번 만에 원하는 값을 찾을 수 있다. 이진 탐색을 코드로 구현하는 방법은 다음과 같다. // while let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; let target = 3; function binarySearch(arr, ta.. 2021. 8. 8.
[ 자바스크립트(JavaScript) ] 객체 메소드(Object Methods)에 대해 알아보자. 📍 객체 메소드(Object Methods)에 대해 알아보자. 기본적으로 원시 타입(Primitive)과 객체(Object)의 근본적인 차이점은 원시타입은 값 자체를 저장 또는 할당하고 객체는 저장되어있는 메모리의 주소를 가리킨다는 점이다. (참고: 코어 자바스크립트) 일반적으로 다음과 같은 코드는 객체의 주소값이 복사된다. 같은 주소를 가리키고 있기 때문에 user의 프로퍼티 값을 바뀌면 자연스럽게 copyUser의 값도 바뀌게 된다.(맨 처음에 언급했던 객체는 같은 주소 값을 가리키고 있는 것을 생각하자.) const user = { name: "안영우", age: 27, } const copyUser = user; user["name"] = "안영준" user["age"] = 14 console.l.. 2021. 8. 1.
[ 자바스크립트(JavaScript) ] var, let, const 변수 차이점과 호이스팅(hoisting), TDZ(Temporal Dead Zone), 스코프 📍 var, let, const 변수 차이점과 호이스팅(hoisting) 일반적으로 var , let , const 라고 할 때의 기본적인 차이점은 대략적으로나마 알고 있을 것이다. (어렴풋이 작성한 나의 글) 간략하게 말하면 var 와 let 은 변수를 선언하고 변수를 할당한 이후에도 값을 변경할 수 있지만(정확히는 var 는 재선언 및 재할당이 가능하고, let 은 재선언은 불가능하지만 재할당은 가능하다.) const는 한번 할당한 값은 다시 바꿀 수 없다. 이렇게 var 변수의 뛰어난 유연성만큼 단점도 있는데,var 문법은 스코프의 범위(정확하게는 함수 스코프)가 넓어서 의도치 않은 버그의 발생원인이 될 수 있기 때문에 이를 해결하기 위해 ES6 문법에 let, const 문법이 추가되면서 var .. 2021. 7. 31.

티스토리툴바