분류 전체보기 180

[js] api를 이용하여 정보 얻어내기 (jquery, json 활용)

API 데이터 제공 사이트 >> 공공데이터포털 data.go.kr data.jsp JSON Data List No 관할 경찰서 다발지역위치 경상자수 data.js $(document).ready(function(){ $.ajax({ //ajax 옵션 설정 url:"http://apis.data.go.kr/B552061/jaywalking/getRestJaywalking?serviceKey=발급받은key", type:"GET", dataType:"json", success:function(data){ let api_data=""; $.each(data.items.item, function(key, value){ api_data += ""; api_data += ""+key+""; api_data += ""..

JAVASCRIPT 2022.02.05

[디자인패턴] 어댑터 패턴 (Adaptor Pattern) 예시 - 개발자 배찌

어댑터 패턴이란? 호환성이 없는 인터페이스 때문에 함께 동작할 수 없는 클래스들이 함께 작동하도록 해주는 패턴이 어댑터 패턴 어댑터패턴 구조 public class First implements A { private B b; First(B b) { this.b = b; } @Overrridng public display() { b.func(); } } 어댑터패턴 예시 public class AdapterPatternDemo { public static void main(String[] args) { AudioPlayer audioPlayer = new AudioPlayer(); audioPlayer.play("mp3", "beyond the horizon.mp3"); audioPlayer.play("mp..

DESIGN PATTERN 2022.02.03

[디자인패턴] 스트래티지 패턴(Strategy Pattern)이란? - 개발자 배찌

스트래티지 패턴이란? 행위를 클래스로 캡슐화해 동적으로 행위를 자유롭게 바꿀 수 있게 해주는 패턴 - 인터페이스 : 기능에 대한 선언과 구현 분리 : 기능을 사용하기 위한 통로 - 델리게이트 : 위임하다 - 스트래티지 패턴 : 여러 알고리즘을 하나의 추상적인 접근점을 만들어 접근점에서 서로 교환 가능하도록 하는 패턴 참고내용>> https://gmlwjd9405.github.io/2018/07/06/strategy-pattern.html [Design Pattern] 스트래티지 패턴이란 - Heee's Development Blog Step by step goes a long way. gmlwjd9405.github.io

DESIGN PATTERN 2022.02.03

[JS] JSON 데이터를 웹페이지로 출력하기

test.htm 클릭하세요! OO 도서 이벤트의 댓글 참가자와 당첨자를 볼 수 있습니다. test.js window.onload = () => { document.getElementById( 'btn' ).addEventListener( 'click', function() { let json = { "book": [ { "isbn": "123-456-789", "author": { "name": "홍길동", "email": "hong@hongkildong.com" }, "editor": { "name": "이순신", "email": "lee@leesoonsin.com" }, "title": "대한민국의 정의는 죽었는가?", "category": [ "Non-Fiction", "IT", "Politics"..

JAVASCRIPT 2022.01.07

[JS] JSON.parse(), JSON.stringify() _객체와 문자열로 변환하기

[1] : JSON.parse( jsonText ) --> JSON 형식의 텍스트 --> 객체로 변환. let jsonText = '{ "name": "홍길동", "age": 20, "nationality": "대한민국" }'; console.log( "변환전 --> " + typeof jsonText ); // string const jsonObj = JSON.parse( jsonText ); console.log( "변환후 --> " + typeof jsonObj ); // object console.log( '--------------------------------------------------' ); console.log( jsonObj.name ); // 홍길동 console.log( jso..

JAVASCRIPT 2022.01.07

[JS] 중첩된 JSON 데이터 다루기

Q. 한 권의 도서 정보를 갖고있는 JSON 데이터에서 해당 도서가 속해있는 카테고리를 출력하시오. [1] : 중첩 데이터 window.onload = () => { const book = { "isbn": "123-456-789", "author": { "name": "홍길동", "email": "hong@hongkildong.com" }, "editor": { "name": "이순신", "email": "lee@leesoonsin.com" }, "title": "대한민국의 정의는 죽었는가?", "category": [ "Non-Fiction", "IT", "Politics" ] } console.log( book["author"].name ); // 홍길동 console.log( book["edito..

JAVASCRIPT 2022.01.07

[JS] JSON 데이터를 다루기위한 JS 기본 사용법

[1] : 데이터 const person = [ { "name": "홍길동", "age": 20, "nationality": "대한민국" }, { "name": "이순신", "age": 30, "nationality": "미국" }, { "name": "강감찬", "age": 40, "nationality": "영국" }, { "name": "을지문덕", "age": 50, "nationality": "프랑스" } ]; [2] : 출력 console.log( '---------------------------------------------' ); console.log( person[3].name + " " + person[3].age + " " + person[3].nationality ); [3] :..

JAVASCRIPT 2022.01.07

[JS] JSON 객체 vs JSON 배열

JSON을 많이 쓰는 이유? --> 데이터를 전달하고, 교환하고, 저장할 때 --> 가볍고, 텍스트기반, JS 기반. [1] : JSON 객체 --> 중괄호 { } 사용. JSON에서 객체(Object)란? --> key : value의 한 쌍으로 이루어진 정렬되지 않은 속성(property)들의 집합. 콤마(,)로 구분하여 여러개의 속성을 가질 수 있다. 문자열은 반드시 큰따옴표("")로 묶어준다. { "name": "홍길동", "age": 20, "nationality": "대한민국", "hobby": "영화보기" } [2] : 객체안의 객체 --> 계층적 구조. { "group1": { "name": "홍길동", "age": 20, "nationality": "대한민국", "hobby": "영화보기..

JAVASCRIPT 2022.01.06

[spring] 인터셉터(interceptor)

인터셉터 인터셉터는 스프링 MVC 구조에 특화된 필터 기능을 제공한다고 이해하면 된다. 스프링 MVC를 사용할때, 필터 보다는 인터셉터를 사용하는것이 더 편리하다. **로그 찍는 인터셉터 예시 @Slf4j public class LogInterceptor implements HandlerInterceptor { public static final String LOG_ID = "logId"; @Override public boolean preHandle(HttpServletRequest, HttpServletResponse response, Object handler) throws Exception { String requestURI = request.getRequestURI(); String uuid =..