자바스크립트 궁금증11 1216 / 삼항연산자와 구조분해 삼항 연산자 = 조건연산자 조건 ? truthy 할 때 표현식 : falsy 할 때 표현식 -> 가장 앞부분은 if문에서 소괄호 안의 조건 -> 물음표 다음에는 if문에서 중괄호 안의 코드 -> 콜론 다음에는 else 문의 중괄호 안의 코드와 똑같이 동작 if 문이랑 차이나는 코드 길이 / 삼항 연산자로 더 간결하게 표현할 수 있다. 조건연산자는 표현식이기 때문에 조건에 따라 변수를 선언하거나 / 반복문을 실행할 수 없다. spread 구문 배열을 다룰때 활용 / 여러개의 값을 하나로 묶은 배열을 다시 각각의 개별값으로 펼치는 문법 배열 앞에 마침표 3개 붙임 rest parameter 도 ... 붙이지만 차이점은 rest 는 여러개의 아규먼트를 하나로 뭉치고 spread는 하나의 배열을 여러개로 푼다... 2023. 12. 16. 1214 / 자바스크립트 데이터 타입과 함수 -자바스크립트 데이터타입 -기본형 : 넘버 스트링 불리언 널 언디파인드 / es2015심볼 es2020 빅인트 -참조형 : 오브젝트 es2015심볼 - 유일한 값을 만들 때 es2020 빅인트 - 엄청 큰 숫자를 다룰 때 코드 내에서 유일한 값을 가진 변수 이름을 만들 때 사용 심볼값을 담게 된 user라는 이름의 변수 어떤 값과 비교해도 true가 될 수 없는 고유한 변수가 된다. 빅인트는 자바스크립트에서 아주 큰 정수를 표현하기 위해 등장한 데이터 타입 자바스크립트의 숫자형 값에는 9000조 정도의 정수 표현의 한계가 존재한다 Bigint 타입의 값은 일반 정수 마지막에 알파벳 n을 붙이거나 Bigint라는 함수를 사용 정수를 표현하기 위한 데이터 타입이기 때문에 소수에는 사용 x 소수형태의 결과가 .. 2023. 12. 14. keypress / keydown은 같은가? 키보드 이벤트 자바스크립트를 이용하여 웹페이지 상에서 키보드 입력을 감지했을 때 발생하는 이벤트 keydown / keypress / keyup 이 있다. keypress / keydown은 키를 누른다는 것에 이벤트가 발생하는 건데 어떤 차이가 있을까 https://codepen.io/yamoo9/pen/vRmeQZ DOM API - keydown, keypress, keyup, input 이벤트 간 차이 ... codepen.io 가장 직관적으로 알 수 있는 사이트 keydown 모든 키를 눌렀을 때 발생한다 (물리적으로 어떤 키가 눌렸는지) 방향키와 문자, 숫자, 특수 문자 키를 눌렀을 때 발생 단 문자, 숫자, 특수 문자, enter 키를 눌렀을 때는 연속적으로 발생하지만 그 외의 키를 눌렀을 때.. 2023. 12. 14. data 와 dataset data 어트리뷰트와 dataset프로퍼티를 사용하면 html요소에 정의한다 특정한 데이터를 DOM 요소에 저장해두기 위한 목적. dataset 프로퍼티는 HTML 요소의 모든 data 어트리뷰트 정보를 제공하는 DOMstringMAP 객체 반환한다. data-로 시작하는 속성은 모두 dataset 프로퍼티에 저장되고 element.dataset.데이터명칭 으로 접근 할 일 : 담당자 : 상태 : 대기중 진행중 완료 const fields = document.querySelectorAll('[data-field]'); const btns = document.querySelectorAll('.btn'); for (let btn of btns) { const status = btn.dataset.status.. 2023. 12. 13. 이벤트 버블링과 캡처링 1. 이벤트 버블링 이벤트가 대상 요소에서 시작해 문서 트리의 최상단으로 이동하는 단계 / 하위요소가 상위요소로 다시 올라가는 단계 이벤트가 이동하는 동안 각 부모 요소에서 등록된 이벤트 핸들러가 순차적으로 실행된다. 2. 이벤트 캡처링 이벤트가 문서 트리의 최상단에서 시작하여 이벤트가 발생한 요소까지 이동하는 단계 / 상위에서 하위요소로 향한다. 3. 이벤트 전파 막기 event.stopPropagation() 상위 요소로의 이벤트 전파를 막기 위한 메서 만약 이벤트가 전파되어 상위엘리먼트에서 발생한 이벤트가 하위엘리먼트에서 발생한 이벤트 결과에 의도치 않은 결과를 주는 경우 자주 사용 event.preventDefault() html에서 표준으로 제공하는 태그의 기본 이벤트 발생을 막는 메서드 예를 .. 2023. 12. 12. 이전 1 2 3 다음
