(200130_TIL) 'Matrix'

▶ Matrix

Matrix (행렬)

(Problem)

Introduction

Given a string representing a matrix of numbers, return the rows and columns of that matrix.

So given a string with embedded newlines like:

9 8 7
5 3 2
6 6 7

representing this matrix:

    1 2 3
  |---------
1 | 9 8 7
2 | 5 3 2
3 | 6 6 7

your code should be able to spit out:

• A list of the rows, reading each row left-to-right while moving top-to-bottom across the rows,
• A list of the columns, reading each column top-to-bottom while moving from left-to-right.

The rows for our example matrix:

• 9, 8, 7
• 5, 3, 2
• 6, 6, 7

And its columns:

• 9, 5, 6
• 8, 3, 6
• 7, 2, 7

- 주어진 행렬의 rows 와 columns 의 측면의 따라서, 반환하는 결과가 달라진다.

- rows(가로)를 기준으로 봤을 때는, 9/8/7 ,5/3/2, 6/6/7 로 결과를 반환한다.

- columns(세로)를 기준으로 봤을 때는, 9/5/6 , 8/3/6 , 7/2/7 의 결과를 반환한다.

 

(Tip)

- Matrix라는 클래스를 만들어서 진행한다.

- Matrix라는 클래스에는, constructor / rows / columns 메서드들이 있다.

- Matrix 에는 숫자가 들어가고, \n 으로 행렬을 만든다.

- rows 일 때는, \n을 기준으로 split 했을 때, 요소 값이 된다.

- columns 일 때는, \n을 split으로 나눈 배열에서의 위치 값이 된다.

 

(Solution)

export class Matrix {
  constructor(matrix) {
    this.matrixArray = matrix.split('\n').map((array) => array.split(" ").map((array) => parseInt(array)));
  }
 
  get rows() {
    return this.matrixArray;
  }
 
  get columns() {
    this.columnArray = this.matrixArray[0].map((col,index) => this.matrixArray.map((row) => row[index]));
    return columnArray;
  }
}

여기서 제일 중요한 것은,  map() 과 split() , parseInt() 그리고 getter() 이다.

 

우선, map() 에 대해서 먼저 알아보자면, 

 

2dubbing.tistory.com/8

javascript의 map() 이란..?

yuddomack.tistory.com/entry/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-Array-map

자바스크립트 Array map

caileb.tistory.com/196

javascript - 반복문(for, forEach/map, for..in/for..of)

 

해당 사이트들을 읽어보면 알 수 있다시피

 

map()은 forEach와 for과 비슷한 기능을 하며, Array의 각 요소를 순회하며 callback 함수를 실행한다.

callback에서 return 되는 값을 배열로 만들어내는 것이다.

 

해당 문제에서는 set이 아닌, get()을 사용했기에, constructor에서 처리를 다하고 get으로 받기만 해야하는 상황이다.

(set() 내에는 파라미터로 value값을 전달할 수 있지만, get()은 하지못함. )

 

matrix로 주어지는 문자열을 배열로 바꾸고, 해당 배열에서 직접 뽑아쓰는 코드를 작성해야한다.

 

split()을 통해서, '\n' 과 ' '(띄어쓰기) 를 쪼개고, 해당 배열의 인덱스 값이 문자열로 나오기 때문에 parseInt() 로 Number값으로 바꿔준다.

 

get columns 에서의 문장이 제일 복잡한데, 해당 공식문서를 참고하면 이해가 가능하다.

 

arr.map(callback(currentValue[, index[, array]])[, thisArg])

매개변수
callback : 새로운 배열 요소를 생성하는 함수. 다음 세 가지 인수를 가집니다.
            -currentValue : 처리할 현재 요소
            -index(optional : 사용해도 되고 안해도 되고) : 처리할 현재 요소의 인덱스
            -array(optional : 사용해도 되고 안해도 되고) : map()을 호출한 배열
            -thisArg(optional : 사용해도 되고 안해도 되고) : callback을 실행할 때this로 사용되는 값

 

 

www.codingfactory.net/10424

JavaScript / Object / String.split() / 문자열 분할하는 메서드

curryyou.tistory.com/187

[JS] 자바스크립트 형변환 #2: string to number 등

 

이렇게 split()과 parseInt()를 처리한 matrixArray를 get rows() 에서 그대로 return 한다.

columns 메서드 처리는, map()을 사용해서 새로운 배열로 변경처리하고 return 값으로 columnArray를 반환한다.

 

getter 과 setter의 차이점을 명확하게 알고 가는것 또한 굉장히 중요하다.

mygumi.tistory.com/161

getter setter in ES6 :: 마이구미

getter과 setter 등을 쓰는 가장 큰 이유는 "정보 은닉"이다. 직접적으로 코드를 작성하는 것이 아닌, 그저 받아오는 것에만 사용하기 때문에 굉장히 좋은 방법이다.

getter => 변수 x / 클래스에서 변수를 받아오는 것 

setter => 변수 o / 클래스에서 변수를 가져올 수 있고, 설정할 수 있음