도룩이의 개발일기

JS 이벤트 위임 이벤트 버블링과 캡쳐링을 이용한 방법으로 이벤트 리스너를 해당 요소에 추가하는 대신 그 상위 요소에 추가하여 위임하는 것을 말합니다. 요소가 동적으로 추가될 때 이벤트 리스너가 붙지 못하는 문제를 막아주고, 이벤트 리스터의 남발로 인한 메모리 낭비를 줄여줍니다. 이벤트위임이 왜 필요한지 중요한 예시 juein.tistory.com/63 [javascript]이벤트 위임(event delegation) JS 이벤트 위임 left right 위와 같은 DOM구조에서 각 버튼 클릭시 이벤트가 발생하길 원할 때 const btns = document.querySelectorAll('.btn'); function btnClick(){ console.log(this); } for(let i = 0..

특정 태그가 가진 속성들 예를 들어 id값이나 class명이 가진 값을 알아야하는 경우 사용 가능한 함수입니다. 값을 가져오는 것도 가능하고 지정할 수도 있습니다. 이때 사용하는 함수는 아래와 같습니다. 선택할 요소.getAttribute('값을 불러올 속성') 선택할 요소.setAttribute(''지정할 속성', '지정할 값') [ 1 ] 속성 값 지정 또는 불러오는 예제 보기

www.youtube.com/watch?v=36HrZHzPeuY

자바스크립트를 공부하면서 return은 어떤 반환값을 얻을 때 쓰는 명령어로만 알고 있었습니다. 그러다 스프린트를 진행하면서 반환값이 없는 return; 을 사용하는 케이스들을 접하고 return의 역할에 대해 정리했습니다. return 의 용도 MDN의 설명에 따르면 'return 명령문은 함수 실행을 종료하고 주어진 값을 함수 호출 지점으로 반환합니다.' 라고 되어있습니다. 함수 중단 주어진 값을 함수 호출 지점으로 반환 함수에서 return 명령문에 도달하면 함수의 실행은 그 지점에서 중단되고, 값을 제공한 경우는 함수를 호출한 곳에 그 값을 반환합니다. 이때 값을 명시하지 않으면 undefined를 반환합니다. 아래와 같은 명령문은 모두 함수 실행을 중단합니다. return; return true..

heropy.blog/2018/10/28/regexp/ 정규표현식, 이렇게 시작하자! 매일 쓰는 것도, 가독성이 좋은 것도 아니지만, 모르면 안되는 정규표현식. 저는 이렇게 공부하기 시작했습니다! (자바스크립트를 기준으로 설명합니다) heropy.blog

joshua1988.github.io/web-development/javascript/javascript-basic-summary/#this-%EB%B0%94%EC%9D%B8%EB%94%A9 간단히 훑어보는 자바스크립트 기본기 다지기 (기본) 자바스크립트 입문자부터 숙련자까지 간단히 보기 좋은 요약본 joshua1988.github.io

preventDefault 란? a 태그나 submit 태그는 누르게 되면 href 를 통해 이동하거나 , 창이 새로고침하여 실행됩니다. preventDefault 를 통해 이러한 동작을 막아줄 수 있습니다. 주로 사용되는 경우는 1. a 태그를 눌렀을때도 href 링크로 이동하지 않게 할 경우 2. form 안에 submit 역할을 하는 버튼을 눌렀어도 새로 실행하지 않게 하고싶을 경우 (submit은 작동됨) 1번은 직관적이니까 예시는 생략하고 2번을 예시로 들자면 예시 이러한 구구단의 정답을 받는 form 이 있고, 거기에 EventListener 를 추가해주었습니다. 정답 form 밑에는 resultDiv 가 있어서 정답 여부를 출력하게끔 하였습니다. 이 함수를 실행하면 밑에 정답! 혹은 땡! 이..

방법 1. function 함수이름 {} function fun1() { return true; } function fun1(a,b) { return a+b; } 파싱하는 단계에서 함수가 정의된다. 방법 2. var a = 함수 (익명함수) var fun2_1 = function() { return true; } var fun2_2 = function(a,b) { return a+b; } 변수에 함수를 할당한다. 런타임 단계에서 함수가 정의된다. 그렇기 때문에, 방법 1과 다르게 함수 선언 순서에 따라 함수가 잘 작동하지 않을 수 있다! 방법3. Function을 이용한 객체로서의 선언 var fun3 = new Function("a", "b", "a+b"); 잘 안쓰인다고 한다. 방법4. 화살표함수 v..