JavaScript
1.[JS] Lottie Javascript Animation
airbnb 에서 만든 라이브러리로 after effects로 추출한 애니메이션 데이터 (json)을 오픈소스를 이용하여 적용할 수 있다
2.[JS] Synchronous vs Asynchronous
말 그대로 동시에 일어난다동시에 일어난다는 것은 request를 보내게 되면 시간이 얼마나 걸리든 그 자리에서 response를 받는다는 의미이다(요청이 있으면 그 요청에 대한 응답은 반드시 받음)synchronous에서 request를 보낸 thread는 respon
3.[JS] optional chaining (?.)
구식 브라우저에서는 지원이 안되므로, 구식 브라우저에서는 폴리필이 필요함optional chaining을 사용하면 property가 없는 중첩 객체를(undefined 이거나 null인 객체) 에러 없이 접근할 수 있음ERROR CASE 1ERROR CASE 2null
4.[JS] About Unicode
String.fromCharCode([ascii code]) 아스키 코드를 넣으면 해당 코드에 맞는 char 값을 return 해준다 charCodeAt([index]) index는 0 이상의 값이 반드시 들어가야하며, 이에 맞는 유니코드를 반환해준다 index에
5.[JS] Host Objects vs. Native Objects
호스트 객체는 런타임 환경에 따라 정의된 객체를 의미한다 (= 브라우저와 node.js 환경에서 사용되는 객체가 다르다)Native Objects가 아닌 객체는 모두 호스트 객체이다전역 객체모든 객체의 유일한 최상위 객체를 의미한다browser: window 객체, n
6.[JS] 동작원리와 비동기처리
자바스크립트는 싱글스레드로 동작하는 언어이다.싱글 스레드는 말 그대로 한 번에 하나의 작업만을 수행할 수 있음을 의미한다.근데 싱글 스레드와는 상반되는 비동기, 동시성(마치 멀티스레드인 것처럼 동작하는 것처럼 보이는 현상), 논블로킹의 개념이 등장한다.이를 설명하기 위
7.[JS] Anti Pattern
몰랐던 패턴을 위주로 작성했다객체나 배열을 생성할 때 리터럴을 사용해야 속도가 증가한다.생성자 함수를 사용했다면, 지역 유효범위에 동일한 이름의 생성자가 있을 수도 있고, 레거시 코드를 물려받을 수도 있기 때문이다.CSS나 자바스크립트 같은 외부 파일을 <head
8.[JS] Promise
js는 비동기 처리를 위해 콜백함수를 사용하지만 뎁스가 너무 깊어지면 콜백 지옥에 빠질 수도 있음또한 에러처리도 힘들 뿐더러 여러 개의 비동기 처리를 한 번에 하는데 한계가 있다이런 콜백 함수의 단점을 보완하기 위해 사용하는 객체를 promise라 한다promise는
9.[JS] Memoization 패턴
함수는 객체이기 때문에 property를 가질 수 있다.예를 들어 각 함수는 어떤 문법으로 생성하든 자동으로 length 프로퍼티를 갖는다. 이 때 length는 함수가 받는 인자의 개수를 의미한다.언제든지 함수에 사용자 정의 프로퍼티를 추가할 수 있다. 함수에 프로퍼
10.[JS] 클로저(Closure)
클로저(Closure)는 외부 변수를 기억하고 외부 변수에 접근할 수 있는 함수를 의미한다.함수 내부에 함수가 존재하는 경우 클로저가 생성된다.자바스크립트는 렉시컬 스코프(lexical scope)를 따르기 때문에 식별자가 현재 스코프에 존재하지 않으면 선언된 위치를
11.[JS] 일급객체 (First Class Object)
다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 가르킨다일급객체가 되기 위한 조건은 아래와 같다변수에 할당할 수 있고 값으로 다룰 수 있다함수의 인자로 사용될 수 있다함수의 결과로 사용될 수 있다위에 대한 조건으로 인해 알 수 있는 것은 함수를 변수에
12.[JS] 호이스팅(Hoisting)
코드 실행 전에 변수나 함수의 선언이 코드 최상단으로 끌어올려지는 듯한 현상을 말한다따라서 변수가 선언되기도 전에 변수를 참조하여 사용할 수 있는 일이 가능하게 되지만 권장하는 방식은 아니다코드의 가독성과 유지보수도 어렵다 하지만 호이스팅을 제대로 모르더라도 함수와 변
13.[JS] this
전역 공간에서 this는 전역객체를 가르킨다.전역객체는 자바스크립트 런타임 환경에 따라 다른 정보를 갖고 있는데, 브라우저 환경에서는 window, node.js 환경에서는 global 이다.위와 같은 결과는 자바스크립트의 모든 변수가 렉시컬 환경의 프로퍼티이기 때문에
14.[JS] 생성자 함수 (constructor function)
객체를 생성할 경우 속성과 메서드의 공통되는 부분을 반복적으로 아래처럼 반복적으로 적어야한다위 3개의 객체는 다른 점은 고작 name 프로퍼티의 값 뿐인데 같은 코드를 여러 번 작성하면 매우 비효율적이다이럴 때 생성자 함수로 구조를 개선할 수 있다js 함수는 재사용 가
15.[JS] 이벤트 버블링/캡쳐링
A에 A 전용 클릭 이벤트 달고, B에 B 전용 클릭 이벤트를 달아놓은 상태였다. (A 이벤트와 B 이벤트는 독립적이다.)문제는 B에서 클릭 이벤트가 발생할 때, A에 걸어놓은 이벤트도 같이 실행됐다.이벤트 버블링 때문에 A 이벤트도 실행된 것처럼 보였다.DOM 트리
16.[JS] indexOf 시간복잡도
백준 1620번 풀다가 아무생각 없이 indexOf 썼는데.. 시간초과로 실패가 계속 떴다.원래 코드전체를 감싸는 for문 시간 복잡도만 생각해서 O(n) 이라고 생각했었는데, indexOf 메서드의 시간 복잡도도 O(n)이라 사실상 O(n^2) 이였다.https&#x