우편번호 정렬 문제를 해결해보자.

알고리즘을 그려야 하지만 간단한 문제일 것 같아서 글로만 순서를 작성해 봤다.

버튼1

#우편번호 전체 개수 출력

1.텍스트 칸에 5자리 우편번호를 입력 받는다.

1-1. 앞뒤 공백 자르기를 통해서 입력된 우편번호를 3자리로 만들고 문자열 합치기로 전체 값을 하나로 합친다.

2.우편번호 총개수를 파악한다.

3.배열에 집어 넣는다.


버튼2

#우편번호 중복제거 버튼구현

4. 우편번호 중복값을 제거 한다.

5. 버튼을 누르면 중복 제거된 우편번호의 개수를 출력한다.


(우편번호 중복제거를 하지 않고)버튼3

# 우편번호별 개수를 파악해서 테이블에 출력

와...대박 1-2시간안에 끝날 줄 알았는데... 총 5시간 정도 걸린것 같다. 아오......



위의 그림에서 우편번호부분을 드래그해서 메모장에 옮긴다음 복사!



그리고 위의 텍스트 창에 붙여 넣는다. 그럼 저렇게 12345 처럼 다섯 자리 우편번호 전체가 입력된다.

그리고 <입력 버튼>과 <중복제거 버튼> <우편번호별 개수보기 버튼>을 차례로 누르면



이런식으로 우편번호별 정렬이되고 값이 쭉 출력이 된다!!!!

그대로 긁어서 메모장에 옮긴 다음 엑셀에 가져다 붙이면 끝!!ㅋㅋㅋㅋ


아래는 소스코드


<html>

<head>

<title>우편번호 정리</title>

</head>

<body>  

<h1>우편번호 자동정리</h1>



우편번호<input type="text" name="tex" id="tex">

<input type="button" name="btn" id="btn" value="입력" onclick="btn_click();"></br>

우편번호 총개수는 <input type="text" name="tex1" id="tex1" value="0">개 입니다.

</br>


중복제거 <input type="text" name="tex2" id="tex2" value="0">

  <input type="button" name="btn2" id="btn2" value="중복제거" onclick="btn_click2();"></br>

</br>

<input type="button" name="btn3" id="btn3" value="우편번호별개수보기" onclick="btn_click3();">

<span><<<<<========</span>

<br>


<div><h3>정리할 우편번호를 입력한 뒤 우편번호별 개수보기 버튼을 클릭하세요</h3></div>

<div id="test"></div>


</body>


<script type="text/javascript">


//입력한 우편번호를 담을 배열 객체 선언

var postArr = new Array();


//중복제거 버튼 클릭했을때 5자리 우편번호를 3자리로 만든값을 담을 배열 객체 선언

var afterDelPostArr = new Array();


var str;



/*

################참고###############################

아래 arr.filter..를 거쳤을 때 결과값은 아래와 같다.

elem=016index=0self=016,017,018,022,

027,030,031,033,039,040,040,045,045,

045,045,047,047,048,049,049,049,049,049,

050,050,051,051,051,051,051,051,051,051,

052,053,053,053,053,058,061,061,061,062,065,

065,067,067,072,072,073,082,085,087,087,102,104,

104,108,114,117,120,124,129,132,138,139,146,150,152,

158,162,171,177,179,181,210,214,216,219,223,223,242,244,251,257,261,263,264,273,273,

286,314,317,319,340,378,427,470,478,489,490,490,513,540,545,546,550,557,589,612,619,636

*/



//2.단계 우편번호 중복제거 버튼 클릭

function texDupArr(arr) {


//우편번호 중복값을 제거한 후 결과값을 담을 배열 선언

var deldupPostArray = new Array();


var unique = arr.filter(function(elem, index, self) {

// 0 == 숫자전체.indexOf(016)

if(index == self.indexOf(elem)){

deldupPostArray.push(elem);

};

  });

return deldupPostArray;

}

  

  


// 1단계 우편번호 입력 눌렀을 때  

function btn_click(){


//입력받은 우편번호 가져오기

var postText = document.getElementById("tex");

//입력받은 우편번호를 문자열로 저장

str=postText.value;


//우편번호 사이 공백 제거

var delSpacePostText=str.replace( /(\s*)/g, "");



//5자리 수로 나누어서 우편번호 총 개수 파악후 출력

var PostResult = document.getElementById("tex1");

PostResult.value = delSpacePostText.length/5;



//우편번호 전체를 5자리로 잘라서 배열에 추가

var num=0;

var numPlus=5;

for(var a=0;a<delSpacePostText.length;a+=5){

var result=delSpacePostText.substring(a,numPlus);

numPlus+=5; 

//5자리 우편번호를 뒤 2자리 제거후 배열에 추가한다.

postArr.push(result.substring(0, 3));

num++;

}


//@결과 postArr 배열 에는 전체 입력받은 우편번호가 앞 3자리수로 잘려 들어가있다.

};





//중복제거 버튼

