일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- jQuery
- 메서드
- vue
- keycloak
- jpa
- vue.js
- Flutter
- lightsail
- 자바스크립트
- 맥길대학교
- 글로벌
- jsp
- gradle
- 알고리즘
- JavaScript
- nginx
- aws
- REACT
- spring
- arraylist
- 인텔리제이
- ES6
- Docker
- 스프링
- 현장학습
- json
- java
- 에러
- Keycloak 17.0.1
- SpringBoot
- Today
- Total
목록front-end/Javascript, jQuery (13)
korean IT student
URLSearchParams 인터페이스는 URL의 쿼리 문자열에 대해 작업할 수 있는 유틸리티 메서드를 정의합니다. URLSearchParams를 구현하는 객체는 for...of 반복문에 바로 사용할 수 있습니다. 사용 예제 1. URLSearchParams 선언한다. 2. params에 for문을 통해 각각 키값에 담는다. 결과 값 각각 issueIds 파라미터값을 보낼 수 있다. - 참고 https://developer.mozilla.org/ko/docs/Web/API/URLSearchParams URLSearchParams - Web API | MDN URLSearchParams 인터페이스는 URL의 쿼리 문자열에 대해 작업할 수 있는 유틸리티 메서드를 정의합니다. developer.mozilla...
기본적인 callback 함수와 promise를 사용한 함수를 보면 promise를 사용한 함수가 더 직관적으로 보기 편한 것을 알 수 있다. 가장 중요한 차이점은 변수 a 와 변수 b를 로그를 보면 알 수 있듯이 b는 promise를 반환한다. promise는 비동기상황을 일급값으로 다룬다. Promise는 다음 중 하나의 상태를 가집니다. 대기(pending): 이행하거나 거부되지 않은 초기 상태. 이행(fulfilled): 연산이 성공적으로 완료됨. 거부(rejected): 연산이 실패함. Promise의 then을 통해 계속 값을 이어 나갈 수 있다.
키보드 이벤트 - keydown : 사용자가 키를 처음 눌렀을 때 (키가 눌린 동안 계속 발생한다.) - keyup : 사용자가 키에서 손을 뗄 때 - keypress : 사용자가 눌렀던 키의 문자가 입력되었을 때 나타난다. 마우스 이벤트 - click : 사용자가 마우스를 올린 곳에 버튼을 눌렀다 뗄 때 나타난다. - mousedown : 사용자가 마우스 버튼을 누르고 있을 때 - mouseup : 사용자가 마우스 버튼을 뗄 때 - mousemove : 사용자가 마우스를 움직일 때 - mouseover : 사용자가 어떠한 요소에 마우스를 움직였을 때 - mouseout : 사용자가 어떠한 요소 바깥으로 마우스를 움직일때 포커스 이벤트 - focus, focusin : 포커스를 얻었을 때 - blur, ..
JSON.stringify() 와 JSON.parse()를 알아보자. JSON.stringify()은 JSON 객체를 문자열로 변환시켜 준다. JSON.parse()은 반대로 생각하면 된다. 문자열 -> JSON 객체 먼저, test1변수에 자바스크립트 객체를 선언한다. data 변수에 stringify()메서드를 사용하여 결과값을 보자. data변수에 JSON형식의 문자열로 바꿘것을 확인할 수 있다. data2 변수에 parse메서드를 사용하면 결과값에 문자열에서 JSON객체로 변환 것을 확인할 수 있다.
기본 toString 처럼 했다면 toString2처럼 간편하게 사용 할 수 있다.` (백틱) 이라는 기호 인데 Tap위에 있는 것이다. 변수들은 ${ } 감싸주면 된다.
ES6에서는 간편하게 메서드를 추가할 수 있는 문법이 생겼다.test1과 test2의 차이점을 보면 알 수 있다. (메서드 사용법)
1. .before() - 선택된 요소 전에 콘텐츠를 삽입2. prepend() - 선택된 요소의 여는 태그 다음에 콘텐츠를 삽입3. append() - 선택된 요소의 닫는 태그 전에 콘텐츠를 삽입4. after() - 선택된 요소 다음에 콘텐츠를 삽입 ex) $(function() {$('li').before(' 테스트');$('li').prepend('+');$('li').append('-');$('li').after(' 입니다.');}); result) 테스트+test-입니다.
문자열 값을 다룰 때 주로 String 객체의 속성이나 메서드를 사용한다. 또한 String 객체는 전역 객체 이므로 스크립트의 어디서나 사용 가능하다.문자열 내의 각문자에는 인덱스 번호라고 부르는 번호가 자동 생성 예제를 보며 이해를 하자.
Node 객체- 모든 DOM객체는 Node 객체를 상속 받는다. 관계 API- 엘리먼트는 서로 부모, 자식, 혹은 형제자매 관계로 연결되어 있다. 각각의 Node가 다른 Node와 연결된 정보를 보여주는 API를 통해서 문서를 프로그래밍적으로 탐색할 수 있다. Node.childNodesNode.firstChildNode.lastChildNode.nextSiblingNode.previousSiblingNode.contains()Node.hasChildNodes() 노드의 종류Node 객체는 모든 구성요소를 대표하는 객체이기 때문에 각각의 구성요소가 어떤 카테고리에 속하는 것인지를 알려주는 식별자를 제공한다. Node.nodeType -노드의 종류에 따라서 정해진 상수가 존재한다.for(var name i..