[TIL/JavaScript] 2023/01/17

원민관·2023년 1월 17일
0

[TIL]

목록 보기
14/159

Array.method 개론

배열(Array)을 놓고 '.'을 입력하면 다양한 메소드(Method)가 제시된다. 'method'는 기본적으로 function과 유사한 의미로 사용된다. 입력값(매개변수 또는 인자)을 받고 결과값(return값)을 도출해낸다. 여기에서 잠시!

매개변수와 인자는 다음과 같이 분명히 구별되는 개념이다.

-매개변수(Parameter): 전달된 인자를 받아들이는 '변수'를 의미한다.
-인자(Argument): 어떤 함수를 호출할 때, 전달받는 '값'을 의미한다.

'Array'는 기본적으로 'object'이다. 사실 헷갈려서 콘솔을 찍어봤다. 내 말이 맞다.

앞서 method가 function과 유사하다고는 했지만 method가 무엇인지에 관해서는 언급하지 않았다.

내가 내린 결론은 다음과 같다. '객체'를 예컨대 '자동차'라고 한다면, '전진' 혹은 '후진' 등의 세부적인 '작동 방식'이 바로 'method'라는 것이 바로 그것이다.

요컨대 'Array'를 '전진' 또는 '후진'의 방식으로 작동케 하는 것이 'method'인 것이다. 나만의 정의를 내리기 위해 꽤나 고심했는데 적절한 비유인지는 모르겠다.

여하튼 method의 정의를 살펴보았고, 오늘은 여러가지 method 중에서도 'map'이라는 method에 대해 학습했다.

Array.prototype.map()

'map method'는 모든 배열 내부의 items에 대하여 function을 실행하는 method이다. map의 기능적인 역할을 아주 잘 보여주는 예시를 작성해봤다.

'1, 2, 3, 4'의 items로 구성된 'arr' 배열을 선언했고, 추가적으로 'map1'이라는 변수를 선언했는데, 'map1'은 'arr' 배열 각각의 itme에 3씩을 곱해주는 map method를 포함하고 있다.

map method가 '1, 2, 3, 4'의 배열로 구성된 '자동차'를 3씩 곱해지는 '작동'을 하게끔 하고 있음을 볼 수 있다. 콘솔로 찍어보니 각각의 item이 '3, 6, 9, 12'로 변형되었다.

map method가 입력값을 받고 출력값을 도출하는 구조라면, map method 내부에 function keyword를 통해 function을 작성해도 결과는 마찬가지 아닐까? 누군가에게는 당연하겠지만 초보자는 꼭 해봐야 직성이 풀린다.

1부터 6까지의 숫자로 구성된 배열을 선언했고, 'newNumbers'는 (number * 3)을 해주는 function을 포함한 map method가 사용된 새로운 작동 방식이다. 다행스럽게도 newNumbers를 콘솔에 찍어보니 바라던 결과값이 도출됐다.

이와 유사하게 function을 밖으로 꺼내고 map을 사용하는 방식도 연습해봤다.

map method에 관한 색다른 예시를 찾아보고 입력해봤다.

배열에 숫자를 각각 2씩 곱하고 값을 '반대로' 현출하는 작업도 해봤다. "이런 것도 있구나!"하는 느낌으로 작성해봤다. 뭐든 알아서 나쁠 건 없으니까.

array 내부에 array가 있을 때 map method로 조작하는 방식도 연습해봤다. 변형은 끝이 없다.

회고

여러 method 중에서 'map' 하나만 공부하려고 해도, 숙달해야할 내용이 이렇게나 많다.

'겸손'은 "그래도 되고, 아니면 말고"식의 '미덕'이 아니라, 반드시 갖추어야 할 '생존전략'이 아닌가 생각해봤다. 겸손을 잃는 순간 배움을 쫓지 않을 것이고, 자연스럽게 도태될 테니까...

'하늘에서 내리는 쓰레기' 이슈로, 오늘 배운 코드를 한 번씩 더 쳐보고 퇴근하도록 하겠다. 내일도 화이팅!

profile
Write a little every day, without hope, without despair ✍️

0개의 댓글