항해 5일)JS - 1프로그래머스 직사각형 별찍기

문제 설명

이 문제에는 표준 입력으로 두 개의 정수 n과 m이 주어집니다.
별(*) 문자를 이용해 가로의 길이가 n, 세로의 길이가 m인 직사각형 형태를 출력해보세요.

---

제한 조건

• n과 m은 각각 1000 이하인 자연수입니다.

---

예시

입력

5 3

출력

*****
*****
*****

process.stdin.setEncoding('utf8');
process.stdin.on('data', data => {
    const n = data.split(" ");
    const a = Number(n[0]), b = Number(n[1]);
    console.log(a);    //5
    console.log(b);  //3
});

 

 

 

 

 

답안 

1.번 케이스

process.stdin.setEncoding('utf8');                       // 인코딩 3byte로
process.stdin.on('data', data => {                      // 이 함수를 통해 입력한   5 3   을 받는다.
    const n = data.split(" ");                             // 빈 문자열 기준으로 나누어 배열에 저장 ["5", "3"]
    const a = Number(n[0]), b = Number(n[1]);    // n의 인덱스0을 숫자로 바꿔 a에 넣는다. a는 문자5에서 숫자5

                                                                // n의 인덱스1을 숫자로 바꿔 b에 넣는다. b는 문자3에서 숫자3     
    const star = "*".repeat(a)      //a만큼 반복해서 붙인다. a는 숫자5이고 별 5개가 붙는다. *****
    for(let i =0; i < b; i++){        //0에서  b인 숫자3만큼 console.log로 하나씩 붙여서 출력된다. (for문 동작 아래참조)
    console.log(star);                // 결과 - 별5개가 3번 반복해서 출력된다.
    }
});

------------------

출력결과

*****

*****

*****

 

정리

star라는 변수의 값은 repeat()함수로 a만큼 * 반복해서 붙고
그 과정을 for문으로 b번 만큼 반복해서 출력한다.

 

2.번 케이스

process.stdin.setEncoding('utf8');
process.stdin.on('data', data => {
    const n = data.split(" "); 
    const a = Number(n[0]), b = Number(n[1]); 

    for(let i=0; i<b; i++){        //i을 선언해주고 b(3)만큼 반복
        let str = "";                 //출력할 변수 빈문자열로 선언
        for(let j=0; j<a; j++){    // j선언후 별을 한줄에 a(5)만큼 반복해서 찍는다
            str = str + "*"         //출력할 변수에 별을 담는다
        } 
    console.log(str) // 출력
    }
});

 

 

3.번 케이스  이중for문

process.stdin.setEncoding('utf8');
process.stdin.on('data', data => {
    const n = data.split(" ");
    const a = Number(n[0]), b = Number(n[1]);
    
    for ( let i = 0; i <  b; i++ ) {    // b(3)만큼 돌아 세로로 3줄 출력
        for ( let j = 0; j < a; j++ ) {  //a(5) 만큼 돌아 세로에 3줄에 5개씩 붙는다
          process.stdout.write('*');    //줄바꿈없이 출력 5개씩 총 3줄이 연달아 붙는다 (총15개 한줄에 찍힘)
        } console.log('')                 //줄바꿈
    };
});

 

 

console.log(''); 줄바꿈 예시

 

4. 번 케이스

process.stdin.setEncoding('utf8');
process.stdin.on('data', data => {
    const n = data.split(" ");
    const a = Number(n[0]), b = Number(n[1]);
    const star = `${'*'.repeat(a)}\n`;            

 

    console.log(star.repeat(b));

});

 

 

 

※ 알아야할 것 ※

1. split() : 입력받은 특정문자를 기준으로 문자열을 나누어 배열에 저장하여 리턴함
2. Number() : 다른 타입의 값을 숫자로 바꿈
3. repeat() : 메서드는 문자열을 주어진 횟수만큼 반복해 붙인 새로운 문자열을 반환함
4. for문 : 반복문 조건만큼 업데이트해서 반복 출력함
5. process.stdin 속성 : process.stdin외부에서 전달된 데이터를 가져오는 Node의 방법 (사용자 입력받음)

 

 

