JavaScript5 Syntax Sugar 정리 ref https://dkje.github.io/2020/09/02/SyntaxSugar/ [JS]Syntax Sugar(문법 설탕) - 어? 쓰흡... 하아.... | Dev X dkje.github.io 위 글을 보고 제 나름 정리한 것 입니다. 누군가가 자바 스크립트로 코드를 짜는 것을 보았을 때 엄청 신기한 문법들이 많았습니다. const func = () => { //... } 특히 화살표 함수가 이상하게 너무 멋있더군요 잡소리가 길었습니다. 바로 본론으로 갑시다. Syntax Sugar는 말그대로 문법 설탕입니다. 코드를 읽는 사람 또는 작성하는 사람이 편하게 디자인 된 문법이라는 뜻을 갖고 있습니다. 제가 실제로 많이 쓰고 있는 문법을 정리해보겠습니다. 1. 단축선언 let a,b = 23 .. 2022. 4. 20. 이벤트 버블링, 캡쳐링, 위임 자바스크립트에서 중요한 개념인 이벤트 버블링, 캡쳐링, 위임 복습 ref 자바스크립트 딥 다이브 책이랑 다음 블로그를 읽고 나름 정리한 포스트입니다. https://joshua1988.github.io/web-development/javascript/event-propagation-delegation/ 이벤트 버블링, 이벤트 캡처 그리고 이벤트 위임까지 (기본) 이벤트 버블링, 이벤트 캡처링, 그리고 이벤트 위임까지 이벤트 전달 방식과 관련된 모든 것을 파헤쳐 봅니다. joshua1988.github.io 이벤트 버블링 이벤트 버블링은 이벤트 발생 시 하위 태그에서 상위 태그로 이벤트가 전달되는 것을 뜻합니다. 코드를 봅시다. grandparent parent child document.querySele.. 2022. 3. 11. 화살표함수는 왜 사용하는걸까? 이 포스트는 모던자바스크립트를 공부하고 정리한 것입니다. 화살표함수는 멋있다. const add = (a,b) => a + b; 근데 이거 function 놔두고 왜 사용하는 걸까? 화살표 함수는 콜백함수 내부 this가 전역객체를 바인딩하는 문제를 해결하기 위해 사용한다. 화살표 함수와 일반 함수의 큰 차이는 화살표 함수는 this, arguments, super, new.target의 바인딩을 갖지 않는다. 가장 큰 차이점은 this다. this는 일반함수와 화살표 함수에서 다르게 동작한다. JS에서 this는 타언어와 다르다. this 바인딩은 함수가 어떻게 호출되었는지에 따라 동적으로 결정된다. 함수를 정의할 때 this에 바인딩할 객체가 정적으로 결정되지 않는다. class Prefixer { .. 2021. 12. 22. 함수 선언식 vs 함수 표현식 둘의 차이는 정확히 뭘까???? console.log(add(2,3)); console.log(sub(12,3)); // Variable 'sub' is used before being assigned function add(a:number, b:number){ return a + b; } const sub = function(a:number, b:number){ return a - b; } 함수 선언문은 선언이전에 호출할 수 있고 표현식은 이전에 호출할 수 없다. 이러한 이유는 선언문과 표현식이 함수의 생성시점이 다르기 때문이다. 선언문 선언문은 자바스크립트가 실행되고 있는 시점인 런타임 이전에 자바스크립트 엔진에 의해 먼저 실행된다. 즉 이말은 함수 선언문은 런타임 이전 함수 객체가 먼저 생성이 된다.. 2021. 12. 20. let, const 블록레벨 스코프 var 는 문제가 많다. (한번도 써본적 없지만) var a = 1; var b = 2; var a = 1341; var b; console.log(a); // 1341 console.log(b);// 2 다음과 같이 중복 선언이 가능하다. 동일 변수 이름이 선언되 있는 것을 모르고 선언한면서 값까지 초기화 해준다면 사이드 이펙트가 생기는 부작용이 발생한다. 함수 레벨 스코프 var 키워드는 오로지 함수 코드 블록만 지역스코프로 인정한다. 따라서 함수 외부에서 var로 선언한 변수는 코드 블록 내 선언해도 모두 전역변수가 되어버린다. var s = 23; if(true){ // s는 전역변수 이미 선언된 변수가 있으므로 중복선언 // if 블록안에 새로 선언해도 전역변수 // 이는 사이드 이펙트를 발생시.. 2021. 10. 9. 이전 1 다음
