시냅스

Proxy Proxy - JavaScript | MDN Proxy 객체는 기본적인 동작(속성 접근, 할당, 순회, 열거, 함수 호출 등)의 새로운 행동을 정의할 때 사용합니다. developer.mozilla.org immer나 state의 불변성 유지를 위해 알아보았다. 기본적인 동작 ( 속성 접근, 할당, 순회, 열거, 함수 호출 등)의 새로운 행동을 정의할 때 사용한다. 선언 new Proxy(target, handler); 예제 var handler = { get: function(target, name){ return name in target? target[name] : 37; } }; var p = new Proxy({}, handler); p.a = 1; p.b = undefined; co..

ECMAScript ECMA-262 기술 규격에 따라 정의하고 있는 표준화된 스크립트 프로그래밍 언어 자바스크립트를 표준화 하기 위해 만들어졌다. Ecma international TC39 committee 에서 표준 기술 제정 TC39 에는 Microsoft, Google, Apple 등 참여 중 현재는 ES2021이 가장 최신 버전, ES2022를 앞두고 있다. 그럼에도 불구하고 우리가 아직도 ES6를 외치는 이유는... ES6 (ES2015) let const Spread syntax Destructuring Assignment let a, b, rest; [a, b] = [10, 20]; console.log(a); // expected output: 10 console.log(b); // exp..

Generator 원하는 만큼 코드 실행을 시작하거나 중지하는 함수 ( 쓰레드 처럼 이용하고 싶은건가...? ) 비동기 코드와 작성하면 효과적!! 용례 function 키워드에 * 을 붙여주고 반환할 콘텐츠에 yeild를 불여주고 next() 로 실행! 콘텐츠를 전부 호출한 이후에 재실행하면 undefined 와 done: true 반환! return을 사용해 값을 전달 후 함수를 종료할 수 있다. throw를 사용해 오류를 잡고 함수 종료! Promise와 함께 사용하면 효과적이다!! const myPromise = () => new Promise((resolve) => { resolve('our value is...') }) function* gen() { let result = "" // 프로미스를..

Symbol 은 항상 고유하다 객체 내부에 같은 키 값이 있다면 Symbol 로 대체 가능하다 단, 이 때 for in 은 사용하지 못하고, Object.prototype.Symbol() 을 이용해서 배열로 반환 받아 map 으로 접근한다. Class 내가 느끼기엔 여타 class와 비슷... 다른 점은 이미 자바스크립트에서도 prototype을 통해 유사한 작업을 할 수 있지만 문법적 설탕(?)을 뿌린 거라고 한다... 호이스팅은 불가하고 이미 선언이 되어있어야 한다. constructor를 포함시킬 수 있고, super 도 사용 가능 static method 를 구현할 수 있고, setter와 getter도 가능 extends 기능을 사용 해 상속받을 수 있다. 그리고 오늘 aws 에 배포하다가 실수..

알고 있다고 생각하지만 항상 모르겠는 3가지 이 기회에 정리하고자 작성합니다. this this를 통해서 특정 스코프를 지정할 수 있는데, 1. 일반 함수의 경우 this 를 사용하면 상위 스코프로 window 객체가 선택될 위험이 상존한다. 2. this를 수동으로 설정하고 싶을 경우 bind()를 사용한다. 3. 화살표 함수를 사용할 경우, this는 상위 스코프에서 상속된다. box.addEventListener('click', function() { this.classList.toggle('opening') setTimeout(function() { this.classList.toggle('opening') // 여기서 this는 window 객체! }, 500) }) const box = doc..