Search

반응형

'신기한연구소'에 해당되는 글 287건

  1. 2021.03.01 [ jQuery/javascript]jQuery 기본 사용법에 대해 알아봅니다. 1
  2. 2021.02.21 [자바/java]파일 읽기를 위해 I/O Streams 중 Character Streams(문자열 스트림)에 대해 알아봅니다.
반응형

안녕하세요. 신기한 연구소입니다.

오랜만에 프로젝트에 투입되었는데 jQuery를 사용하네요. ㅎㅎ

사용한 지 오래되어서 기억이 가물거립니다.

복습도 할 겸 포스팅을 해봅니다.

사실 일하면서 보려고 쓰는 겁니다. ㅎㅎ

최근에 딥러닝(deep learning) 공부를 하고 있었답니다.

누군가 그러더군요.

개발자가 딥러닝을 왜 공부하냐고. 

개발자는 라이브러리 사용법만 익혀서 적절히 사용하면 된다면서

굳이 수학적으로 분석하고 공부할 이유가 없다고 하더군요.

jQuery도 같은 맥락이 아닐까 싶네요.

복잡한 자바스크립트(javascript)를 이리저리 테스트하고 사용하면서 시간낭비를 하는 것보단

jQuery 라이브러리로 간단하게 해결하면 효율적이라는 겁니다.

자바스크립트(javascript)로 길게 코딩할 필요 없이 간단히 jQuery 라이브러리로 정리한다면

그나마 칼퇴근에 도움이 되지 않을까 싶네요. ㅎㅎ

그렇다고 자바스크립트(javascript)를 무시하면 안 된답니다.

jQuery도 자바스크립트로 만들었거든요.

 

우선 jQuery를 사용하려면 해당 js 파일을 다운로드하여야 합니다.

https://jquery.com/download/

 

Download jQuery | jQuery

link Downloading jQuery Compressed and uncompressed copies of jQuery files are available. The uncompressed file is best used during development or debugging; the compressed file saves bandwidth and improves performance in production. You can also download

jquery.com

production과 development가 있는데

용량을 가볍게 하고 jQuery라이브러리를 수정하지 않고 사용만 한다면

production으로 다운로드하면 되고

jQuery 라이브러리 소스를 수정하거나 분석이 필요하다면

development로 다운받으면 됩니다.

오른쪽 클릭 후 다운로드하면 됩니다.

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<!DOCTYPE html>
<html>
    <head>
        <title>tiBoyTest</title>        
        <script src="js/jquery-3.5.1.js"></script>
    </head>
    <body>
        <div id="test1">Test jQuery</div>
        
        <script>
            $(document).ready(function(){
                alert('hi');
            });
        </script>
    </body>
</html> 
cs

 

js 폴더에 jquery-3.5.1.js를 다운로드했습니다.

그리고 $()를 사용하고 있습니다.

원래 jQuery()로 사용하는데 더 간단하게 표현하고 위해 단축으로 $를 사용하고 있답니다.