1. split()   문자열을 나누어 배열에 저장하여 리턴함

let a = "우리 나라 만세 최고 좋아";  //문자열
let n = a.split(" ");   // a를 " "빈 문자열 기준으로 나눈다. 
n                       //n출력 

출력결과

(5) ['우리', '나라', '만세', '최고', '좋아']  // 결과: 5개의 문자열 객체가 있는 배열[ ] n이 출력됨

 

let n1 = n[0];      // n1에 n의 인덱스0을 넣는다.
n1                   // n1 출력

출력결과
'우리'

 

 

 

2. Number()   다른 타입의 값을 숫자로 바꿈

var a = "5";  //문자열5
var b = "3";  //문자열3

var aN = Number(a);  //문자열a를 Number()함수로 숫자로 변환해 aN에 담음
var bN = Number(b);

c = a+b;  // 문자열 더하기
'53'        //결과 문자 5와3
cN = aN + bN;   // 숫자 더하기
8           //결과 숫자 8

 

 

3. repeat() 문자열을 주어진 횟수만큼 반복

 

4. for문   반복문. 조건만큼 반복실행될코드가 업데이트되어 출력

var array = [1,2,3,4,5,6,7,8,9,10];
//     ①초기화구문;           ②조건식;           ④업데이트구문

for( var i = 0;         i < array.length;            i++){

// ③반복 실행될 코드
console.log(array[i]);
}

 

작동순서

①초기화구문에서 ②조건만큼 ③실행되고

④업데이트구문작동한다

 

반복실행될 코드는 조건식 조건에 맞을때만 실행True일경우 1 > 2 > 3 > 4 > 2 > 3 > 4 순으로 작동

False이면  ②조건식이 작동되지않고 ①초기화구문까지만 작동하고 끝난다.

초기화구문은 항상 처음에만 실행되고 끝 더 작동 안함.

단!!

continue문 만나면 업데이트구문 실행하고
 조건식으로 넘어감

 

 

5. process.stdin.on()  데이터를 입력받는다.

process.stdin외부에서 전달된 데이터를 가져오는 Node의 방법으로 이것은 일반적으로 사용자가 입력한 텍스트 데이터이지만 다른 응용 프로그램에서 가져올 수도 있다. 

process.stdin 속성 은 사용자 입력을 수신 하는 프로세스 모듈 의 내장 응용 프로그래밍 인터페이스이다 . 프로세스 개체 의 stdin 속성은 읽기 가능한 스트림이다. on() 함수를 사용 하여 이벤트를 수신한다.

통사론:

프로세스.stdin.on();

반환 값: 어떤 값도 반환하지 않습니다.

매개변수: 이 속성은 사용자로부터 입력을 받습니다.

 

 

 

 

 

표준입력의 의미를 잘 몰라서 그 의미를 파악하느라 오래 걸렸다. 여러 사이트에서 값을 입력 받는다 라는 글을 보았어도 인식이 되지않았다. stdin 여전히 정확하진 않지만 값을  사용자에게 입력 받는다 이다.

우리에겐 다양한 고민의 시간이 필요하다.

 

 

 

참고 

- process.stdin관련 -

* node.js 공식

https://nodejs.org/api/process.html#process_process_stdin

* 프로그래밍 가르치는 외국사이트 GeeksforGeeks- stdin,stdout 표준입출력

https://www.geeksforgeeks.org/node-js-process-stdin-property/

* 개인블로그 - stdin/stdout 표준입출력을 처리하기 

https://m.blog.naver.com/PostView.naver?isHttpsRedirect=true&blogId=zerosum99&logNo=120208002778 

freeCodeCampe-외국커뮤니티

https://forum.freecodecamp.org/t/node-functions-process/96340/2

 *외국유툽

https://www.youtube.com/playlist?list=PL4cUxeGkcC9gcy9lrvMJ75z9maRw4byYp

*for문 유툽

https://www.youtube.com/watch?v=IFDxEnA8-Wc

* 중첩for문 유툽

https://youtu.be/tS_kELn3m9U 

*자바스크립트 기본입출력

https://lamarr.dev/javascript/2020/04/06/01.html