하루에 0.01%라도 성장하자
반응형

Develop/Javascript 5

Event Bubbling, Event Capture

Javascript event 전달 방식 이벤트 전달 방식은 크게 두가지로 구분된다. Event Bubbling 이라고 불리는 방식과 Event Capture. 오늘은 이 내용에 대해 기록하려고 한다. Event란? Javascript 에서 정말 많이 사용되는 click 등 사용자의 입력을 받을 수 있는 기능이다. click 이렇게 설정하면 button을 클릭 하였을때 click 이벤트가 발생하고 clickMe 함수가 실행된다. Event Bubbling Event Bubbling은 하위 요소에서 상위요소로 이벤트가 전달 된다. 위 형태로 태그가 구성되어 있다면 test03을 눌렀을 때 test03 -> test02 -> test01 형태로 발생된 이벤트가 전달된다. Event Capture Event ..

Develop/Javascript 2019.10.16

hls.js 를 이용한 liveStreaming 서비스를 사용할 때 사용할 만한 config!

오늘은 hls.js에 대한 기록이다. https://github.com/video-dev/hls.js video-dev/hls.js JavaScript HLS client using Media Source Extension - video-dev/hls.js github.com hls.js란? 아주 간단하게 HTTP Live Streaming의 약어로 2017년 프로젝트를 하면서 알게되었다. HTML5 Video, MediaSource Extensions이 지원되야만 사용이 가능하다. 시작 사실 오늘 기록할 것은 config에 대한 내용이므로 hls.js를 전반적으로 분석하고 기록하는 것은 아니지만.. 그래도 어떻게 시작하는지는 적어놔야지.. API, docs hls.js 는 docs 정리가 잘되어 있어서..

Develop/Javascript 2019.10.08

DataTable ) data 동적 생성

jquery를 하시는 분들은 DataTable을 사용하는 분들이 계실텐데 ( 모르시는 분은 여기를 클릭해 한번 보세요! ) 데이터 테이블의 예제는 주로 data 값이 정해져 있고 거기에 DataTable을 씌우는(?) 형식의 example이 많다. 예를 들면 아래와 같은 코드이다. 컬럼1 컬럼1 컬럼1 내용1 내용1 내용1 이런식의 테이블이 있으면 이 테이블은 이미 데이터값이 존재하는 테이블이다. 이 코드에 아래코드를 붙여주면 DataTable이 완성된다. $(document).ready(function(){ $('#myTable').DataTable(); }); 그런데 이건 데이터가 있었을 때 이렇게 하는거고 데이터를 서버에 API호출로 받아오거나 DB에서 긁어와야 하는 상황이라면? 어떻게 할 것인가?..

Develop/Javascript 2019.05.29

json index를 이용해 접근하여 가져오기

json을 키값을 이용해서 접근하지 않고 index를 이용하여 접근하는 방법이다. 개발을 하다가 종종 json을 index로 접근하여 사용해야 할 때가 있다. ( 주로 서버에서 json데이터를 잘못 보내서 ;; ) var obj = { "set1": [1, 2, 3], "set2": [4, 5, 6, 7, 8], "set3": [9, 10, 11, 12] }; var index = []; // build the index for (var x in obj) { index.push(x); } // sort the index index.sort(function (a, b) { return a == b ? 0 : (a > b ? 1 : -1); }); 참고 사이트 : https://stackoverflow.co..

Develop/Javascript 2019.05.22

배열

메소드 설명 push(object) 배열의 끝에 요소 추가 pop() 배열의 끝 요소 제거 unshift() 배열의 제일 앞에 요소 추가 shift() 배열의 제일 앞에 요소 제거 splice(index, removeCount, [object]) 여러 개의 객체를 요소로 추가, 제거 slice(index, copyCount) 여러 개의 요소를 잘라내여 새로운 배열 객체 생성 자료 구조에서 Stack, Queue 라는 개념이 있는데, Stack은 계속 쌓이는 형태로 제일 FILO (First In Last Out) 형태를 갖는다. Que는 버스 줄을 생각 하면 되는데 FIFO (First In First Out) 형태를 갖는다. 그래서 우리는 주로 누적 하는 것을 'Stack을 쌓는다' 라고 표현한다. (..

Develop/Javascript 2019.04.30
반응형