$(document).ready(function(){

이 구문을 해석하면 html파일이 실행되면

DOM(Document Object Model, 문서객체모델)을 호출하는 부분이 $(document)입니다.

.ready는 DOM의 속성으로 준비, 즉 화면이 로딩되는 시점의 준비를 의미합니다.

그리고 function()을 사용해서 구현을 하면 됩니다.

 

그럼 간단하게 사용하는 방법을 살펴볼게요.

우선 <div> 처럼 요소를 선택해서 명령을 전달할 수 있습니다.

$("div").hide();

두 번째로 CSS에서 사용하는 class 값을 사용할 수 있습니다.

<div class="d01">

$(".d01").hide();

주의할 점은 클래스 값을 사용하는 경우는 반드시 .을 붙여서 사용합니다.

마지막으로 id를 사용하는 방법이 있습니다.

특정 부분에 대해 명령을 하고 싶을 때 사용하면 유용합니다.

<div id="d_01" class="d01">

$("#d_01").hide();

주의할 점은 id를 사용할 때는 반드시 #을 붙여서 사용해야 합니다.

이렇게 요소는 이름 그대로 사용하고,

클래스 값은 .을 붙여서 사용하며,

id는 #을 붙여서 구분할 수 있답니다.

이제 기본적으로 요소를 선택하는 방법을 알았으니

다양한 메서드(함수)를 사용하는 방법에 대해 준비해보겠습니다.

아래 하트(공감) 버튼을 눌러서 더 다양한 글을 쓸 수 있게 응원 부탁드립니다. 감사합니다.

 

반응형

'Software > jQuery' 카테고리의 다른 글

[jQuery/javascript]$와 $()에 대한 이야기. 제이쿼리  (0) 2023.06.19
반응형

안녕하세요. 신기한 연구소입니다.

요즘 프로젝트를 하는 중인데요.

기존 SQL을 참고해서 새로운 SQL문을 사용하는 방식인데 문제는 테이블명과 컬럼명이 변경되었다는 겁니다.

기존 컬럼명을 새로 바뀐 컬럼으로 바꾸는 작업이 거의 노동 수준이라 자동화를 위해 고민해봤습니다.

매핑 정보를 CSV로 변경해서 자동으로 비교 후 변환하는 작업을 하려다 보니

파일 정보를 읽어야 하는 상황이 생겼습니다.

그래서 간단하게 사용할 수 있게 코딩해봤습니다.

 

 

자바에서 제공하는 I/O Streams(스트림)은

Byte Streams, Character Streams, Buffered Streams, Scanning, Data Streams, Object Streams으로 구성되는데요.

Character Streams를 사용해서 파일을 읽는 방법을 알아보겠습니다.

먼저 CSV 파일을 만들었습니다.

이 파일을 읽어서 txt파일로 변환도 하고 출력도 하도록 코딩해보겠습니다.

 

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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
package a.b;
 
import java.io.FileReader;
import java.io.FileWriter;
import java.io.IOException;
 
 
public class TestExcel {
 
    public static void main(String[] args) throws IOException {
        // TODO Auto-generated method stub
        
        //스트림 IO 선언
        FileReader inputStream = null;
        FileWriter outputStream = null;
        
        //스트림으로 읽을  파일 변수
        int c;
 
        try {
            //읽을 파일
            inputStream = new FileReader("C:/TestData/csvData.csv");
            //읽은 내용으로 새로 만들 파일
            outputStream = new FileWriter("C:/TestData/csvData.txt");
 
            
            //read()메서드를 사용해서 한 글자씩 읽음.
            while ((c = inputStream.read()) != -1) {
                //int로 읽은 스트림을 문자로 확인하기 위해 char ch로 형변환.
                char ch = (char)c;                
                System.out.println(ch);
                
                //새로운 파일을 만듬
                outputStream.write(c);
            }
            
        } finally {
            //사용 후에는 무조건 닫아줘야 함.
            if (inputStream != null) {
                inputStream.close();
            }
            if (outputStream != null) {
                outputStream.close();
            }
        }
    }
 
}
cs

 

실행을 하면 csvData.txt가 생성됩니다.

그리고 char로 출력이 됩니다.

이렇게 한 글자씩 출력이 됩니다. (윗부분만 캡처했습니다.)

하지만 불편한 점 이 있네요.

CSV의 처음 파일을 보면 한 줄씩 row단위로 데이터를 만들고 있는데 

출력은 한 글자씩 나오고 있습니다.

한 줄로 데이터를 받으면 더 편하겠네요.

그런 경우는 BufferedReader()를 사용해서 rereadLine() 메서드를 사용하면

문자열 라인으로 출력이 가능합니다.

 

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
32
33
34
package a.b;
 
import java.io.BufferedReader;
import java.io.FileReader;
import java.io.IOException;
 
 
public class TestExcels {
 
    public static void main(String[] args) throws IOException {
        // TODO Auto-generated method stub
        
        //스트림 IO 선언
        BufferedReader inputStreamLine = null;
        String l = "";
        
        try {
            //읽을 파일
            inputStreamLine = new BufferedReader(new FileReader("C:/TestData/csvData.csv"));
 
            while ((l = inputStreamLine.readLine()) != null) {
                //문자열 단위, 한 줄씩 읽음.
                System.out.println(l);
            }
            
        } finally {
            //사용 후에는 무조건 닫아줘야 함.
            if (inputStreamLine != null) {
                inputStreamLine.close();
            }
        }
    }
}
 
cs

 

위 예제는 문자열 단위로 뽑아 옵니다.

결과는 다음과 같습니다.

코드가 무겁지 않아 보이네요.

문자 단위나 문자열로 추출하는 방법에 대해 알아봤습니다.

이 코드를 가지고 잘 사용해봐야겠네요.

 

오라클 자바 튜토리얼을 참고해서 만들어봤는데요. 

자바 공부하기에는 가장 좋은 교재로 생각됩니다.

아래 하트(공감) 버튼을 눌러서 더 다양한 글을 쓸 수 있게 응원 부탁드립니다. 감사합니다.

반응형