JavaScript
-
자바스크립트 array 를 object, Map 으로 변환하기JavaScript 2021. 4. 27. 17:55
코틀린을 쓰다보면 associate 메소드를 이용하여 리스트를 맵으로 쉽게 바꾸어 사용합니다. js, ts 에서는 코틀린의 associate 처럼 메소드로 제공되어 있지는 않지만 reduce 메소드를 이용하여 변환할 수 있습니다. const array = [ {key: 'a', value: '1'}, {key: 'b', value: '2'} ] const arrObj = array.reduce((newObj, obj) => { newObj[obj.key] = obj.value; return newObj; }, {}); console.log(arrObj);출력된 결과는 다음과 같이 object 로 생성되었습니다. 같은 방식으로 object 가 아니라..
-
JavaScript - 이미지 업로드 미리보기 만들기JavaScript 2019. 3. 9. 14:56
input 태그에서 선택한 이미지를 화면에 바로 출력하도록 해보자. 코드 input 태그에서 onchange 속성에 실행될 메소드를 정해줍니다. 메소드 내에서 FileReader 객체를 생성하고 onload 됐을 시 발생할 이벤트를 작성해줍니다. FileReader 가 로드 됐을 때 img 엘리먼트를 생성하고 src 속성을 설정해줍니다. 그리고 이미지가 들어갈 div에 넣어줍니다. 리더에서 input 태그에서 선택한 파일을 읽어오도록 설정합니다. 실행 화면 여러 이미지 미리보기 input 태그에 multiple 속성을 추가해주었고 setTumbnail 메소드 안에서 반복문을 돌려서 미리보기를 설정합니다.
-
카카오 API 로 책 정보 검색 하기JavaScript 2019. 2. 1. 15:57
카카오 API 를 사용하기 위해서는 우선 등록해야 한다. 카카오 디벨로퍼 에 들어가서 아래 쪽에 앱 개발 시작하기를 눌러 등록 후 앱 만들기를 눌러서 애플리케이션을 하나 만들어 주면 사전 설정이 끝난다. 카카오에서 제공하는 개발가이드를 확인해보자. 우리는 REST API 중 검색 API를 이용할 것이다. REST API 개발가이드 REST API 책검색 를 보면 Request 에 들어가는 값 과 Response 로 받아오는 JSON 객체의 내용이 나온다. 이제 코드로 작성해보자 이런 책 데이터를 입력 하는 폼에서 ISBN 을 검색해서 나오는 책 데이터를 자동으로 폼에 넣어볼 것이다. ISBN 에 있는 검색 버튼을 누르면 함수가 작동하도록 button 태그에 onclick="searchISBN($('#is..