#28 자바스크립트(JavaScript) - concat, join

안녕하세요 여러분! 에이블디 입니다!

 

이번 시간에는 지난 시간에 이어 Array 객체에서 사용할 수 있는 함수들에 대해 알아보려 해요!

 

코드를 작성하다 보면 배열에 값을 추가하거나, 삭제하거나, 아니면 배열끼리 값을 합친다던가 하는 등의 상황이 발생하는데요, 이번 시간에는 concat 함수와 join 함수에 대해 알아보겠습니다.

 

먼저 concat 함수에 대해 알아보도록 하겠습니다!

concat 함수는 기존의 배열에 또 다른 배열이나 값을 합쳐서 새로운 배열을 만드는 함수입니다.

 

예를 들어 hyundai 배열과 kia 배열이 있을 때 concat 함수를 사용해 두 개의 배열을 합쳐서 새로운 배열을 만들 수 있습니다.

예시 코드는 다음과 같습니다.

var hyundai = ["avante", "sonata", "grandeur"];
var kia = ["k3", "k5", "k7"];

hyundai.concat(kia);

코드를 실행시켜 보면

 

 

두 배열의 값이 합쳐져서 하나의 배열로 출력되는 것을 확인할 수 있습니다.

 

concat 함수를 사용할 때 hyundai 배열과 kia 배열 순서를 바꾸면 연결 순서가 달라집니다.

kia.concat(hyundia);

코드를 실행시켜 보면

 

 

위의 코드와 배열의 순서가 바뀌어 출력되는 것을 확인할 수 있습니다!

 

concat 함수에 사용한 기존의 두 배열은 concat 함수는 새로운 배열을 만드는 것이기 때문에 기존의 hyundai 배열과 kia 배열에 영향을 주지 않습니다.

 

 

코드로 직접 실행시켜보면 위와 같이 기존의 배열들은 영향을 받지 않는 것을 확인할 수 있습니다!

 

다음은 join 함수입니다.

join 함수는 배열 값을 연결하는 함수인데요, 배열 값을 연결해서 나열할 때 각 배열의 값 사이에 넣을 구분 기호가 필요한데, join 함수는 이 기호를 직접 지정할 수 있습니다.

join 함수에서 구분 기호를 지정하지 않으면 자동으로 쉼표(,)로 요소를 구분합니다.

 

위에서 만든 kia 배열을 사용하여 join 함수를 학습해 보겠습니다!

kia.join()

kia.join("-")

하나는 구분 기호를 지정하지 않고 join 함수를 사용하였고, 다른 하나는 구분 기호 ( - )를 사용하여 join 함수를 사용해 보았습니다.

코드를 실행시켜 보면

 

 

구분 기호를 지정하지 않고 join 함수를 사용했을 때는 자동으로 쉼표가 구분 기호로 사용되고, 구분 기호를 지정하여 join 함수를 사용했을 때는 지정한 구분 기호( - )가 적용되어 배열의 값들이 연결되어 출력된 것을 확인할 수 있습니다!

 

이번 시간에는 concat과 join 함수에 대해 알아보았는데요! 다음 시간에 다른 함수에 대해 더 알아보도록 하겠습니다!