function btn_click2(){


//우편번호를 3자리로 만든 값 저장할 변수

var afterDelPostVal;

//입력 받은 5자리 우편번호 뒤에 2자리 제거 후 배열에 추가

for(var a=0;a<postArr.length;a++){

afterDelPostVal=postArr[a].substring(0, 3);

//결과 값을 배열에 순차적으로 추가

afterDelPostArr.push(afterDelPostVal);


};


//중복제거 함수에 중복을 제거할 배열 삽입

var texDupArrResult= texDupArr(afterDelPostArr);

//결과 값을 나타낼 요소값을 가져온 후 출력

var texDupArrResultText = document.getElementById("tex2");

texDupArrResultText.value=texDupArrResult.length;


};




//(중복을 제거 하지 않고) 우편번호 별로 개수 출력

function btn_click3(){

//우편번호 중복값을 제거하기 전의 값을 넣을 배열 객체 선언

var beforeDelPostArr = new Array();

for (var j=0; j<postArr.length; j++) {


//postArr는 우편번호 중복값 이 들어 있는 배열

var key = postArr[j].toString(); 

  

// 배열안 특정 위치에 숫자가 존재하지 않으면

if (!beforeDelPostArr[key]) {

  

//그곳에 1을 준다.

beforeDelPostArr[key] = 1

  

} else { //배열 특정위치에 숫자가 존재 하면 

//그 배열 특정위치 값에 +1을 한다.

beforeDelPostArr[key] = beforeDelPostArr[key] + 1;

}

}

//결과 값을 테이블로 만들어서 출력할 것.

var str = "<table style='border:1px gray solid;'>"; 


for (var j in beforeDelPostArr) {


str +="<tr><td style='border:1px gray solid;'>"+j+

"</td><td style='border:1px gray solid;'>"+beforeDelPostArr[j]+

"</td></tr>";

}

str+= "</table>";


//위에서 만든 테이블을 특정 <div> 위치에 붙인다.

var divTest = document.getElementById("test");

divTest.innerHTML = str;


}


</script> 


</html>



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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
<html>
    <head>
        <title>우편번호 정리</title>
    </head>
<body>  
        <h1>우편번호 자동정리</h1>
 
 
        우편번호<input type="text" name="tex" id="tex">
                <input type="button" name="btn" id="btn" value="입력" onclick="btn_click();"></br>
    
            
        우편번호 총개수는 <input type="text" name="tex1" id="tex1" value="0">개 입니다.
            
            </br>
 
        중복제거 <input type="text" name="tex2" id="tex2" value="0">
                       <input type="button" name="btn2" id="btn2" value="중복제거" onclick="btn_click2();"></br>
            </br>        
                        <input type="button" name="btn3" id="btn3" value="우편번호별개수보기" onclick="btn_click3();">
<span><<<<<========</span>
            <br>
 
            <div><h3>정리할 우편번호를 입력한 뒤 우편번호별 개수보기 버튼을 클릭하세요</h3></div>
            <div id="test"></div>
 
</body>
 
<script type="text/javascript">
 
//입력한 우편번호를 담을 배열 객체 선언
var postArr = new Array();
 
//중복제거 버튼 클릭했을때 5자리 우편번호를 3자리로 만든값을 담을 배열 객체 선언
var afterDelPostArr = new Array();
 
var str;
 
 
/*
################참고###############################
아래 arr.filter..를 거쳤을 때 결과값은 아래와 같다.
elem=016index=0self=016,017,018,022,
027,030,031,033,039,040,040,045,045,
045,045,047,047,048,049,049,049,049,049,
050,050,051,051,051,051,051,051,051,051,
052,053,053,053,053,058,061,061,061,062,065,
065,067,067,072,072,073,082,085,087,087,102,104,
104,108,114,117,120,124,129,132,138,139,146,150,152,
158,162,171,177,179,181,210,214,216,219,223,223,242,244,251,257,261,263,264,273,273,
286,314,317,319,340,378,427,470,478,489,490,490,513,540,545,546,550,557,589,612,619,636
*/
 
 
//2.단계 우편번호 중복제거 버튼 클릭
function texDupArr(arr) {
 
//우편번호 중복값을 제거한 후 결과값을 담을 배열 선언
var deldupPostArray = new Array();
 
    var unique = arr.filter(function(elem, index, self) {
            // 0 == 숫자전체.indexOf(016)
        if(index == self.indexOf(elem)){
    
            deldupPostArray.push(elem);
        };
     });
                return deldupPostArray;    
}
  
  
 
