본문 바로가기
블로그 이미지

방문해 주셔서 감사합니다! 항상 행복하세요!

  
   - 문의사항은 메일 또는 댓글로 언제든 연락주세요.
   - "해줘","답 내놔" 같은 질문은 답변드리지 않습니다.
   - 메일주소 : lts06069@naver.com


javascript23

자바스크립트 정규식 RegExp es6가 나옴에 따라 정규식을 만들어 주는 객체가 한개 생겼다. 정규식을 찾아서 일일이 할 필요가 없는 괜찮은 기능인 것 같다. var re = new RegExp("ab+c"); console.log(re); 생성자에 원하는 값을 넣어주면 자동으로 정규식으로 변환하여 준다. 2019. 4. 27.
자바스크립트 Promise 프로미스는 자바스크립트에서 동기 방식 처리를 위해 생긴 기술이다. 즉, 어떠한 행위를 걸어 놓고선 그 행위가 끝나면 다음 행위를 하라는 기술이다. 간단하게, ajax같은 기술을 사용하면 데이터를 받으면서 다른행위를 할 수 있는 것과 반대되는 개념이다. 1번부터 5번까지의 할 일이 있다면 반드시 1번 끝난 이후에 2번하라 라고 명령을 할 수가 있다. 아래 예제코드를 보면, function method(param){ //함수 선언 return new Promise(function(resolve,reject){ //프로미스 객체로 리턴 내부의 변수는 당연히 바꾸어서 사용 가능하다. if(param != null){ resolve('good working'); //resolve는 프로미스의 고유 기능, 성공시 .. 2019. 4. 27.
Formdata를 활용하여 ajax로 파일전송 하기 jquery.를 활용하다 보면 다량의 파일을 비동기 방식으로 전송해야 되는 요구사항을 많이 만난다. 사용자 입장에서는 화면이 바뀌지 않고 파일만 보내기 때문에 해당 페이지에서의 정보가 바뀌거나 새로고침이 되지 않아서 매우 편리하다. 이를 위해서는 Javascript에서 지원하는 formdata라는 객체를 활용하면 쉽다. //아래 내용이 일반 key, value로 전송되는 값이다. const sendingData = new FormData(); sendingData.append('id',1234); sendingData.append('text','텍스트'); //아래 부분은 input type file에서 파일 데이터를 가져와서 key, value로 전송하는 부분이다. //file1과 file2는 보내는 .. 2019. 4. 26.
Html 캔버스 Hover 이벤트 만들기 Html 캔버스에서는 그림을 그린 다음 그림을 1개의 객체로 보관하는 것이 아니라 그림 통째로 보관한다. 즉, html에서 div태그로 여러가지 그림을 그리면, 각각 이벤트나 움직임을 줄 수 있지만, 캔버스에서는 그렇지 않다. 왜냐하면 캔버스에서 객체는 1개이고, 그림을 사각형, 원형으로 그리더라도 그림1개로 저장되기 때문이다. 이를 해결하기 위해서는 수동으로 만드는 방법 밖에 없다. 원리는 간단하다. 사용자가 그림을 그릴 객체의 정보를 Javascript에서 배열이나 Object로 저장을 하고, 캔버스에서 마우스 이벤트를 감지하여 해당 영역에 값이 들어와있는지 계산하면 된다. const price = [50,50,20]; //x좌표, y좌표, 원 크기 const ctx = $(캔버스)[0].getCon.. 2019. 4. 26.
비동기 방식 프로그래밍, rxjs 앵귤러를 공부하다보니 rxjs라는 기능을 알게되었다. 어떠한 이벤트 관련된 데이터나 스트림 등을 비동기 방식으로 다룰 수 있게해주는 라이브러리 이다. 비슷한 기능으로 예전부터 많은사람들이 애용한 ajax가 있지만 ajax는 tcp통신에서만 사용되던 기능이었지만, 이 rxjs는 단순한 console 같은 기능 또한 비동기 방식으로 지원해준다. 동작원리는, 대상자인 Observer와 관심사인 Observable을 통해서 원하는 동작을 설정하고 subscribe으로 구독하게 하는 방식이라 나와 있다. 간단하게보면..observable은 공장이고 observer는 일할 주체, subscribe는 실행의 느낌인 것 같다. 해당소스코드 출처 https://rxjs-dev.firebaseapp.com/ 해당 소스코드.. 2019. 4. 26.

티스토리툴바