// 1단계 우편번호 입력 눌렀을 때  
function btn_click(){
 
    //입력받은 우편번호 가져오기
    var postText = document.getElementById("tex");
        
        //입력받은 우편번호를 문자열로 저장
        str=postText.value;
 
        //우편번호 사이 공백 제거
        var delSpacePostText=str.replace( /(\s*)/g, "");
 
 
        //5자리 수로 나누어서 우편번호 총 개수 파악후 출력
        var PostResult = document.getElementById("tex1");
        PostResult.value = delSpacePostText.length/5;
 
 
        //우편번호 전체를 5자리로 잘라서 배열에 추가
        var num=0;
        var numPlus=5;
        
        for(var a=0;a<delSpacePostText.length;a+=5){
            var result=delSpacePostText.substring(a,numPlus);
            
            numPlus+=5
            
            //5자리 우편번호를 뒤 2자리 제거후 배열에 추가한다.
            postArr.push(result.substring(03));
            
            num++;
        }
 
//@결과 postArr 배열 에는 전체 입력받은 우편번호가 앞 3자리수로 잘려 들어가있다.
};
 
 
 
 
//중복제거 버튼
function btn_click2(){
 
//우편번호를 3자리로 만든 값 저장할 변수
var afterDelPostVal;
        
        //입력 받은 5자리 우편번호 뒤에 2자리 제거 후 배열에 추가
        for(var a=0;a<postArr.length;a++){
            
            afterDelPostVal=postArr[a].substring(03);
            
            //결과 값을 배열에 순차적으로 추가
            afterDelPostArr.push(afterDelPostVal);
 
};
 
        //중복제거 함수에 중복을 제거할 배열 삽입
        var texDupArrResult= texDupArr(afterDelPostArr);
        
        //결과 값을 나타낼 요소값을 가져온 후 출력
        var texDupArrResultText = document.getElementById("tex2");
        texDupArrResultText.value=texDupArrResult.length;
 
};
 
 
 
//(중복을 제거 하지 않고) 우편번호 별로 개수 출력
function btn_click3(){
    
        //우편번호 중복값을 제거하기 전의 값을 넣을 배열 객체 선언
        var beforeDelPostArr = new Array();
        
            for (var j=0; j<postArr.length; j++) {
 
            //postArr는 우편번호 중복값 이 들어 있는 배열
            var key = postArr[j].toString(); 
  
            // 배열안 특정 위치에 숫자가 존재하지 않으면
            if (!beforeDelPostArr[key]) {
  
            //그곳에 1을 준다.
            beforeDelPostArr[key] = 1
  
            } else { //배열 특정위치에 숫자가 존재 하면 
            
                //그 배열 특정위치 값에 +1을 한다.
                beforeDelPostArr[key] = beforeDelPostArr[key] + 1;
            }
        }
        
    //결과 값을 테이블로 만들어서 출력할 것.
    var str = "<table style='border:1px gray solid;'>"
 
        for (var j in beforeDelPostArr) {
 
            str +="<tr><td style='border:1px gray solid;'>"+j+
            "</td><td style='border:1px gray solid;'>"+beforeDelPostArr[j]+
            "</td></tr>";
        }
            str+= "</table>";
 
                //위에서 만든 테이블을 특정 <div> 위치에 붙인다.
                var divTest = document.getElementById("test");
                divTest.innerHTML = str;
 
}
 
</script> 
 
</html>
cs


내림차순은 따로 처리를 해줘야 한다.

예외처리나 디자인 이런건다 안했음ㅋㅋ 나중에 시간날때 한번 작업해보기로 하고

이거 하면서 느낀건 차라리 액셀을 배우는게 더 시간적으로 빨랐을 듯ㅋㅋ

에효


나는 서울에 작은 출판사에서 일한다. 

가끔 글도 쓰고, 

가끔 개발도 하고,

가끔은 중국 출장도 가고...

난 뭘까...?


각설하고 출판사다 보니 매달 책과 제작물을 만들고 전국에 있는 구독자들에게 보낸다.

제일 뿌듯할 때다ㅋ

근데 얼마전 배송을 담당하는 분께서 엑셀을 붙잡고 한참을 끙끙대고 있는 것을 발견했다.

문제는 우편번호 정렬이었다.


우체국에 우편물을 접수할때 우편번호별 묶음으로 접수를 하면 더 저렴하다.(위에 그림 처럼)

근데 이 우편번호 묶는 방법이 있다.

예로들면  01234, 01256  

위에 두 우편번호가 있으면 앞에 세자리 즉, 012 별로 묶어야 하고 내림차순 정리를 해야 한다. 그리고 그 묶음 별로 개수를 구해야 한다.

012 : 2개 이런식으로.

(위에 그림 참고)



(위의 이 데이터를 가지고 우편번호 정렬을 한다. )


근데 엑셀로 정리하기가 여간 까다로운게 아니다. 엑셀을 해본 사람은 알겠지만 숫자 앞에 0 을 붙이면 0 이 사라져서 출력이 된다.

01234 를 입력하면 1234가 입력된다. 뭐 엑셀 고수들은 방법이 있겠지만 그분은 엑셀에 익숙하지 않았다.

서식을 통해서 0을 붙여도 내림차순이 안됐다.(물론 방법이 있을거다! 내가 못찾았을 뿐ㅠ)

그 담당자는일일이 번호를 새고, 직접 입력하고 있었다. 

중간에 실수를 해서 다시 처음부터 새기도 했다. 

매달 이런식으로 고생을 하셨단 말인가!


옆에서 보고, 그때 머릿속에 그냥 우편번호 전체를 입력하면 알아서 앞에 3자리로 잘라서, 우편번호 별로 개수를 출력해주는 프로그래밍을 만들면 안될까 라는 생각이 떠올랐다. 대충 몇가지 함수들이 생각이 났다.ㅋㅋ

퇴근 후에 한번 만들어봐야지.












+ Recent posts

티스토리 툴바